แทนที่ “เพิ่มลงในตะกร้าสินค้า” ด้วยลิงก์การติดต่อ
คุณสามารถแทนที่ปุ่มเพิ่มลงในตะกร้าสินค้าด้วยลิงก์อีเมลหรือแบบฟอร์มการติดต่อได้ ตัวอย่างเช่น คุณอาจต้องการแทนที่ปุ่มเพิ่มลงในตะกร้าสินค้าสำหรับสินค้าที่ยังไม่มีจำหน่ายในขณะนี้ หรือสินค้าที่ผลิตตามคำสั่งซื้อ
ธีมที่แบ่งส่วนและธีมที่ไม่แบ่งส่วน
หมายเหตุ: ขั้นตอนสำหรับบทแนะนำการใช้งานนี้จะแตกต่างกันไป ขึ้นอยู่กับว่าคุณกำลังใช้ธีมที่แบ่งส่วน หรือไม่แบ่งส่วน อยู่ โดยธีมที่แบ่งส่วนจะให้คุณสามารถลากและวางวัตถุเพื่อจัดการเลย์เอาต์ของหน้าแรกได้ ในขณะที่ธีมที่ไม่แบ่งส่วนนั้นไม่สามารถทำได้
หากต้องการทราบว่าธีมของคุณรองรับส่วนหรือไม่ ให้ไปที่หน้าแก้ไขโค้ดของธีม หากมีไฟล์ในไดเรกทอรีส่วน หมายความว่าคุณกำลังใช้ธีมที่แบ่งส่วน ธีมที่ไม่แบ่งส่วนเปิดตัวก่อนเดือนตุลาคม 2016 และไม่มีไฟล์ในไดเรกทอรีส่วน
หากคุณใช้ธีมที่แบ่งส่วน ให้คลิกปุ่ม ธีมที่แบ่งส่วน แล้วดำเนินการตามคำแนะนำ หากคุณใช้ธีมที่ไม่แบ่งส่วนซึ่งเป็นรุ่นเก่า ให้คลิกปุ่ม ธีมที่ไม่แบ่งส่วน แล้วดำเนินการตามคำแนะนำ
เลือกธีมของคุณ
ขั้นตอนในการปรับแต่งนี้จะแตกต่างกันไปโดยขึ้นอยู่กับว่าคุณใช้ธีม Narrative หรือธีมฟรีอื่นๆ ที่ Shopify สร้าง คลิกปุ่มสำหรับธีมของคุณก่อนปฏิบัติตามคําแนะนําด้านล่าง:
สร้างเทมเพลตสินค้าใหม่ในธีม Narrative
หากต้องการแทนที่ปุ่มเพิ่มลงในตะกร้าสินค้าสำหรับสินค้า คุณจะต้องสร้างเทมเพลตสินค้าแบบกำหนดเองให้กับสินค้านั้น
ในส่วน Shopify admin ให้ไปที่ร้านค้าออนไลน์ > ธีม
ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด
จากแอป Shopify ให้แตะ ร้านค้า
ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์
แตะ จัดการธีม
ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด
จากแอป Shopify ให้แตะ ร้านค้า
ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์
แตะ จัดการธีม
ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด
- ในไดเรกทอรีเทมเพลต ให้คลิก “เพิ่มเทมเพลตใหม่”
-
สร้างเทมเพลตสินค้า:
- จากเมนูดรอปดาวน์ ให้เลือกสินค้า
- ตั้งชื่อเทมเพลต
requires-contact
- คลิกที่สร้างเทมเพลต
ค้นหาโค้ดต่อไปนี้:
{% section 'product-template' %}
แทนที่ด้วย:
{% section 'product-template-requires-contact' %}
โค้ดนี้จะเชื่อมโยงเทมเพลตใหม่ของคุณเข้ากับส่วนสินค้าใหม่ที่คุณจะสร้างในขั้นตอนต่อไป
- คลิกที่ “บันทึก”
สร้างส่วนสินค้าใหม่
- ในไดเรกทอรีส่วน ให้คลิก “เพิ่มส่วนใหม่”
-
สร้างส่วน:
- ตั้งชื่อส่วน
product-template-requires-contact
ใหม่ - คลิกที่ “สร้างส่วน”
- ตั้งชื่อส่วน
ลบโค้ดเริ่มต้นทั้งหมดในไฟล์ส่วนเพื่อให้ไฟล์ว่างเปล่า
ในไดเรกทอรีส่วน ให้คลิกที่
product-template.liquid
แล้วคัดลอกเนื้อหาทั้งหมดของไฟล์ไปยังคลิปบอร์ดของคุณกลับไปยังส่วน
product-template-requires-contact.liquid
ใหม่ แล้ววางโค้ดลงในไฟล์คลิกที่ “บันทึก”
ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้า
ในไฟล์ส่วน
product-template-requires-contact.liquid
ให้ค้นหาโค้ด HTML สำหรับแบบฟอร์มสินค้าในหน้าสินค้าของคุณ คุณสามารถพบโค้ดดังกล่าวได้ด้วยการค้นหาคำว่าform
ภายในไฟล์เมื่อคุณหาโค้ดพบ ให้รวมโค้ดดังกล่าวไว้ในแท็ก Liquid
{% comment %}
และ{% endcomment %}
การดำเนินการนี้จะทำให้โค้ดดังกล่าวหยุดแสดงบนร้านค้าของคุณ แต่จะทำให้คุณสามารถใส่กลับอีกครั้งได้อย่างง่ายดายหากคุณต้องการเปลี่ยนเทมเพลตใหม่ในภายหลัง
สำหรับธีม Narrative โค้ดที่แก้ไขจะมีลักษณะดังนี้:
{% comment %}
{% include 'product-form' %}
{% endcomment %}
- คลิกที่ “บันทึก”
เพิ่มลิงก์อีเมลหรือแบบฟอร์มการติดต่อ
ตอนนี้คุณได้ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้าแล้ว คุณสามารถเพิ่มเนื้อหาที่คุณต้องการให้แสดงแทนได้
ลิงก์อีเมล
คุณสามารถเพิ่มลิงก์อีเมลที่จะเปิดโปรแกรมอีเมลเริ่มต้นของลูกค้าและป้อนที่อยู่อีเมลสำหรับติดต่อกับลูกค้าของร้านค้าคุณเป็นผู้รับ วิธีเพิ่มลิงก์อีเมล:
- ในบรรทัดด้านล่างแท็ก Liquid
{% endcomment %}
ที่คุณเพิ่มไปในขั้นตอนสุดท้าย ให้เพิ่มโค้ด HTML สำหรับลิงก์อีเมล:
<p>Please <a href="mailto:{{ shop.email }}">contact us</a> if you are interested in this product.</p>
- คลิกที่ “บันทึก”
แบบฟอร์มการติดต่อ
คุณสามารถเพิ่มแบบฟอร์มการติดต่อไปยังเทมเพลตสินค้าใหม่ของคุณได้โดยการคัดลอกโค้ดจากเทมเพลตหน้าการติดต่อของธีม วิธีเพิ่มแบบฟอร์มการติดต่อ:
- ในไดเรกทอรีเทมเพลตให้คลิก
page.contact.liquid
. -
ค้นหาแท็ก Liquid
{% form 'contact' %}
ในไฟล์ -
คัดลอกโค้ดทั้งหมดจากแท็ก Liquid
{% form 'contact' %}
ไปยังแท็ก Liquid{% endform %}
โดยใส่แท็กแบบฟอร์ม Liquid ในโค้ดที่คุณคัดลอก - กลับไปที่ไฟล์
product.requires-contact.liquid
ใหม่ของคุณในไดเรกทอรีเทมเพลต
ในบรรทัดใหม่ด้านล่างแท็ก Liquid {% endcomment %}
ที่คุณเพิ่ม ให้วางโค้ดสำหรับแบบฟอร์มการติดต่อ
- ขั้นตอนต่อไปคือการคลุมโค้ดที่คุณเพิ่งวางในแท็ก HTML div แอตทริบิวต์คลาสที่รวมอยู่ในโค้ดแท็ก div จะช่วยให้แน่ใจว่าแบบฟอร์มการติดต่อของคุณแสดงผลอย่างถูกต้องบนหน้า
ในบรรทัดใหม่ที่ด้านบน {% form 'contact' %}
ให้วางโค้ดต่อไปนี้:
<div class="form-vertical">
ในบรรทัดใหม่ด้านล่าง {% endform %}
ให้วางโค้ดต่อไปนี้:
</div>
- คลิกที่ “บันทึก”
กำหนดเทมเพลตใหม่ให้แก่สินค้า
เมื่อเทมเพลตเสร็จสิ้นแล้ว คุณสามารถกําหนดเทมเพลตนั้นให้กับสินค้าทั้งหมดที่คุณต้องการซ่อนปุ่มเพิ่มลงในตะกร้าสินค้าได้
จากส่วน Shopify admin ให้ไปที่ สินค้า
คลิกที่ชื่อของสินค้าที่คุณต้องการซ่อนปุ่มเพิ่มลงในตะกร้าสินค้า
ในหน้าสินค้าของส่วน Shopify admin ใต้ส่วนร้านค้าออนไลน์ ให้เลือกเทมเพลตที่ต้องมีการติดต่อรายการใหม่จากเมนูดรอปดาวน์เทมเพลตธีม
คลิกที่ “บันทึก”
ปฏิบัติขั้นตอนเหล่านี้ซ้ำกับสินค้าแต่ละรายการที่คุณต้องการเพิ่มเทมเพลตใหม่
สร้างเทมเพลตสินค้าใหม่
หากต้องการแทนที่ปุ่มเพิ่มลงในตะกร้าสินค้าสำหรับสินค้า คุณจะต้องสร้างเทมเพลตสินค้าแบบกำหนดเองให้กับสินค้านั้น
ในส่วน Shopify admin ให้ไปที่ร้านค้าออนไลน์ > ธีม
ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด
จากแอป Shopify ให้แตะ ร้านค้า
ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์
แตะ จัดการธีม
ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด
จากแอป Shopify ให้แตะ ร้านค้า
ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์
แตะ จัดการธีม
ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด
- ในไดเรกทอรีเทมเพลต ให้คลิก “เพิ่มเทมเพลตใหม่”
-
สร้างเทมเพลตสินค้า:
- จากเมนูดรอปดาวน์ ให้เลือกสินค้า
- ตั้งชื่อเทมเพลต
requires-contact
- คลิกที่สร้างเทมเพลต
ค้นหาโค้ดต่อไปนี้:
{% section 'product-template' %}
แทนที่ด้วย:
{% section 'product-template-requires-contact' %}
โค้ดนี้จะเชื่อมโยงเทมเพลตใหม่ของคุณเข้ากับส่วนสินค้าใหม่ที่คุณจะสร้างในขั้นตอนต่อไป
- คลิกที่ “บันทึก”
สร้างส่วนสินค้าใหม่
- ในไดเรกทอรีส่วน ให้คลิก “เพิ่มส่วนใหม่”
-
สร้างส่วน:
- ตั้งชื่อส่วน
product-template-requires-contact
ใหม่ - คลิกที่ “สร้างส่วน”
- ตั้งชื่อส่วน
ลบโค้ดเริ่มต้นทั้งหมดในไฟล์ส่วนเพื่อให้ไฟล์ว่างเปล่า
ในไดเรกทอรีส่วน ให้คลิกที่
product-template.liquid
แล้วคัดลอกเนื้อหาทั้งหมดของไฟล์ไปยังคลิปบอร์ดของคุณกลับไปยังส่วน
product-template-requires-contact.liquid
ใหม่ แล้ววางโค้ดลงในไฟล์คลิกที่ “บันทึก”
ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้า
- ในไฟล์ส่วน
product-template-requires-contact.liquid
ไฟล์ใหม่ของคุณ ให้ค้นหาโค้ด HTML สำหรับปุ่มเพิ่มลงในตะกร้าสินค้าในหน้าสินค้าของคุณ คุณสามารถพบโค้ดดังกล่าวได้ด้วยการค้นหาคำว่าcart
ภายในไฟล์
โค้ดสำหรับปุ่มเพิ่มลงในตะกร้าสินค้าจะแตกต่างกันไปในแต่ละธีม มองหาแท็ก <input>
หรือ <button>
ที่มีข้อความอย่าง Add to cart
, AddToCart
, หรือ add-to-cart
สำหรับธีม Debut โค้ดปุ่มเพิ่มลงในตะกร้าสินค้าจะมีลักษณะดังนี้:
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form_cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-formcart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>
- เมื่อคุณหาโค้ดพบ ให้รวมโค้ดดังกล่าวไว้ในแท็ก Liquid
{% comment %}
และ{% endcomment %}
การดำเนินการนี้จะทำให้โค้ดดังกล่าวหยุดแสดงบนร้านค้าของคุณ แต่จะทำให้คุณสามารถใส่กลับอีกครั้งได้อย่างง่ายดายหากคุณต้องการเปลี่ยนเทมเพลตใหม่ในภายหลัง
สำหรับ Debut โค้ดที่ได้รับการแก้ไขจะมีลักษณะดังนี้:
{% comment %}
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-formcart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form_cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>
{% endcomment %}
- คลิกที่ “บันทึก”
เพิ่มลิงก์อีเมลหรือแบบฟอร์มการติดต่อ
ตอนนี้คุณได้ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้าแล้ว คุณสามารถเพิ่มเนื้อหาที่คุณต้องการให้แสดงแทนได้
ลิงก์อีเมล
คุณสามารถเพิ่มลิงก์อีเมลที่จะเปิดโปรแกรมอีเมลเริ่มต้นของลูกค้าและป้อนที่อยู่อีเมลสำหรับติดต่อกับลูกค้าของร้านค้าคุณเป็นผู้รับ วิธีเพิ่มลิงก์อีเมล:
- ในบรรทัดด้านล่างแท็ก Liquid
{% endcomment %}
ที่คุณเพิ่มไปในขั้นตอนสุดท้าย ให้เพิ่มโค้ด HTML สำหรับลิงก์อีเมล:
<p>Please <a href="mailto:{{ shop.email }}">contact us</a> if you are interested in this product.</p>
- คลิกที่ “บันทึก”
แบบฟอร์มการติดต่อ
คุณสามารถเพิ่มแบบฟอร์มการติดต่อไปยังเทมเพลตสินค้าใหม่ของคุณได้โดยการคัดลอกโค้ดจากเทมเพลตหน้าการติดต่อของธีม วิธีเพิ่มแบบฟอร์มการติดต่อ:
- ในไดเรกทอรีเทมเพลตให้คลิก
page.contact.liquid
. -
ค้นหาแท็ก Liquid
{% form 'contact' %}
ในไฟล์ -
คัดลอกโค้ดทั้งหมดจากแท็ก Liquid
{% form 'contact' %}
ไปยังแท็ก Liquid{% endform %}
โดยใส่แท็กแบบฟอร์ม Liquid ในโค้ดที่คุณคัดลอก - กลับไปยังไฟล์
product-template-requires-contact.liquid
ใหม่ในไดเรกทอรีส่วน -
ค้นหาแท็กปิด
</form>
ภายในไฟล์ดังกล่าว และวางโค้ดสำหรับแบบฟอร์มการติดต่อบนบรรทัดใหม่ด้านล่างของแท็กปิด</form>
- ขั้นตอนต่อไปคือการคลุมโค้ดที่คุณเพิ่งวางในแท็ก HTML div แอตทริบิวต์คลาสที่รวมอยู่ในโค้ดแท็ก div จะช่วยให้แน่ใจว่าแบบฟอร์มการติดต่อของคุณแสดงผลอย่างถูกต้องบนหน้า
ในบรรทัดใหม่ที่ด้านบน {% form 'contact' %}
ให้วางโค้ดต่อไปนี้:
<div class="form-vertical"></div>
ในบรรทัดใหม่ด้านล่าง {% endform %}
ให้วางโค้ดต่อไปนี้:
</div>
- คลิกที่ “บันทึก”
กำหนดเทมเพลตใหม่ให้แก่สินค้า
เมื่อเทมเพลตเสร็จสิ้นแล้ว คุณสามารถกําหนดเทมเพลตนั้นให้กับสินค้าทั้งหมดที่คุณต้องการซ่อนปุ่มเพิ่มลงในตะกร้าสินค้าได้
จากส่วน Shopify admin ให้ไปที่ สินค้า
คลิกที่ชื่อของสินค้าที่คุณต้องการซ่อนปุ่มเพิ่มลงในตะกร้าสินค้า
ในหน้าสินค้าของส่วน Shopify admin ใต้ส่วนร้านค้าออนไลน์ ให้เลือกเทมเพลตที่ต้องมีการติดต่อรายการใหม่จากเมนูดรอปดาวน์เทมเพลตธีม
คลิกที่ “บันทึก”
ปฏิบัติขั้นตอนเหล่านี้ซ้ำกับสินค้าแต่ละรายการที่คุณต้องการเพิ่มเทมเพลตใหม่
สร้างเทมเพลตสินค้าใหม่
หากต้องการแทนที่ปุ่มเพิ่มลงในตะกร้าสินค้าสำหรับสินค้า คุณจะต้องสร้างเทมเพลตสินค้าแบบกำหนดเองให้กับสินค้านั้น
ในส่วน Shopify admin ให้ไปที่ร้านค้าออนไลน์ > ธีม
ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด
จากแอป Shopify ให้แตะ ร้านค้า
ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์
แตะ จัดการธีม
ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด
จากแอป Shopify ให้แตะ ร้านค้า
ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์
แตะ จัดการธีม
ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด
- ในไดเรกทอรีเทมเพลต ให้คลิก “เพิ่มเทมเพลตใหม่”
- สร้างเทมเพลตสินค้า:
- จากเมนูดรอปดาวน์ ให้เลือกสินค้า
- ตั้งชื่อเทมเพลต
requires-contact
- คลิกที่สร้างเทมเพลต
ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้า
- ในไฟล์
product.requires-contact.liquid
ใหม่ของคุณ ให้ค้นหาโค้ด HTML ของปุ่มเพิ่มลงในตะกร้าสินค้า คุณสามารถค้นหาคำว่าcart
ได้
โค้ดสำหรับปุ่มเพิ่มลงในตะกร้าสินค้าจะแตกต่างกันไปในแต่ละธีม มองหาแท็ก <input>
หรือ <button>
ที่มีข้อความอย่าง Add to cart
, AddToCart
, หรือ add-to-cart
สำหรับธีม Debut โค้ดปุ่มเพิ่มลงในตะกร้าสินค้าจะมีลักษณะดังนี้:
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>
- เมื่อคุณหาโค้ดพบ ให้รวมโค้ดดังกล่าวไว้ในแท็ก Liquid
{% comment %}
และ{% endcomment %}
การดำเนินการนี้จะทำให้โค้ดดังกล่าวหยุดแสดงบนร้านค้าของคุณ แต่จะทำให้คุณสามารถใส่กลับอีกครั้งได้อย่างง่ายดายหากคุณต้องการเปลี่ยนเทมเพลตใหม่ในภายหลัง
สำหรับ Debut โค้ดที่ได้รับการแก้ไขจะมีลักษณะดังนี้:
{% comment %}
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>
{% endcomment %}
- คลิกที่ “บันทึก”
เพิ่มลิงก์อีเมลหรือแบบฟอร์มการติดต่อ
ตอนนี้คุณได้ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้าแล้ว คุณสามารถเพิ่มเนื้อหาที่คุณต้องการให้แสดงแทนได้
ลิงก์อีเมล
- ในบรรทัดด้านล่างแท็ก Liquid
{% endcomment %}
ที่คุณเพิ่มไปในขั้นตอนสุดท้าย ให้เพิ่มโค้ด HTML สำหรับลิงก์อีเมล:
Please <a href="mailto:{{ shop.email }}">contact us</a> if you are
interested in this product.
- คลิกที่ “บันทึก”
แบบฟอร์มการติดต่อ
คุณสามารถเพิ่มแบบฟอร์มการติดต่อไปยังเทมเพลตสินค้าใหม่ของคุณได้โดยการคัดลอกโค้ดจากเทมเพลตหน้าการติดต่อของธีม วิธีเพิ่มแบบฟอร์มการติดต่อ:
- ในไดเรกทอรีเทมเพลตให้คลิก
page.contact.liquid
. -
ค้นหาแท็ก Liquid
{% form 'contact' %}
ในไฟล์ -
คัดลอกโค้ดทั้งหมดจากแท็ก Liquid
{% form 'contact' %}
ไปยังแท็ก Liquid{% endform %}
โดยใส่แท็กแบบฟอร์ม Liquid ในโค้ดที่คุณคัดลอก - กลับไปที่ไฟล์
product.requires-contact.liquid
ใหม่ของคุณในไดเรกทอรีเทมเพลต -
ค้นหาแท็กปิด
</form>
ภายในไฟล์ดังกล่าว และวางโค้ดสำหรับแบบฟอร์มการติดต่อบนบรรทัดใหม่ด้านล่างของแท็กปิด</form>
- ขั้นตอนต่อไปคือการคลุมโค้ดที่คุณเพิ่งวางในแท็ก HTML div แอตทริบิวต์คลาสที่รวมอยู่ในโค้ดแท็ก div จะช่วยให้แน่ใจว่าแบบฟอร์มการติดต่อของคุณแสดงผลอย่างถูกต้องบนหน้า
ในบรรทัดใหม่ที่ด้านบน {% form 'contact' %}
ให้วางโค้ดต่อไปนี้:
<div class="form-vertical"></div>
ในบรรทัดใหม่ด้านล่าง {% endform %}
ให้วางโค้ดต่อไปนี้:
</div>
- คลิกที่ “บันทึก”
กำหนดเทมเพลตใหม่ให้แก่สินค้า
เมื่อเทมเพลตเสร็จสิ้นแล้ว คุณสามารถกําหนดเทมเพลตนั้นให้กับสินค้าทั้งหมดที่คุณต้องการซ่อนปุ่มเพิ่มลงในตะกร้าสินค้าได้
- จากส่วนผู้ดูแลระบบ Shopify ของคุณ ให้ไปที่สินค้า
- คลิกที่ชื่อของสินค้าที่คุณต้องการซ่อนปุ่มเพิ่มลงในตะกร้าสินค้า
- ในหน้าสินค้าของส่วน Shopify admin ใต้ส่วนร้านค้าออนไลน์ ให้เลือกเทมเพลตที่ต้องมีการติดต่อรายการใหม่จากเมนูดรอปดาวน์เทมเพลตธีม
- คลิกที่ “บันทึก”
ปฏิบัติขั้นตอนเหล่านี้ซ้ำกับสินค้าแต่ละรายการที่คุณต้องการเพิ่มเทมเพลตใหม่