การแก้ไขโค้ดธีม
คุณสามารถแก้ไขโค้ดธีมของคุณเพื่อทำการเปลี่ยนแปลงร้านค้าออนไลน์ของคุณอย่างละเอียดได้ ไฟล์ส่วนใหญ่ที่ประกอบขึ้นเป็นธีมมี Liquid ซึ่งเป็นภาษาเทมเพลตของ Shopify และยังมีไฟล์ธีมแบบ HTML, CSS, JSON และ JavaScript. ควรแก้ไขโค้ดสำหรับธีมหากคุณสามารถใช้งานไฟล์ HTML และ CSS และมีความเข้าใจพื้นฐานเกี่ยวกับ Liquid เท่านั้น
ในหน้านี้
ก่อนปรับแต่งธีมของคุณ
หากต้องการเตรียมพร้อมสำหรับการปรับแต่งธีมของคุณ ให้ดำเนินการตามง านที่แนะนำต่อไปนี้:
- ทำซ้ำธีมเพื่อทำสำเนาข้อมูลสำรอง ซึ่งจะทำให้การละทิ้งการเปลี่ยนแปลงของคุณและเริ่มต้นใหม่ง่ายขึ้น หากจำเป็น
- ตรวจสอบให้แน่ใจว่าคุณทราบว่าสามารถใช้งานระดับความช่วยเหลือใดได้บ้าง
- ดูข้อมูลเกี่ยวกับข้อกำหนดและหลักปฏิบัติที่ดีที่สุดสำหรับการอัปโหลดรูปภาพ
แก้ไขรหัสธีมของคุณ
คุณสามารถแก้ไขรหัสสำหรับธีมของคุณได้
ขั้นตอน:
เดสก์ท็อป
- ในส่วนผู้ดูแล Shopify ให้ไปที่ร้านค้าออนไลน์ > ธีม
- คลิก ... > "แก้ไขรหัส"
iPhone
- จากแอป Shopify ให้แตะที่ปุ่ม …
- ในส่วนช่องทางการขาย ให้แตะที่ร้านค้าออนไลน์
- แตะจัดการธีม
- คลิก ... > "แก้ไขรหัส"
Android
- จากแอป Shopify ให้แตะที่ปุ่ม …
- ในส่วนช่องทางการขาย ให้แตะที่ร้านค้าออนไลน์
- แตะจัดการธีม
- คลิก ... > "แก้ไขรหัส"
เครื่องมือแก้ไขรหัสจะแสดงไดเรกทอรีของไฟล์ธีมด้านซ้าย และช่องว่างเพื่อดูและแก้ไขไฟล์ด้านขวา
เมื่อคุณคลิกไฟล์ในไดเรกทอรีทางด้านซ้าย ไฟล์นั้นจะเปิดขึ้นมาในเครื่องมือแก้ไขรหัส คุณสามารถเปิดและแก้ไขไฟล์หลายไฟล์พร้อมกัน ได้ โดยไฟล์ใดก็ตามที่คุณแก้ไขจะมีจุดปรากฏอยู่ข้างชื่อไฟล์:
สิ่งนี้สามารถช่วยให้คุณสามารถติดตามการเปลี่ยนแปลงที่คุณได้ทำไว้ได้
เรียกคืนธีมเวอร์ชันเก่าของคุณ
หากคุณได้เปลี่ยนไฟล์ธีมและต้องการเปลี่ยนกลับ คุณสามารถย้อนไฟล์ .liquid ทีละไฟล์กลับไปยังเวลาและวันที่ก่อนที่คุณจะทำการเปลี่ยนแปลงได้
ขั้นตอน:
เดสก์ท็อป
- ในส่วนผู้ดูแล Shopify ให้ไปที่ร้านค้าออนไลน์ > ธีม
- ค้นหาธีมที่คุณต้องการแก้ไข แล้วคลิกปุ่ม … เพื่อเปิดเมนูดำเนินการ จากนั้นคลิก แก้ไขโค้ด
- ใต้ส่วนหัวเทมเพลต ให้คลิกที่หนึ่งในไฟล์ .liquid ที่คุณเพิ่งแก้ไข
- คลิกที่ เวอร์ชัน ปัจจุบัน
.liquidชื่อไฟล์ - คลิกที่เมนูดรอปดาวน์เพื่อเลือกเวอร์ชันที่เก่ากว่า การคลิกที่ datestamp จะเป็นการย้อนโค้ดกลับไปเป็นเวอร์ชันที่บันทึกไว้
- ตัวเลือกเสริม: คลิก ดูตัวอย่างร้านค้าเพื่อตรวจสอบยืนยันว่าแก้ไขข้อผิดพลาดแล้ว
iPhone
- จา กแอป Shopify ให้แตะที่ปุ่ม …
- ในส่วนช่องทางการขาย ให้แตะที่ร้านค้าออนไลน์
- แตะจัดการธีม
- ค้นหาธีมที่คุณต้องการแก้ไข แล้วคลิกปุ่ม … เพื่อเปิดเมนูดำเนินการ จากนั้นคลิก แก้ไขโค้ด
- ใต้ส่วนหัวเทมเพลต ให้คลิกที่หนึ่งในไฟล์ .liquid ที่คุณเพิ่งแก้ไข
- คลิกที่ เวอร์ชัน ปัจจุบัน
.liquidชื่อไฟล์ - คลิกที่เมนูดรอปดาวน์เพื่อเลือกเวอร์ชันที่เก่ากว่า การคลิกที่ datestamp จะเป็นการย้อนโค้ดกลับไปเป็นเวอร์ชันที่บันทึกไว้
- ตัวเลือกเสริม: คลิก ดูตัวอย่างร้านค้าเพื่อตรวจสอบยืนยันว่าแก้ไขข้อผิดพลาดแล้ว
Android
- จากแอป Shopify ให้แตะที่ปุ่ม …
- ในส่วนช่องทางการขาย ให้แตะที่ร้านค้าออนไลน์
- แตะจัดการธีม
- ค้นหาธีมที่คุณต้องการแก้ไข แล้วคลิกปุ่ม … เพื่อเปิดเมนูดำเนินการ จากนั้นคลิก แก้ไขโค้ด
- ใต้ส่วนหัวเทมเพลต ให้คลิกที่หนึ่งในไฟล์ .liquid ที่คุณเพิ่งแก้ไข
- คลิกที่ เวอร์ชัน ปัจจุบัน
.liquidชื่อไฟล์ - คลิกที่เมนูดรอปดาวน์เพื่อเลือกเวอร์ชันที่เก่ากว่า การคลิกที่ datestamp จะเป็นการย้อนโค้ดกลับไปเป็นเวอร์ชันที่บันทึกไว้
- ตัวเลือกเสริม: คลิก ดูตัวอย่างร้านค้าเพื่อตรวจสอบยืนยันว่าแก้ไขข้อผิดพลาดแล้ว
ตรวจสอบธีม
ตัวแก้ไขรหัสประกอบด้วยการตรวจสอบธีมซึ่งเป็นฟีเจอร์ที่ช่วยป้องกันข้อผิดพลาดโดยการให้ความคิดเห็นทันทีในขณะเขียนรหัสแทนที่จะไปค้นพบข้อผิดพลาดในธีมที่ใช้อยู่ของคุณ
ในตัวแก้ไ ขรหัส การตรวจสอบธีมสามารถระบุข้อผิดพลาดต่อไปนี้ในรหัสที่แก้ไขแล้วได้:
- สคริปต์การบล็อกพาร์เซอร์ ซึ่งอาจทำให้หน้าร้านทำงานช้าลง
- ความไม่สอดคล้องกันระหว่างไฟล์การแปล เช่น ไม่มีคีย์การแปลหรือการแปลที่ไม่ตรงกันในไฟล์ภาษาท้องถิ่น
- ไม่มีเทมเพลต
ข้อผิดพลาดจะระบุด้วยเส้นสีแดงใต้รหัส หากต้องการดูข้อผิดพลาด ให้เลื่อนเมาส์ไปที่เส้นที่มีการไฮไลต์
บทแนะนำการใช้งานการปรับแต่งรหัสธีม
คุณสามารถทำตามบทแนะนำการใช้งานการปรับแต่งโค้ดธีมเพื่อเป็นแนวทางในการเปลี่ยนแปลงร้านค้าออนไลน์ของคุณได้ โดยระบบจะจัดระเบียบบทแนะนำการใช้งานตามประเภทของหน้าหร ือฟีเจอร์ที่ต้องการปรับเปลี่ยน
บทแนะนำการใช้งานการปรับแต่งธีมจะแบ่งตามเวอร์ชันของสถาปัตยกรรมธีมที่ใช้ ดูวิธีระบุเวอร์ชันสถาปัตยกรรมธีมของคุณ
รับความช่วยเหลือในการปรับแต่ง
หากคุณต้องการความช่วยเหลือในการเปลี่ยนแปลงธีมของคุณ คุณสามารถติดต่อผู้พัฒนาธีมเพื่อรับความช่วยเหลือได้
หากต้องการดูแหล่งข้อมูลอื่นที่มีอยู่เพื่อช่วยเหลือคุณเกี่ยวกับการปรับแต่งธีม โปรดดูแหล่งข้อมูลเพิ่มเติมสำหรับความช่วยเหลือด้านธีม