sectionパーツ追加で、商品メタフィールドのテキストが未記入sectionごと非表示にしたい

解決済
next_kota
観光客
12 1 2

お世話になっております。

表題の件で質問させてください。

 

現在、商品ページのカスタマイズをしています。

デフォルトのsection『テキスト付き画像(image-with-text.liquid )』を複製し、

『テキスト付き画像3(image-with-text-type3.liquid )』を作成し、カスタマイズ中です。

下の添付のようにテキストが入る箇所は「商品メタフィールド」で設定しています。

next_kota_1-1631771396008.png

商品詳細ページにて、下記添付のように[詳細テキスト3]が未記入だった場合には、

[詳細テキスト3]が出力されているsectionのエリアを全体ごと非表示にしたいのですがそちらの設定が出来ません。

next_kota_2-1631771751361.png

下記に現在のソースコードも記載いたします。

liquidが不慣れな為、解決策を教えていただけますととても助かります。

どうぞよろしくお願いします。

▼image-with-text-type3.liquid ソースコード

{%- if block.settings.text != blank -%} 

<section class="image-with-text-type3">
<div class="image-with-text {% if section.settings.full_width %}image-with-text--full-width{% else %}page-width{% endif %} color-scheme-{{ section.settings.color_scheme }}">
  <div class="image-with-text__grid color-{{ section.settings.color_scheme }}{% if section.settings.layout == 'text_first' %} image-with-text__grid--reverse{% endif %} grid grid--gapless grid--1-col grid--2-col-tablet">
  
    
    {%- if section.settings.image != blank -%} 
    <div class="grid__item grid__item_img">
      <div class="image-with-text__media image-with-text__media--{{ section.settings.height }} {% if section.settings.image != blank %}media{% else %}image-with-text__media--placeholder placeholder{% endif %}"
        {% if section.settings.height == 'adapt' and section.settings.image != blank %} style="padding-bottom: {{ 1 | divided_by: section.settings.image.aspect_ratio | times: 100 }}%;"{% endif %}
      >
          <img srcset="{%- if section.settings.image.width >= 165 -%}{{ section.settings.image | img_url: '165x' }} 165w,{%- endif -%}
            {%- if section.settings.image.width >= 360 -%}{{ section.settings.image | img_url: '360x' }} 360w,{%- endif -%}
            {%- if section.settings.image.width >= 535 -%}{{ section.settings.image | img_url: '535x' }} 535w,{%- endif -%}
            {%- if section.settings.image.width >= 720 -%}{{ section.settings.image | img_url: '720x' }} 720w,{%- endif -%}
            {%- if section.settings.image.width >= 940 -%}{{ section.settings.image | img_url: '940x' }} 940w,{%- endif -%}
            {%- if section.settings.image.width >= 1070 -%}{{ section.settings.image | img_url: '1070x' }} 1070w{%- endif -%}"
            src="{{ section.settings.image | img_url: '533x' }}"
            sizes="(min-width: 1100px) 535px, (min-width: 750px) calc((100vw - 130px) / 2), calc((100vw - 50px) / 2)"
            alt="{{ section.settings.image.alt | escape }}"
            loading="lazy"
            width="{{ section.settings.image.width }}"
            height="{{ section.settings.image.height }}"
          >
      </div>
    </div>
        {%- else -%}
        <div class="non-image"></div>
        {%- endif -%}
    
    <div class="grid__item grid__item_text">
      <div class="image-with-text__content image-with-text__content--{{ section.settings.height }}">
        {%- for block in section.blocks -%}
          {% case block.type %}
            {%- when 'heading' -%}
              <h2 class="image-with-text__heading h1">
                {{ block.settings.heading | escape }}
              </h2>
            {%- when 'text' -%}
              <div class="image-with-text__text rte">{{ block.settings.text }}</div>
            {%- when 'button' -%}
              {%- if block.settings.button_label != blank -%}
                <a href="{{ block.settings.button_link }}" class="button{% if block.settings.button_style_secondary %} button--secondary{% else %} button--primary{% endif %}"{% if block.settings.button_link == blank %} aria-disabled="true"{% endif %}>{{ block.settings.button_label | escape }}</a>
              {%- endif -%}
          {%- endcase -%}
        

        {%- endfor -%}
      </div>
    </div>
  </div>
</div>
</section>

{%- else -%}
      
{%- endif -%}

 

0 件の「いいね!」
next_kota
観光客
12 1 2

成功

こちら解決しました。

 

0 件の「いいね!」
May77
新規メンバー
2 0 0

同じ方法で悩んでおり、差し支えなければ解決された方法が知りたいです!

0 件の「いいね!」