แทนที่ "เพิ่มลงในตะกร้าสินค้า" ด้วยลิงก์การติดต่อ

หน้านี้พิมพ์ขึ้นเมื่อ Jan 21, 2022 หากต้องการเวอร์ชันปัจจุบัน โปรดไปที่ https://help.shopify.com/th/manual/online-store/themes/themes-by-shopify/vintage-themes/customizing-vintage-themes/replace-add-to-cart

คุณสามารถแทนที่ปุ่มเพิ่มลงในตะกร้าสินค้าด้วยลิงก์อีเมลหรือแบบฟอร์มการติดต่อได้ ตัวอย่างเช่น คุณอาจต้องการแทนที่ปุ่มเพิ่มลงในตะกร้าสินค้าสำหรับสินค้าที่ยังไม่มีจำหน่ายในขณะนี้ หรือสินค้าที่ผลิตตามคำสั่งซื้อ

ธีมที่แบ่งส่วนและธีมที่ไม่แบ่งส่วน

หมายเหตุ: ขั้นตอนสำหรับบทแนะนำการใช้งานนี้จะแตกต่างกันไป ขึ้นอยู่กับว่าคุณกำลังใช้ธีมที่แบ่งส่วน หรือไม่แบ่งส่วน อยู่ โดยธีมที่แบ่งส่วนจะให้คุณสามารถลากและวางวัตถุเพื่อจัดการเลย์เอาต์ของหน้าแรกได้ ในขณะที่ธีมที่ไม่แบ่งส่วนนั้นไม่สามารถทำได้

หากต้องการทราบว่าธีมของคุณรองรับส่วนหรือไม่ ให้ไปที่หน้าแก้ไขโค้ดของธีม หากมีไฟล์ในไดเรกทอรีส่วน หมายความว่าคุณกำลังใช้ธีมที่แบ่งส่วน ธีมที่ไม่แบ่งส่วนเปิดตัวก่อนเดือนตุลาคม 2016 และไม่มีไฟล์ในไดเรกทอรีส่วน

หากคุณใช้ธีมที่แบ่งส่วน ให้คลิกปุ่ม ธีมที่แบ่งส่วน แล้วดำเนินการตามคำแนะนำ หากคุณใช้ธีมที่ไม่แบ่งส่วนซึ่งเป็นรุ่นเก่า ให้คลิกปุ่ม ธีมที่ไม่แบ่งส่วน แล้วดำเนินการตามคำแนะนำ

เลือกธีมของคุณ

ขั้นตอนในการปรับแต่งนี้จะแตกต่างกันไปโดยขึ้นอยู่กับว่าคุณใช้ธีม Narrative หรือธีมฟรีอื่นๆ ที่ Shopify สร้าง คลิกปุ่มสำหรับธีมของคุณก่อนปฏิบัติตามคําแนะนําด้านล่าง:

สร้างเทมเพลตสินค้าใหม่ในธีม Narrative

หากต้องการแทนที่ปุ่มเพิ่มลงในตะกร้าสินค้าสำหรับสินค้า คุณจะต้องสร้างเทมเพลตสินค้าแบบกำหนดเองให้กับสินค้านั้น

  1. ในส่วน Shopify admin ให้ไปที่ร้านค้าออนไลน์ > ธีม

  2. ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด

  1. จากแอป Shopify ให้แตะ ร้านค้า

  2. ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์

  3. แตะ จัดการธีม

  4. ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด

  1. จากแอป Shopify ให้แตะ ร้านค้า

  2. ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์

  3. แตะ จัดการธีม

  4. ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด

  1. ในไดเรกทอรีเทมเพลต ให้คลิก "เพิ่มเทมเพลตใหม่"

  2. สร้างเทมเพลตสินค้า:

    1. จากเมนูดรอปดาวน์ ให้เลือกสินค้า
    2. ตั้งชื่อเทมเพลต requires-contact
    3. คลิกที่สร้างเทมเพลต

  3. ค้นหาโค้ดต่อไปนี้:

{% section 'product-template' %}

แทนที่ด้วย:

{% section 'product-template-requires-contact' %}

โค้ดนี้จะเชื่อมโยงเทมเพลตใหม่ของคุณเข้ากับส่วนสินค้าใหม่ที่คุณจะสร้างในขั้นตอนต่อไป

  1. คลิกที่ "บันทึก"

สร้างส่วนสินค้าใหม่

  1. ในไดเรกทอรีส่วน ให้คลิก "เพิ่มส่วนใหม่"

  2. สร้างส่วน:

    1. ตั้งชื่อส่วน product-template-requires-contact ใหม่
    2. คลิกที่ "สร้างส่วน"

  3. ลบโค้ดเริ่มต้นทั้งหมดในไฟล์ส่วนเพื่อให้ไฟล์ว่างเปล่า

  4. ในไดเรกทอรีส่วน ให้คลิกที่ product-template.liquid แล้วคัดลอกเนื้อหาทั้งหมดของไฟล์ไปยังคลิปบอร์ดของคุณ

  5. กลับไปยังส่วน product-template-requires-contact.liquid ใหม่ แล้ววางโค้ดลงในไฟล์

  6. คลิกที่ "บันทึก"

ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้า

  1. ในไฟล์ส่วน product-template-requires-contact.liquid ให้ค้นหาโค้ด HTML สำหรับแบบฟอร์มสินค้าในหน้าสินค้าของคุณ คุณสามารถพบโค้ดดังกล่าวได้ด้วยการค้นหาคำว่า form ภายในไฟล์

  2. เมื่อคุณหาโค้ดพบ ให้รวมโค้ดดังกล่าวไว้ในแท็ก Liquid {% comment %} และ {% endcomment %} การดำเนินการนี้จะทำให้โค้ดดังกล่าวหยุดแสดงบนร้านค้าของคุณ แต่จะทำให้คุณสามารถใส่กลับอีกครั้งได้อย่างง่ายดายหากคุณต้องการเปลี่ยนเทมเพลตใหม่ในภายหลัง

    สำหรับธีม Narrative โค้ดที่แก้ไขจะมีลักษณะดังนี้:

    liquid {% comment %} {% include 'product-form' %} {% endcomment %}

  3. คลิกที่ "บันทึก"

เพิ่มลิงก์อีเมลหรือแบบฟอร์มการติดต่อ

ตอนนี้คุณได้ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้าแล้ว คุณสามารถเพิ่มเนื้อหาที่คุณต้องการให้แสดงแทนได้

ลิงก์อีเมล

คุณสามารถเพิ่มลิงก์อีเมลที่จะเปิดโปรแกรมอีเมลเริ่มต้นของลูกค้าและป้อนที่อยู่อีเมลสำหรับติดต่อกับลูกค้าของร้านค้าคุณเป็นผู้รับ วิธีเพิ่มลิงก์อีเมล:

  1. ในบรรทัดใหม่ด้านล่างแท็ก Liquid {% endcomment %} ที่คุณเพิ่มในขั้นตอนสุดท้าย ให้เพิ่มโค้ด HTML สำหรับลิงก์อีเมล: 
<p>Please <a href="mailto:{{ shop.email }}">contact us</a> if you are interested in this product.</p>
  1. คลิกที่ "บันทึก"

แบบฟอร์มการติดต่อ

คุณสามารถเพิ่มแบบฟอร์มการติดต่อไปยังเทมเพลตสินค้าใหม่ของคุณได้โดยการคัดลอกโค้ดจากเทมเพลตหน้าการติดต่อของธีม วิธีเพิ่มแบบฟอร์มการติดต่อ:

  1. ในไดเรกทอรีเทมเพลตให้คลิก page.contact.liquid.

  2. ค้นหาแท็ก Liquid {% form 'contact' %} ในไฟล์

  3. คัดลอกโค้ดทั้งหมดจากแท็ก Liquid {% form 'contact' %} ไปยังแท็ก Liquid {% endform %} โดยใส่แท็กแบบฟอร์ม Liquid ในโค้ดที่คุณคัดลอก

  4. กลับไปที่ไฟล์ product.requires-contact.liquid ใหม่ของคุณในไดเรกทอรีเทมเพลต

ในบรรทัดใหม่ด้านล่างแท็ก Liquid {% endcomment %} ที่คุณเพิ่ม ให้วางโค้ดสำหรับแบบฟอร์มการติดต่อ

  1. ขั้นตอนต่อไปคือการคลุมโค้ดที่คุณเพิ่งวางในแท็ก HTML div แอตทริบิวต์คลาสที่รวมอยู่ในโค้ดแท็ก div จะช่วยให้แน่ใจว่าแบบฟอร์มการติดต่อของคุณแสดงผลอย่างถูกต้องบนหน้า

    ในบรรทัดใหม่ที่ด้านบน {% form 'contact' %} ให้วางโค้ดต่อไปนี้:

<div class="form-vertical">

ในบรรทัดใหม่ด้านล่าง {% endform %} ให้วางโค้ดต่อไปนี้:

</div>
  1. คลิกที่ "บันทึก"

กำหนดเทมเพลตใหม่ให้แก่สินค้า

เมื่อเทมเพลตเสร็จสิ้นแล้ว คุณสามารถกําหนดเทมเพลตนั้นให้กับสินค้าทั้งหมดที่คุณต้องการซ่อนปุ่มเพิ่มลงในตะกร้าสินค้าได้

  1. จากส่วน Shopify admin ให้ไปที่สินค้า > สินค้าทั้งหมด

  2. คลิกที่ชื่อของสินค้าที่คุณต้องการซ่อนปุ่มเพิ่มลงในตะกร้าสินค้า

  3. ในหน้าสินค้าของส่วน Shopify admin ใต้ส่วนร้านค้าออนไลน์ ให้เลือกเทมเพลตที่ต้องมีการติดต่อรายการใหม่จากเมนูดรอปดาวน์เทมเพลตธีม

  4. คลิกที่ "บันทึก"

ปฏิบัติขั้นตอนเหล่านี้ซ้ำกับสินค้าแต่ละรายการที่คุณต้องการเพิ่มเทมเพลตใหม่

สร้างเทมเพลตสินค้าใหม่

หากต้องการแทนที่ปุ่มเพิ่มลงในตะกร้าสินค้าสำหรับสินค้า คุณจะต้องสร้างเทมเพลตสินค้าแบบกำหนดเองให้กับสินค้านั้น

  1. ในส่วน Shopify admin ให้ไปที่ร้านค้าออนไลน์ > ธีม

  2. ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด

  1. จากแอป Shopify ให้แตะ ร้านค้า

  2. ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์

  3. แตะ จัดการธีม

  4. ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด

  1. จากแอป Shopify ให้แตะ ร้านค้า

  2. ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์

  3. แตะ จัดการธีม

  4. ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด

  1. ในไดเรกทอรีเทมเพลต ให้คลิก "เพิ่มเทมเพลตใหม่"

  2. สร้างเทมเพลตสินค้า:

    1. จากเมนูดรอปดาวน์ ให้เลือกสินค้า
    2. ตั้งชื่อเทมเพลต requires-contact
    3. คลิกที่สร้างเทมเพลต

  3. ค้นหาโค้ดต่อไปนี้:

{% section 'product-template' %}

แทนที่ด้วย:

{% section 'product-template-requires-contact' %}

โค้ดนี้จะเชื่อมโยงเทมเพลตใหม่ของคุณเข้ากับส่วนสินค้าใหม่ที่คุณจะสร้างในขั้นตอนต่อไป

  1. คลิกที่ "บันทึก"

สร้างส่วนสินค้าใหม่

  1. ในไดเรกทอรีส่วน ให้คลิก "เพิ่มส่วนใหม่"

  2. สร้างส่วน:

    1. ตั้งชื่อส่วน product-template-requires-contact ใหม่
    2. คลิกที่ "สร้างส่วน"

  3. ลบโค้ดเริ่มต้นทั้งหมดในไฟล์ส่วนเพื่อให้ไฟล์ว่างเปล่า

  4. ในไดเรกทอรีส่วน ให้คลิกที่ product-template.liquid แล้วคัดลอกเนื้อหาทั้งหมดของไฟล์ไปยังคลิปบอร์ดของคุณ

  5. กลับไปยังส่วน product-template-requires-contact.liquid ใหม่ แล้ววางโค้ดลงในไฟล์

  6. คลิกที่ "บันทึก"

ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้า

  1. ในไฟล์ส่วน 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>

  1. เมื่อคุณหาโค้ดพบ ให้รวมโค้ดดังกล่าวไว้ในแท็ก Liquid {% comment %} และ {% endcomment %} การดำเนินการนี้จะทำให้โค้ดดังกล่าวหยุดแสดงบนร้านค้าของคุณ แต่จะทำให้คุณสามารถใส่กลับอีกครั้งได้อย่างง่ายดายหากคุณต้องการเปลี่ยนเทมเพลตใหม่ในภายหลัง

    สำหรับ Debut โค้ดที่ได้รับการแก้ไขจะมีลักษณะดังนี้:

    liquid {% 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 %}

  1. คลิกที่ "บันทึก"

เพิ่มลิงก์อีเมลหรือแบบฟอร์มการติดต่อ

ตอนนี้คุณได้ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้าแล้ว คุณสามารถเพิ่มเนื้อหาที่คุณต้องการให้แสดงแทนได้

ลิงก์อีเมล

คุณสามารถเพิ่มลิงก์อีเมลที่จะเปิดโปรแกรมอีเมลเริ่มต้นของลูกค้าและป้อนที่อยู่อีเมลสำหรับติดต่อกับลูกค้าของร้านค้าคุณเป็นผู้รับ วิธีเพิ่มลิงก์อีเมล:

  1. ในบรรทัดด้านล่างแท็ก Liquid {% endcomment %} ที่คุณเพิ่มไปในขั้นตอนสุดท้าย ให้เพิ่มโค้ด HTML สำหรับลิงก์อีเมล: 
``` liquid
<p>Please <a href="mailto:{{ shop.email }}">contact us</a> if you are interested in this product.</p>
2. คลิกที่ "บันทึก"
แบบฟอร์มการติดต่อ


คุณสามารถเพิ่มแบบฟอร์มการติดต่อไปยังเทมเพลตสินค้าใหม่ของคุณได้โดยการคัดลอกโค้ดจากเทมเพลตหน้าการติดต่อของธีม วิธีเพิ่มแบบฟอร์มการติดต่อ:


    

  1. ในไดเรกทอรีเทมเพลตให้คลิก page.contact.liquid.
    2. 

  2. ค้นหาแท็ก Liquid {% form 'contact' %} ในไฟล์
    3. 

  3. คัดลอกโค้ดทั้งหมดจากแท็ก Liquid {% form 'contact' %} ไปยังแท็ก Liquid {% endform %} โดยใส่แท็กแบบฟอร์ม Liquid ในโค้ดที่คุณคัดลอก
    4. 

  4. กลับไปยังไฟล์ product-template-requires-contact.liquid ใหม่ในไดเรกทอรีส่วน
    5. 

  5. ค้นหาแท็กปิด &lt;/form&gt; ภายในโค้ดดังกล่าว และวางโค้ดลงในแบบฟอร์มการติดต่อบนบรรทัดใหม่ด้านล่างของแท็กปิด &lt;/form&gt;
    6. 

  6. 

    ขั้นตอนต่อไปคือการคลุมโค้ดที่คุณเพิ่งวางในแท็ก HTML div แอตทริบิวต์คลาสที่รวมอยู่ในโค้ดแท็ก div จะช่วยให้แน่ใจว่าแบบฟอร์มการติดต่อของคุณแสดงผลอย่างถูกต้องบนหน้า
    

    ในบรรทัดใหม่ที่ด้านบน {% form 'contact' %} ให้วางโค้ดต่อไปนี้:
    

    7. 



&lt;div class="form-vertical"&gt;&lt;/div&gt;</code></pre></figure><p>    ในบรรทัดใหม่ด้านล่าง <code>{% endform %}</code> ให้วางโค้ดต่อไปนี้:</p><figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;/div&gt;</span></code></pre></figure>
<ol>
<li>คลิกที่ &quot;<strong>บันทึก</strong>&quot;
</li></ol>
<h3 id="-other-specific">กำหนดเทมเพลตใหม่ให้แก่สินค้า</h3><p>เมื่อเทมเพลตเสร็จสิ้นแล้ว คุณสามารถกําหนดเทมเพลตนั้นให้กับสินค้าทั้งหมดที่คุณต้องการซ่อนปุ่ม<strong>เพิ่มลงในตะกร้าสินค้า</strong>ได้</p>
<ol>
<li><p>จากส่วน Shopify admin ให้ไปที่<strong>สินค้า</strong> &gt; <strong>สินค้าทั้งหมด</strong></p></li><li><p>คลิกที่ชื่อของสินค้าที่คุณต้องการซ่อนปุ่ม<strong>เพิ่มลงในตะกร้าสินค้า</strong></p></li><li><p>ในหน้าสินค้าของส่วน Shopify admin ใต้ส่วน<strong>ร้านค้าออนไลน์</strong> ให้เลือกเทมเพลต<strong>ที่ต้องมีการติดต่อ</strong>รายการใหม่จากเมนูดรอปดาวน์<strong>เทมเพลตธีม</strong></p></li><li><p>คลิกที่ &quot;<strong>บันทึก</strong>&quot;</p></li></ol>
<p>ปฏิบัติขั้นตอนเหล่านี้ซ้ำกับสินค้าแต่ละรายการที่คุณต้องการเพิ่มเทมเพลตใหม่</p></div>
</div>

สร้างเทมเพลตสินค้าใหม่

หากต้องการแทนที่ปุ่มเพิ่มลงในตะกร้าสินค้าสำหรับสินค้า คุณจะต้องสร้างเทมเพลตสินค้าแบบกำหนดเองให้กับสินค้านั้น

  1. ในส่วน Shopify admin ให้ไปที่ร้านค้าออนไลน์ > ธีม

  2. ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด

  1. จากแอป Shopify ให้แตะ ร้านค้า

  2. ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์

  3. แตะ จัดการธีม

  4. ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด

  1. จากแอป Shopify ให้แตะ ร้านค้า

  2. ในส่วนช่องทางการขาย ให้แตะ ร้านค้าออนไลน์

  3. แตะ จัดการธีม

  4. ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก การดำเนินการ > แก้ไขโค้ด

  1. ในไดเรกทอรีเทมเพลต ให้คลิก "เพิ่มเทมเพลตใหม่"

  2. สร้างเทมเพลตสินค้า: a. ให้เลือกสินค้าจากเมนูดรอปดาวน์ b. ตั้งชื่อเทมเพลต requires-contact c. คลิกที่ "สร้างเทมเพลต"

ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้า

  1. ในไฟล์ 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>

  1. เมื่อคุณหาโค้ดพบ ให้รวมโค้ดดังกล่าวไว้ในแท็ก Liquid {% comment %} และ {% endcomment %} การดำเนินการนี้จะทำให้โค้ดดังกล่าวหยุดแสดงบนร้านค้าของคุณ แต่จะทำให้คุณสามารถใส่กลับอีกครั้งได้อย่างง่ายดายหากคุณต้องการเปลี่ยนเทมเพลตใหม่ในภายหลัง

    สำหรับ Debut โค้ดที่ได้รับการแก้ไขจะมีลักษณะดังนี้:

```liquid
{% 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 %}

เพิ่มลิงก์อีเมลหรือแบบฟอร์มการติดต่อ

ตอนนี้คุณได้ซ่อนปุ่มเพิ่มลงในตะกร้าสินค้าแล้ว คุณสามารถเพิ่มเนื้อหาที่คุณต้องการให้แสดงแทนได้

ลิงก์อีเมล

  1. ในบรรทัดด้านล่างแท็ก Liquid {% endcomment %} ที่คุณเพิ่มไปในขั้นตอนสุดท้าย ให้เพิ่มโค้ด HTML สำหรับลิงก์อีเมล: 
Please <a href="mailto:{{ shop.email }}">contact us</a> if you are
interested in this product.
  1. คลิกที่ "บันทึก"

แบบฟอร์มการติดต่อ

คุณสามารถเพิ่มแบบฟอร์มการติดต่อไปยังเทมเพลตสินค้าใหม่ของคุณได้โดยการคัดลอกโค้ดจากเทมเพลตหน้าการติดต่อของธีม วิธีเพิ่มแบบฟอร์มการติดต่อ:

  1. ในไดเรกทอรีเทมเพลตให้คลิก page.contact.liquid.

  2. ค้นหาแท็ก Liquid {% form 'contact' %} ในไฟล์

  3. คัดลอกโค้ดทั้งหมดจากแท็ก Liquid {% form 'contact' %} ไปยังแท็ก Liquid {% endform %} โดยใส่แท็กแบบฟอร์ม Liquid ในโค้ดที่คุณคัดลอก

  4. กลับไปที่ไฟล์ product.requires-contact.liquid ใหม่ของคุณในไดเรกทอรีเทมเพลต

  5. ค้นหาแท็กปิด </form> ภายในโค้ดดังกล่าว และวางโค้ดลงในแบบฟอร์มการติดต่อบนบรรทัดใหม่ด้านล่างของแท็กปิด </form>

  6. ขั้นตอนต่อไปคือการคลุมโค้ดที่คุณเพิ่งวางในแท็ก HTML div แอตทริบิวต์คลาสที่รวมอยู่ในโค้ดแท็ก div จะช่วยให้แน่ใจว่าแบบฟอร์มการติดต่อของคุณแสดงผลอย่างถูกต้องบนหน้า

    ในบรรทัดใหม่ที่ด้านบน {% form 'contact' %} ให้วางโค้ดต่อไปนี้:

<div class="form-vertical"></div>

ในบรรทัดใหม่ด้านล่าง {% endform %} ให้วางโค้ดต่อไปนี้:

</div>
  1. คลิกที่ "บันทึก"

กำหนดเทมเพลตใหม่ให้แก่สินค้า

เมื่อเทมเพลตเสร็จสิ้นแล้ว คุณสามารถกําหนดเทมเพลตนั้นให้กับสินค้าทั้งหมดที่คุณต้องการซ่อนปุ่มเพิ่มลงในตะกร้าสินค้าได้

  1. จากส่วนผู้ดูแลระบบ Shopify ของคุณ ให้ไปที่สินค้า

  2. คลิกที่ชื่อของสินค้าที่คุณต้องการซ่อนปุ่มเพิ่มลงในตะกร้าสินค้า

  3. ในหน้าสินค้าของส่วน Shopify admin ใต้ส่วนร้านค้าออนไลน์ ให้เลือกเทมเพลตที่ต้องมีการติดต่อรายการใหม่จากเมนูดรอปดาวน์เทมเพลตธีม

  4. คลิกที่ "บันทึก"

ปฏิบัติขั้นตอนเหล่านี้ซ้ำกับสินค้าแต่ละรายการที่คุณต้องการเพิ่มเทมเพลตใหม่

พร้อมเริ่มต้นการขายด้วย Shopify แล้วหรือยัง

ทดลองใช้งานฟรี