如何定位产品描述中的配送板块实现本地化适配？

需要根据localization.country.iso_code（国家）和request.locale.iso_code（区域设置），精准替换产品描述中的配送板块内容。目前已能检测国家和区域，但无法定位描述里的配送部分，不想编写大量逐个产品、国家、区域的if判断。

现有main-product.liquid相关代码：

{%- form 'product', product, class: 'ProductForm' -%}
    {%- render 'product-data', product: product -%}

    {%- for block in section.blocks -%}
      {%- case block.type -%}
        {%- when '@app' -%}
          {%- render block -%}

        {%- when 'product_meta' -%}
          {%- render 'product-meta', form: form, block: block, product: product -%}

        {%- when 'description' -%}
          {%- if product.description != blank -%}
            <div class="ProductMeta__Description" {{ block.shopify_attributes }}>
              <div class="Rte">
                {{- product.description | replace: 'data-section-type', 'data-section-type-placeholder' -}}
              </div>
            </div>                

生成的product.description HTML结构：

<div class="ProductMeta__Description">
    <p>Product Number One</p>
    <p>Produt Number One Info</p>
    <p data-mce-fragment="1">Dimensions...</p>
    <p data-mce-fragment="1">Volume...</p>
    <h5 data-mce-fragment="1">Fabrics...</h5>
    <h5 data-mce-fragment="1">SHIPPING</h5>
    <p data-mce-fragment="1">Shipping info</p>
</div>

期望实现仅修改配送信息的效果，避免冗余判断。

方法1：Liquid字符串分割+替换 #

利用配送板块的固定标识（如<h5 data-mce-fragment="1">SHIPPING</h5>），将产品描述拆分为配送前内容、配送标识、配送后内容三部分，再针对性替换配送板块：

{%- when 'description' -%}
  {%- if product.description != blank -%}
    {%- assign shipping_heading = '<h5 data-mce-fragment="1">SHIPPING</h5>' -%}
    {%- assign description_parts = product.description | split: shipping_heading -%}
    
    <div class="ProductMeta__Description" {{ block.shopify_attributes }}>
      <div class="Rte">
        {{- description_parts[0] | replace: 'data-section-type', 'data-section-type-placeholder' -}}
        
        {%- comment %} 根据区域和国家输出定制配送内容 {% endcomment %}
        {%- if request.locale.iso_code == 'en' -%}
          {%- if localization.country.iso_code == 'US' -%}
            <h5>Shipping</h5>
            <p>Custom US shipping info.</p>
          {%- elsif localization.country.iso_code == 'CA' -%}
            <h5>Shipping</h5>
            <p>Custom Canada shipping info.</p>
          {%- else -%}
            {{ shipping_heading }}
            {{- description_parts[1] -}}
          {%- endif -%}
        {%- else -%}
          {{ shipping_heading }}
          {{- description_parts[1] -}}
        {%- endif -%}
      </div>
    </div>
  {%- endif -%}

注意：如果不同产品的配送标题存在大小写、语言差异，需统一标识规则，或用包含关键词的模糊匹配逻辑。

方法2：抽离配送信息至产品元字段（推荐） #

将配送信息从产品描述中分离，存入产品元字段（如product.metafields.custom.shipping_info），按区域和国家设置对应值（支持翻译），后期维护无需改动代码：

1. 在Shopify后台为产品添加元字段，命名为custom.shipping_info，类型设为「多行文本文档」并开启翻译支持；
2. 针对不同区域、国家录入对应的配送内容；
3. 修改Liquid代码：

{%- when 'description' -%}
  {%- if product.description != blank -%}
    <div class="ProductMeta__Description" {{ block.shopify_attributes }}>
      <div class="Rte">
        {%- comment %} 输出配送前的描述内容 {% endcomment %}
        {%- assign shipping_heading = '<h5 data-mce-fragment="1">SHIPPING</h5>' -%}
        {%- assign description_parts = product.description | split: shipping_heading -%}
        {{- description_parts[0] | replace: 'data-section-type', 'data-section-type-placeholder' -}}
        
        {%- comment %} 输出定制配送内容 {% endcomment %}
        <h5>
          {%- if request.locale.iso_code == 'en' -%}Shipping{%- else -%}{% comment %}其他语言标题{% endcomment %}{%- endif -%}
        </h5>
        {%- if product.metafields.custom.shipping_info != blank -%}
          {{- product.metafields.custom.shipping_info | replace: 'data-section-type', 'data-section-type-placeholder' -}}
        {%- else -%}
          {{- description_parts[1] -}}
        {%- endif -%}
      </div>
    </div>
  {%- endif -%}

方法3：JavaScript动态替换（备选） #

若Liquid层面实现受限，可通过前端JS根据当前区域和国家替换页面内容：

document.addEventListener('DOMContentLoaded', function() {
  const locale = '{{ request.locale.iso_code }}';
  const country = '{{ localization.country.iso_code }}';
  const shippingHeadings = document.querySelectorAll('.Rte h5');
  
  for (const heading of shippingHeadings) {
    if (heading.textContent.includes('SHIPPING')) {
      const shippingContent = heading.nextElementSibling;
      if (locale === 'en' && country === 'US') {
        heading.textContent = 'Shipping';
        shippingContent.textContent = 'Custom US shipping info.';
      } else if (locale === 'en' && country === 'CA') {
        heading.textContent = 'Shipping';
        shippingContent.textContent = 'Custom Canada shipping info.';
      }
      // 其他区域国家规则可在此扩展
      break;
    }
  }
});

内容的提问来源于stack exchange，提问作者truba