Question

我必须逐步配置产品变体。例如。可以在右栏中自定义T恤：步骤1。颜色（group_01）第2步。闪光饰物（group_02）第三步文字（group_03）并添加到购物车。我是用手风琴演奏的。

要获得我需要的内容，我重复了所有变体代码，但CSS排除了第一步中不需要的部分（Step2和Step3），依此类推...

{block name='product_buy'}
 <form id="add-to-cart-or-refresh">

              <input type="hidden" name="token" value=".  {$static_token}">
              <input type="hidden" name="id_product" value="{$product.id}" id="product_page_product_id">
              <input type="hidden" name="id_customization" value="{$product.id_customization}" id="product_customization_id">

          <div class="accordionform">
<fieldset class="accordionform-fieldset" id="fieldset-one">
    <legend class="accordion-form-legend accordionform-legend-active">
        <span>STEP1. COLOR</span>
     <a class="accordionform_next-btn"><i class="fas fa-chevron-right"></i></a>
     <i class="accordionform-de fas fa-chevron-left"></i>

    </legend>

  <div class="accordionform-wrapper accordionform-wrapper-active">

    <div id="product1" class="accordionform-row">


      <div class="product-actions">



  {block name='product_variants'}
 <div class="product-variants">
 <div class="product-variants-conf">
 {foreach from=$groups key=id_attribute_group item=group}
{if !empty($group.attributes)}
<div class="clearfix product-variants-item">
  <span class="control-label">{$group.name}</span>
  {if $group.group_type == 'select'}
    <select
      class="form-control form-control-select"
      id="group_{$id_attribute_group}"
      data-product-attribute="{$id_attribute_group}"
      name="group[{$id_attribute_group}]">
      {foreach from=$group.attributes key=id_attribute item=group_attribute}
        <option value="{$id_attribute}" title="{$group_attribute.name}"{if $group_attribute.selected} selected="selected"{/if}>{$group_attribute.name}</option>
      {/foreach}
    </select>
  {elseif $group.group_type == 'color'}
    <ul id="group_{$id_attribute_group}">
      {foreach from=$group.attributes key=id_attribute item=group_attribute}
        <li class="float-xs-left input-container">
          <label class="accordion--form__label">
            <input class="input-color2" type="submit" data-product-attribute="{$id_attribute_group}" name="group[{$id_attribute_group}]" value="{$id_attribute}"{if $group_attribute.selected} checked="checked"{/if}>
            <span
              {if $group_attribute.html_color_code}class="color2" style="background-color: {$group_attribute.html_color_code}" {/if}
              {if $group_attribute.texture}class="color2 texture" style="background-image: url({$group_attribute.texture})" {/if}
            ><span class="sr-only">{$group_attribute.name}</span>  </span>
                        <div class="colors-names">{$colors.$id_attribute.name}</div>
          </label>

        </li>
      {/foreach}
    </ul>
  {elseif $group.group_type == 'radio'}
    <ul id="group_{$id_attribute_group}">
        {foreach from=$group.attributes key=id_attribute item=group_attribute}
        <li class="input-container float-xs-left">
          <label class="accordion--form__label">
            <input class="input-radio" type="radio" data-product-attribute="{$id_attribute_group}" name="group[{$id_attribute_group}]" value="{$id_attribute}"{if $group_attribute.selected} checked="checked"{/if}>
            <span class="radio-label">{$group_attribute.name}</span>
          </label>
        </li>
      {/foreach}
    </ul>
  {/if}
</div>
{/if}
{/foreach}
</div>

              {/block}

问题是：如果这样做，在第二个手风琴div的Step2上，并使用重复编码（CSS排除了Step1和Step3），产品将变回默认颜色。

“添加到购物车”也不起作用。我想是因为它必须保持在另一个位置。

我只想一步一步地针对一种产品类别进行配置，在手风琴内部还是另一种方式。谢谢

如何在逐步配置中划分PrestaShop产品变体

0 个答案: