Liquid、JavaScriptなどに関する質問
カートページのコーディングをしています。
配送日指定→備考欄→チェックアウトボタン
というふうに要素を横並びにしたいのですが、うまくいきません。
何かアドバイスいただけないでしょうか。
<div class="parent">
{% if section.settings.cart_terms_show %}
<div class="terms rte">
<input type="checkbox" id="terms" />
{% assign terms_url = pages[section.settings.cart_terms_page].url %}
{% capture terms_label_html %}<label for="terms">{{ 'cart.terms.agreement_html' | t: terms_url: terms_url }}</label>{% endcapture %}
{% if section.settings.cart_terms_page == blank %}
{{ terms_label_html | replace: '<a ', '<span ' | replace: '</a>', '</span>' }}
{% else %}
{{ terms_label_html }}
{% endif %}
</div>
{% endif %}
{% if section.settings.show_tax_and_shipping %}
{%- capture taxes_shipping_checkout -%}
{%- if shop.taxes_included and shop.shipping_policy.body != blank -%}
{{ 'cart.general.taxes_included_and_shipping_policy_html' | t: link: shop.shipping_policy.url }}
{%- elsif shop.taxes_included -%}
{{ 'cart.general.taxes_included_but_shipping_at_checkout' | t }}
{%- elsif shop.shipping_policy.body != blank -%}
{{ 'cart.general.taxes_and_shipping_policy_at_checkout_html' | t: link: shop.shipping_policy.url }}
{%- else -%}
{{ 'cart.general.taxes_and_shipping_at_checkout' | t }}
{%- endif -%}
{%- endcapture -%}
<div class="cart-policies rte">{{ taxes_shipping_checkout }}</div>
{% endif %}
<input type="submit" class="checkout-btn" name="checkout" value="{{ 'cart.general.checkout' | t | escape }}" />
{% comment %}Paypal and Google checkout buttons{% endcomment %}
{% if section.settings.show_additional_checkout_buttons and additional_checkout_buttons and section.settings.cart_terms_show == false %}
<div class="additional-checkout-buttons">
{{ content_for_additional_checkout_buttons }}
</div>
{% endif %}
<div style="width:150px; clear:both">
<label for="datepicker">配達希望日 : </label>
<input id="datepicker" type="text" name="attributes[配達希望日]" value="{{ cart.attributes.date }}" />
</div>
<script>
$("#datepicker").datepicker( {
minDate: '+4D',
maxDate: '+3M',
} );
</script>
{% if section.settings.cart_note_show %}
<div class="note-area">
<label for="note">{{ 'cart.label.note' | t }}</label>
<textarea id="note" name="note">{{ cart.note }}</textarea>
</div>
</div>
CSS→
.parent {
width: 100%;
display: flex;
}
.child {
width: 100px;
}
Shopify アカデミーの学習パスと認定スキルバッジExpanding Your Shopify Business Internationallyを活用して、国際的にビジネ...
By Shopify Feb 7, 2025Shopify アカデミーの学習パスB2B on Shopify:立ち上げとカスタマイズで卸売販売に進出しましょう。これら3つの無料コースは、ShopifyストアでB2B機能...
By Shopify Jan 31, 2025サポートの選択肢が増えていく中、最適となる選択の判断が難しくなっているかと存じます。今回は問題の解決に最適となるサポートの選択方法を、紹介させて頂きます。 選択肢のご紹介...
By Mirai Oct 6, 2024