在Shopify产品说明中隐藏文字

时间:2019-05-17 14:13:57

标签: shopify liquid shopify-template

只需在Shopify上寻求指导即可。我想做的是在商品说明中用[#size] [/ size]标签(或类似标签)包装文字...然后抓取文字并将其放入弹出窗口。

我已经完成了大部分工作,以便创建弹出按钮,即使包含产品说明中的文本,弹出窗口也可以正常工作,但是,产品说明中的文本会保留在此处而不是隐藏起来进入弹出窗口,我现在正抓着稻草试图修复它...

任何想法都将得到高度重视,在此先感谢。

这是我在product-template.liquid中的代码

{% if product.description contains '[#size]' or product.description contains '[#video]' or product.description contains '[#other]' %}
      <div class="product-extra">
        {% if section.settings.show_product_size_chart and product.description contains '[#size]' %}
          {% assign shortcode_description = product.description | split: '[/size]' | first | split: '[#size]' | last %}
            <a class="product-size-chart fancybox" href="#product-size-chart"><i class="fas fa-ruler"></i> {{ 'products.product.sizing' | t }}
              <div id="product-size-chart" style="display: none;">
                {{ shortcode_description }}
              </div>
            </a>
        {% endif %}

        {% if section.settings.show_product_video and product.description contains '[#video]' %}
          {% assign shortcode_description = product.description | split: '[/video]' | first | split: '[#video]' | last %}
          <a class="product-video fancybox" href="#product-video"><i class="fas fa-play-circle"></i> {{ 'products.product.video' | t }}
            <div id="product-video" style="display: none;">
              {{ shortcode_description }}
            </div>
          </a>
        {% endif %}
        {% if section.settings.show_product_model and product.description contains '[#other]' %}
          <a class="product-model fancybox" href="#product-model"><i class="fas fa-info-circle"></i> {{ 'products.product.model' | t }}
            <div id="product-model" style="display: none;">
              {% assign shortcode_description = product.description | split: '[/other]' | first | split: '[#other]' | last %}
              {{ shortcode_description }}
            </div>
          </a>
        {% endif %}
      </div>
    {% endif %}

1 个答案:

答案 0 :(得分:0)

您可以创建一个名为 shortcode.liquid

的代码段

在代码段中,您输入了以下代码:

{%- capture open_tag -%}[#{{tag}}]{%- endcapture -%}
{%- capture close_tag -%}[/{{tag}}]{%- endcapture -%}

{%- assign text_content = content | split: open_tag | last | split: close_tag | first -%}
{%- capture remove_shortcode -%}{{open_tag}}{{text_content}}{{close_tag}}{%- endcapture -%}

{%- assign new_content = content | remove: remove_shortcode -%}

您可以通过以下方式调用代码段:

{%- include 'shortcode' content: product.content, tag: 'size' -%}

传递内容的位置(在这种情况下为 product.content )和要定位的简码(在这种情况下为 size

调用该代码段后,有两个变量:

{{text_content}}将返回简短代码之间的内容

{{new_content}}-这将返回新内容,但带有删除的短代码

重要提示-此代码段仅适用于相同简码的单个实例,也就是您不能有两个size简码实例。