การปรับแต่งเทมเพลต Order Printer

คุณสามารถสร้างและปรับแต่งเทมเพลตสำหรับแอป Order Printer ได้สูงสุด 15 เทมเพลตในส่วนผู้ดูแล Shopify ของคุณ ตามค่าเริ่มต้นแล้ว แอป Order Printer จะมีเทมเพลตอยู่สองแบบ ได้แก่

• ใบแจ้งหนี้ - ใบแจ้งหนี้พื้นฐานที่คุณสามารถส่งให้ลูกค้า
• บันทึกการจัดส่ง - เอกสารที่พิมพ์ที่อยู่ร้านค้าของคุณและที่อยู่ที่จัดส่งของลูกค้า

สร้างเทมเพลต Order Printer ใหม่

การสร้างเทมเพลต Order Printer ใหม่กำหนดให้คุณต้องมีความคุ้นเคยกับ HTML, CSS และ Liquid ฝ่ายช่วยเหลือด้านธีมของ Shopify อาจช่วยปรับเปลี่ยนรายละเอียดเล็กน้อยให้กับธีมฟรีของ Shopify ได้ภายใต้ขอบเขตของนโยบายการออกแบบของ Shopify หากคุณต้องการการเปลี่ยนแปลงที่ซับซ้อนขึ้นหรือใช้ธีมที่ Shopify ไม่ได้สร้างขึ้น โปรดพิจารณาจ้างShopify Partner

ขั้นตอน:

1. จากส่วนผู้ดูแล Shopify ให้ไปที่ แอป > Order Printer (เวอร์ชันเก่า)

2. คลิกจัดการเทมเพลต

3. คลิกเพิ่มเทมเพลต

4. ป้อนชื่อสำหรับเทมเพลตใหม่ของคุณในช่องชื่อ

5. เพิ่มโค้ด HTML, CSS หรือ Liquid ในช่องโค้ดเพื่อสร้างเทมเพลตของคุณ

6. เมื่อดำเนินการเสร็จสิ้นแล้ว ให้คลิกบันทึก

แก้ไขเทมเพลต Order Printer

การแก้ไขเทมเพลต Order Printer ของคุณกำหนดให้คุณต้องมีความคุ้นเคยกับ HTML, CSS และ Liquid ฝ่ายช่วยเหลือด้านธีมของ Shopify ไม่สามารถแก้ไขเทมเพลตให้คุณได้อย่างครอบคลุม แต่อาจช่วยปรับเปลี่ยนรายละเอียดเล็กน้อยให้กับธีมฟรีของ Shopify ได้ภายใต้ขอบเขตของนโยบายการออกแบบของ Shopify สำหรับการเปลี่ยนแปลงที่ซับซ้อนขึ้น โปรดพิจารณาจ้างShopify Partner

ขั้นตอน:

1. จากส่วนผู้ดูแล Shopify ให้ไปที่ แอป > Order Printer (เวอร์ชันเก่า)

2. คลิกจัดการเทมเพลต

3. คลิกชื่อเทมเพลตที่คุณต้องการจะแก้ไข

4. ทำการเปลี่ยนแปลงเทมเพลตโดยการเพิ่มหรือแก้ไขโค้ด HTML, CSS หรือ Liquid ในช่องโค้ด หากต้องการดูตัวอย่างการปรับแต่งเทมเพลต โปรดดูที่ ตัวอย่างการปรับแต่งเทมเพลต

5. เมื่อดำเนินการเสร็จสิ้นแล้ว ให้คลิกบันทึก

ตัวอย่างการปรับแต่งเทมเพลต

ตัวอย่างต่อไปนี้จะอธิบายถึงวิธีทั่วไปบางประการในการปรับแต่งเทมเพลต Order Printer

• เพิ่มโลโก้ของคุณลงในเทมเพลต Order Printer
• กำหนดให้ความกว้างของตารางเป็น 100%
• แสดงรูปภาพขนาดย่อของสินค้า
• เพิ่มรายละเอียดคำสั่งซื้อ

ตัวอย่าง: เพิ่มโลโก้ของคุณลงในเทมเพลต Order Printer

ซึ่งใน HTML ควรมีลักษณะดังนี้

ตัวอย่าง: กำหนดให้ความกว้างของตารางเป็น 100%

หากต้องการให้ตารางของคุณมีเส้นขอบและขยายจนเต็มความกว้าง 100% ให้เพิ่มคลาส table-tabular ไปยังตารางของคุณ

<table class="table-tabular">
    ...
</table>

ตัวอย่าง: แสดงรูปภาพขนาดย่อของสินค้า

หากต้องการใส่รูปภาพขนาดย่อของสินค้า ให้แทรกโค้ดนี้ลงในเทมเพลตของคุณ

{{ line_item.product.featured_image | product_img_url: 'thumb' | img_tag }}

เพิ่มรายละเอียดคำสั่งซื้อ

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

1. จากส่วนผู้ดูแล Shopify ให้ไปที่ แอป > Order Printer (เวอร์ชันเก่า)

2. คลิกจัดการเทมเพลต

3. คลิกชื่อเทมเพลตที่คุณต้องการจะแก้ไข

4. ใช้ตัวแปร Liquid เพื่อเพิ่มรายละเอียดคำสั่งซื้อและใช้ HTML เพื่อเพิ่มการจัดรูปแบบ ตัวอย่างเช่น {{ line_item.price | money }} จะพิมพ์ราคาของรายการ

5. เมื่อดำเนินการเสร็จสิ้นแล้ว ให้คลิกบันทึก

ตัวอย่างเช่น Nyla ต้องการแก้ไขเทมเพลตบันทึกการจัดส่งของเธอเพื่อรวมรายการสินค้าที่กำลังจะจัดส่ง เธอจึงเพิ่มโค้ดต่อไปนี้ที่ด้านล่างของเทมเพลตบันทึกการจัดส่งในแอป Order Printer

<br>
<br>
<table class="table-tabular" style="margin: 0 0 1.5em 0;">
  <thead>
    <tr>
      <th>Quantity</th>
      <th>Item</th>
      {% if tax_lines.size > 0 %}
      <th>Taxes</th>
      {% endif %}
      <th>Price</th>
    </tr>
  </thead>
  <tbody>
    {% for line_item in line_items %}
      <tr>
        <td>{{ line_item.quantity }} x</td>
        <td><b>{{ line_item.title }}</b></td>
        {% if line_item.tax_lines %}
          <td>
            {% for tax_line in line_item.tax_lines %}
              {{ tax_line.price | money }} {{ tax_line.title }}<br/>
            {% endfor %}
          </td>
        {% endif %}
        <td>{{ line_item.price | money }}</td>
      </tr>
    {% endfor %}
  </tbody>
</table>

ด้วยเหตุนี้ บันทึกการจัดส่งของ Nyla จึงมีตารางที่แสดงรายการสินค้าที่สั่งซื้อ