Liquid、JavaScriptなどに関する質問
テーマは「Craft」を使っています。
ShopifyのプランはBasicです。
現在、セクション→「main-cart-items.liquid」にて、以下の通りcart.attributesを使ってカート内でアンケートフォームを設定しております。
▼設定内容(挿入位置が分かるように前後のコードも載せています)
{%- if item.variant.available and item.unit_price_measurement -%} <div class="unit-price caption"> <span class="visually-hidden">{{ 'products.product.price.unit_price' | t }}</span> {{ item.unit_price | money }} <span aria-hidden="true">/</span> <span class="visually-hidden" > {{ 'accessibility.unit_price_separator' | t }} </span > {%- if item.unit_price_measurement.reference_value != 1 -%} {{- item.unit_price_measurement.reference_value -}} {%- endif -%} {{ item.unit_price_measurement.reference_unit }} </div> {%- endif -%} </div> </td> </tr> {%- endfor -%} </tbody> </table> {%- endif -%} </div> </div> <p class="visually-hidden" id="cart-live-region-text" aria-live="polite" role="status"></p> <p class="visually-hidden" id="shopping-cart-line-item-status" aria-live="polite" aria-hidden="true" role="status"> {{ 'accessibility.loading' | t }} </p> <!--------------【始】カートにアンケートフォーム追記-----------------------------------> <div style="border: #ff69b4 dotted 4px; font-size: 100%; padding: 15px;"> <font size="-1"> <h3>【アンケート】</h3> <small><font color="#A9A9A9">以下アンケートに回答のうえ、ご注文ください</font></small><br> <p class="cart-attribute__field"> <label for="">■この講座をお知りになったキッカケ・媒体を教えてください*</label><br> <small><font color="#A9A9A9">(例:Instagram、友人からの紹介、インターネットで〇〇と検索して見つけた、等…)</font></small><br> <input required class="required" id="" type="text" name="attributes[■この講座をお知りになったキッカケ・媒体を教えてください*]" value="{{ cart.attributes["■この講座をお知りになったキッカケ・媒体を教えてください*"] }}"> </p> <p class="cart-attribute__field"> <label for="">■お申込みの動機*</label><br> <small><font color="#A9A9A9">(例:Instagramの広告で知り、絵本と脳科学というところに興味があったので申し込んだ)</font></small><br> <input required class="required" id="" type="text" name="attributes[■お申込みの動機*]" value="{{ cart.attributes["■お申込みの動機*"] }}"> </p> <p class="cart-attribute__field"> <label for="">■お子様の年齢*</label><br> <small><font color="#A9A9A9">(例:3歳、5歳)</font></small><br> <input required class="required" id="" type="text" name="attributes[■お子様の年齢*]" value="{{ cart.attributes["■お子様の年齢*"] }}"> </p> <p class="cart-attribute__field"> <label>■講座の参加方法*</label><br> <small><font color="#A9A9A9">※マンツーマンコースをお申込みの場合はリアルタイムを選択ください。追って先生と日程を調整いただきます。</font></small><br> <input required class="required" type="radio" style="accent-color:#FF0066;" name="attributes[■講座の参加方法*]" value="リアルタイム配信での受講を希望"{% if cart.attributes["■講座の参加方法*"] == "リアルタイム配信での受講を希望" %} checked{% endif %}> <span>リアルタイム配信での受講を希望</span><br> <input required class="required" type="radio" style="accent-color:#FF0066;" name="attributes[■講座の参加方法*]" value="アーカイブ配信での受講を希望"{% if cart.attributes["■講座の参加方法*"] == "アーカイブ配信での受講を希望" %} checked{% endif %}> <span>アーカイブ配信での受講を希望</span><br> </p> <p class="cart-attribute__field"> <label for="">■お悩み、事前質問(任意)</label><br> <small><font color="#A9A9A9">****先生に聞いてほしいお悩みやご質問がありましたら、こちらにご入力ください。<br> ※いただきましたご質問は、できるだけ絵本講座内でお答えしますが、時間の関係で回答できない場合がございますのでご了承ください。</font></small><br> <textarea id="" name="attributes[■お悩み、事前質問(任意)]">{{ cart.attributes["■お悩み、事前質問(任意)"] }}</textarea> </p> <p class="cart-attribute__field"> <p>■マンツーマンコース希望日(任意)</p> <small><font color="#A9A9A9">マンツーマンコースをお申込みの場合、ご希望の日時を第3希望(最大第5希望)まで入力ください。<br> ※10時~15時の間の2時間程度(例:1/10(水)AM11~13時)<br> ※ご予約状況を確認したうえ先生よりご連絡いたします。</font></small><br> <p class="cart-attribute__field"> <label for="1">・第1希望</label> <input id="1" type="text" name="attributes[マンツーマン・第1希望]" value="{{ cart.attributes["・第1希望"] }}"></p> <p class="cart-attribute__field"> <label for="1">・第2希望</label> <input id="1" type="text" name="attributes[マンツーマン・第2希望]" value="{{ cart.attributes["・第2希望"] }}"></p> <p class="cart-attribute__field"> <label for="1">・第3希望</label> <input id="1" type="text" name="attributes[マンツーマン・第3希望]" value="{{ cart.attributes["・第3希望"] }}"></p> <p class="cart-attribute__field"> <label for="1">・第4希望</label> <input id="1" type="text" name="attributes[マンツーマン・第4希望]" value="{{ cart.attributes["・第4希望"] }}"></p> <p class="cart-attribute__field"> <label for="1">・第5希望</label> <input id="1" type="text" name="attributes[マンツーマン・第5希望]" value="{{ cart.attributes["・第5希望"] }}"></p> </p> </font> </div> {% endcase %} <!---------【終】カートにアンケートフォーム追記--------------------------------------> </form> </cart-items> {% schema %}
このアンケートフォームを条件を指定して、表示・非表示を切り分けたいのですが、うまくいきません。
(例:商品のメタフィールドの「アンケート」がtrueの時にアンケートフォームを表示)
条件は、商品名でもコレクションでもメタフィールドでもタグでも何でもいいです。
何かしらの条件を付けて出し分ければと思います!
すみませんが、どなたか教えていただけると助かります。
よろしくお願いいたします。
解決済! ベストソリューションを見る。
成功
商品のメタフィールドの「アンケート」がtrueの時にアンケートフォームを表示したい件ですが、
下記のようなコードを</form>の前に追記いただけましたら、
カートに追加された商品でメタフィールドの「アンケート」がtrueの商品が含まれていた場合、
アンケートを表示することが可能かと思います。
下記コード内『item.product.metafields.custom.form_view』の『custom.form_view』部分は、
メタフィールドを作成した際のネームスペースとキーに変更ください。
{% assign FormViews = false %}
{% for item in cart.items %}
{% if item.product.metafields.custom.form_view == true %}
{% assign FormViews = true %}
{% endif %}
{% endfor %}
{% if FormViews == true %}
アンケートのコードを追記
{% endif %}
ご参考まで
(キュー小坂)
成功
商品のメタフィールドの「アンケート」がtrueの時にアンケートフォームを表示したい件ですが、
下記のようなコードを</form>の前に追記いただけましたら、
カートに追加された商品でメタフィールドの「アンケート」がtrueの商品が含まれていた場合、
アンケートを表示することが可能かと思います。
下記コード内『item.product.metafields.custom.form_view』の『custom.form_view』部分は、
メタフィールドを作成した際のネームスペースとキーに変更ください。
{% assign FormViews = false %}
{% for item in cart.items %}
{% if item.product.metafields.custom.form_view == true %}
{% assign FormViews = true %}
{% endif %}
{% endfor %}
{% if FormViews == true %}
アンケートのコードを追記
{% endif %}
ご参考まで
(キュー小坂)
早速のお返事ありがとうございました。
希望通り設定することができました!
とても丁寧に教えていただきありがとうございました。
サポートの選択肢が増えていく中、最適となる選択の判断が難しくなっているかと存じます。今回は問題の解決に最適となるサポートの選択方法を、紹介させて頂きます。 選択肢のご紹介...
By Mirai Oct 6, 20242023年初頭、Shopifyペイメントアカウント、及びShopifyアカウント全体のセキュリティを強化する為の変更が適用されました。ユーザーのアカウントセキュリティを強化す...
By Mirai Sep 29, 2024概要: 年末/年明けは、消費者が最もショッピングを行う時期の一つです。特に、ブラックフライデー・サイバーマンデー(BFCM)は、世界中で注目される大規模なセールイベントであ...
By JapanGuru Sep 25, 2024