อัปเดตเทมเพลต Liquid สำหรับใช้กับสคริปต์

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

ในหน้านี้

การแก้ไขปัญหา

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

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

แอตทริบิวต์อ็อบเจกต์ Liquid

รายการต่อไปนี้ประกอบด้วยแอตทริบิวต์ของอ็อบเจกต์ Liquid ที่จำเป็นสำหรับการรองรับสคริปต์ในตะกร้าสินค้าของร้านค้าของคุณ:

แอตทริบิวต์ของอ็อบเจกต์ตะกร้าสินค้า:

แอตทริบิวต์ของสินค้าเฉพาะรายการ:

อ็อบเจกต์สคริปต์:

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

ตัวอย่าง

ตัวอย่างต่อไปนี้อธิบายการเปลี่ยนแปลงที่คุณสามารถทำได้ในเทมเพลต cart.liquid เพื่อรองรับสคริปต์สินค้าเฉพาะรายการ

ตัวอย่างตะกร้าสินค้า

ตัวอย่างเช่นหากคุณมีตะกร้าสินค้าเฉพาะรายการสามรายการ:

ลูกฟุตบอล - จำนวน: 1 - ราคาต่อหน่วย: $15.00
ลูกเทนนิส - จำนวน: 5 - ราคาต่อหน่วย: $5.00
รองเท้าสำหรับวิ่ง - จำนวน: 1 - ราคาต่อหน่วย: $30.00

และคุณได้เผยแพร่สคริปต์ที่ใช้ส่วนลดดังต่อไปนี้:

ส่วนลด 10% สำหรับลูกเทนนิสสองลูกหรือมากกว่า
ส่วนลด $5 สำหรับรองเท้าทั้งหมด

เทมเพลต cart.liquid ของคุณอาจเป็นตารางอย่างง่ายที่แสดงรายการสินค้าเฉพาะรายการและสรุปจำนวนเงินทั้งหมด:

<table class="cart">
  <thead class="heading">
    <tr>
      <th>Product</th>
      <th>Quantity</th>
      <th>Total</th>
    </tr>
  </thead>

  <tbody class="line-items">
    {% for item in cart.items %}
    <tr>
      <td>{{ item.product.title }}</td>
      <td>{{ item.quantity }}</td>
      <td>{{ item.line_price | money }}</td>
    </tr>
    {% endfor %}
  </tbody>

  <tfoot class="summary">
    <tr>
      <td colspan="2">Total</td>
      <td>{{ cart.total_price | money }}</td>
    </tr>
  </tfoot>
</table>

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

สินค้า	ปริมาณ	ยอดรวม
ลูกฟุตบอล	1	$15.00
ลูกเทนนิส	5	$22.50
รองเท้าสำหรับวิ่ง	1	$25.00
ยอดรวม		$62.50

อัปเดตสินค้าเฉพาะรายการ

หากต้องการแสดงส่วนลดที่ใช้งานสคริปต์เราจำเป็นต้องอัปเดตสินค้าเฉพาะรายการเพื่อแสดงข้อมูลสำคัญ 3 รายการดังต่อไปนี้:

ราคาต่อรายการก่อนใช้ส่วนลด
ราคาต่อรายการหลังใช้ส่วนลด
ข้อความที่อธิบายส่วนลดที่ถูกนำไปใช้

หากต้องการดำเนินการให้ใช้แอตทริบิวต์อ็อบเจกต์ Liquid ต่อไปนี้:

line_item.total_discount แสดงจำนวนส่วนลดที่ใช้กับสินค้าเฉพาะรายการ
line_item.original_line_price แสดงราคาสินค้าเฉพาะรายการก่อนส่วนลด
line_item.message แสดงข้อความที่อธิบายส่วนลดที่ใช้กับสินค้าเฉพาะรายการ

การใช้เอฟเฟกต์ขีดทับสามารถช่วยเน้นให้เห็นถึงความต่างระหว่างราคาดั้งเดิมและราคาที่ลดแล้ว

<tbody class="line-items">
  {% for item in cart.items %}
  <tr>
    <td>{{ item.product.title }}</td>
    <td>{{ item.quantity }}</td>
    <td>
      {{ item.line_price }}
      {% if item.total_discount > 0 %}
        <s>{{ item.original_line_price }}</s>
        ( {{ item.message }} )
      {% endif %}
    </td>
  </tr>
  {% endfor %}
</tbody>

ตะกร้าสินค้าของคุณควรจะมีลักษณะดังนี้:

สินค้า	ปริมาณ	ยอดรวม
ลูกฟุตบอล	1	$15.00
ลูกเทนนิส	5	$22.50 ~~$25.00~~(ส่วนลด 10% สำหรับลูกเทนนิสมากกว่าสองลูก)
รองเท้าสำหรับวิ่ง	1	$25.00 ~~$30.00~~ (ส่วนลด $5 สำหรับรองเท้าทุกคู่)
ยอดรวม		$62.50

อัปเดตข้อมูลสรุปของตะกร้าสินค้า

เพื่อช่วยให้ลูกค้าติดตามราคาของคำสั่งซื้อของพวกเขาคุณควรจะแสดง:

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

หากต้องการเพิ่มข้อมูลนี้ให้ใช้แอตทริบิวต์อ็อบเจกต์ Liquid ต่อไปนี้:

cart.total_discount เรียกดูจำนวนส่วนลดที่ใช้กับสินค้าในตะกร้าสินค้า
cart.original_total_price เรียกดูยอดรวมของตะกร้าสินค้าก่อนหักส่วนลด

เมื่อมีข้อมูลนี้แล้วบล็อก .summary ที่อัปเดตแล้วของคุณอาจมีลักษณะดังนี้:

<tfoot class="summary">
  <tr>
    <td colspan="2">Subtotal</td>
    <td>{{ cart.original_total_price | money }}</td>
  </tr>
  <tr>
    <td colspan="2">Discount Savings</td>
    <td>{{ cart.total_discount | money }}</td>
  </tr>
  <tr>
    <td colspan="2">Total</td>
    <td>{{ cart.total_price | money }}</td>
  </tr>
</tfoot>

ขณะนี้ตารางตะกร้าสินค้าของคุณควรมีลักษณะดังนี้:

สินค้า	ปริมาณ	ยอดรวม
ลูกฟุตบอล	1	$15.00
ลูกเทนนิส	5	$22.50 ~~$25.00~~(ส่วนลด 10% สำหรับลูกเทนนิสมากกว่าสองลูก)
รองเท้าสำหรับวิ่ง	1	$25.00 ~~$30.00~~ (ส่วนลด $5 สำหรับรองเท้าทุกคู่)
ยอดรวม		$70.00
เงินที่ประหยัดเพราะส่วนลด		$7.50
ยอดรวม		$62.50

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

ตัวอย่างอื่นๆ

ตัวอย่าง Liquid ต่อไปนี้แสดงส่วนลดสำหรับสินค้าเฉพาะรายการแต่ละรายการ:

{% if item.original_line_price != item.line_price %}
  <small class="original-price"><s>{{ item.original_line_price | money }}</s></small>
  {% endif %}
  {{ item.line_price | money }}
  {% for discount in item.discounts %}
  <small class="discount">{{ discount.title }}</small>
  {% endfor %}

ดูตัวอย่างส่วนลดอื่นที่มีการเปลี่ยนแปลงโค้ด Liquid