Magento - 可配置的产品选项图像

Bos*_*h99 4 magento option

我目前正致力于为我的第一个magento版本显示产品选项的图像.我有想出了捆绑的产品,就像这样:

截图

当构建选项的选项时,我正在获取相关图像的URL(例如样本).现在我正在尝试对可配置产品做同样的事情,但它似乎并不那么简单.

可配置产品由简单的产品构建,代表可用选项的每次迭代.大.我显然可以为每个简单的产品上传图像,这对解决这个问题是个好的开始.

例如:椅子有3个室内装潢和2个扶手选择(6个简单的产品).对于椅子2/b,我上传室内装潢样品2和扶手样品b,并相应地标记它们.当选项构建完成后,我会抓取与每个简单产品相关联的图像网址(可能会抓取该标签的所有图像并删除重复项或某些东西?)...

在Magento,我看到:

theme/catalog/product/view/type/option/configurable.phtml中

<?php foreach($_attributes as $_attribute): ?>
    ..// 
    <select name="super_attribute[<?php echo $_attribute->getAttributeId() ?>]" id="attribute<?php echo $_attribute->getAttributeId() ?>" class="required-entry super-attribute-select">
        <option><?php echo $this->__('Choose an Option...') ?></option>
    </select>
    ..//
</div>
<?php endforeach; ?>
<script type="text/javascript">
    var spConfig = new Product.Config(<?php echo $this->getJsonConfig() ?>);
</script>
Run Code Online (Sandbox Code Playgroud)

与捆绑包不同,可配置的产品选择/选项通过javascript(in js/varien/configurable.js)注入到页面中.然后,该类依赖于在此之后getJsonConfig()提供所有信息.

此时,似乎我应该能够从该对象获取简单产品的图像URL信息.我在configurable.js中看不到处理图像的逻辑. 我将如何获取这些网址并将其与相关选项相关联?

关于如何进行这项工作的任何建议都会很棒.

干杯


......还有:这真的看起来像是绝对必要的功能.为什么magento不支持这样的东西开箱即用?


更新

对于那些对类似事物感兴趣的人,我终于明白了这一点.

我的第一种处理方法 - 从儿童产品中获取图像在一定程度上起作用,但在尝试抓取多组属性的唯一图像网址时却很复杂.它还意味着必须为简单产品中的每个选项提供图像,因此 - 大量不必要的劳动力.

我最终使用了@Greg Demetrick建议的免费插件(有一些修改).它是一个非常可靠的小模块,允许图像网址与任何属性选项/以及抓取它们的几种方法相关联.

我的最终解决方案看起来有点像这样:

目录/产品/视图/类型/选项/ configurable.phtml:

<?php foreach($_attributes as $_attribute): ?>

  // markup for the attribute

    <script type="text/javascript">
        //<![CDATA[
        var attribute_data_<?php echo $_attribute->getAttributeId() ?> = {};
            attribute_data_<?php echo $_attribute->getAttributeId() ?>.id = '<?php echo $_attribute->getAttributeId() ?>';
            attribute_data_<?php echo $_attribute->getAttributeId() ?>.title = '<?php echo $_attribute->getLabel() ?>';
            attribute_data_<?php echo $_attribute->getAttributeId() ?>.data = {};
        <?php 
        $a = Mage::getModel('eav/config')->getAttribute('catalog_product', $_attribute->getAttributeId() );
        $helper = Mage::helper('attributeoptionimage');
        foreach ( $a->getSource()->getAllOptions(true) as $option): ?>
            attribute_data_<?php echo $_attribute->getAttributeId() ?>.data.option_<?php echo $option['value'] ?> = {};
            attribute_data_<?php echo $_attribute->getAttributeId() ?>.data.option_<?php echo $option['value'] ?>.val = '<?php echo $option['value'] ?>';
            attribute_data_<?php echo $_attribute->getAttributeId() ?>.data.option_<?php echo $option['value'] ?>.imageurl = '<?php echo $helper->getAttributeOptionImage($option['value']); ?>';
            attribute_data_<?php echo $_attribute->getAttributeId() ?>.data.option_<?php echo $option['value'] ?>.imgtitle = '<?php echo $option['label']; ?>';
        <?php endforeach; ?>
        //]]>
    </script>

    <?php endforeach; ?>
Run Code Online (Sandbox Code Playgroud)

这将打印在标记中,每个属性设置一个.这很好用,但返回属性的所有选项,而不是仅为产品选择的选项(getJsonConfig()对象已存储的数据).那么,我只是测试我的attribute_data_xxx对象spConfig,并将唯一的匹配选项发送到我的控制器脚本.

扩展getJsonConfig以获取属性URL可能也会起作用...

无论如何 - 这里的关键点是将图像网址与属性选项本身(而不是产品)相关联.

干杯

nac*_*ito 5

您可以使用该getUsedProducts()方法获得可配置中使用的一系列简单产品.此方法不是标准产品模型的一部分,但可以在其中找到app/code/core/Mage/Catalog/Model/Product/Type/Configurable.php,因此您需要首先使用可配置的产品模型getTypeInstance().该方法接受一个参数,说明您是否要将类型模型作为单例返回(我这样做).

foreach ($_product->getTypeInstance(true)->getUsedProducts() as $simpleProduct) {
    // From this you should be able to get the image url
}
Run Code Online (Sandbox Code Playgroud)

UPDATE

spConfig创建时,Mage_Catalog_Block_Product_View_Type_Configurable::getJsonConfig()有一个options包含特定于该可配置选项的product_ids 的数组.

spConfig :
  attributes : {
    603 : {
      id      : 603,
      code    : part_state,
      label   : "Part State",
      options : [
        {
          id       : 648,
          label    : Harvested,
          price    : 0,
          products : [204379]   // <-- Simple Product ID
        },
        {
          id       : 647,
          label    : New,
          price    : 0,
          products : [224333]
        }]
    },
  ...
Run Code Online (Sandbox Code Playgroud)

此时,您可以:

  1. 扩展getJsonConfig以包含简单的产品图像URL,或
  2. 创建简单产品ID到图像URL的映射

我将举例说明#2,以便您了解可能使用的功能.

$spImages = array();
foreach ($this->getAllowProducts() as $_sp) {
    $spImages[$_sp->getId()] = 
        (string)$this->helper('catalog/image')
            ->init($_sp, 'small_image')
            ->resize(40,40);
}
// It is necessary to cast the URL to a `string` because the actual work done by
// Mage_Catalog_Helper_Image happens in the `__toString()` method... weird!

<script type="text/javascript">
    var spImages = <?php echo json_encode($spImages); ?>;
</script>
Run Code Online (Sandbox Code Playgroud)

现在您可以将图像URL与简单的产品ID相关联,您需要根据当前选定的选项更新图像.Magento Product.Config有一个configureElement()<select class="super-attribute-select">变化时触发的方法,所以我会深入研究.如果你不舒服这样做,你已经得到了所有的信息spConfig.config,并spImages从中你可以编写自己的onChange事件处理程序.