ในบทช่วยสอนนี้ คุณจะได้เรียนรู้วิธีสร้างเว็บไซต์หลายภาษาด้วย Stitched และ WPML Stitched เป็นธีมสำหรับช่างฝีมือ คุณสามารถใช้คอมโพเนนต์แนะนำหน้าแรกเพื่อบอกเล่าเรื่องราวของคุณให้ผู้เยี่ยมชมทราบ และคุณสามารถขยายฟังก์ชันการทำงานได้โดยการติดตั้งปลั๊กอินที่แนะนำซึ่งสามารถทำงานร่วมกับธีมได้
Stitched พัฒนาโดย WooThemes สำหรับธีมและปลั๊กอินที่พัฒนาโดย WooThemes เราขอแนะนำให้คุณใช้ GUI ที่มีอยู่ใน WPML สำหรับการแปลคุณสมบัติพิเศษที่ WooThemes / ปลั๊กอินใช้ในโค้ด ในบทช่วยสอนนี้ ฉันจะแนะนำขั้นตอนต่างๆ เพื่อให้คุณทำได้อย่างราบรื่น
คุณสามารถดูตัวอย่างจริงได้ในเว็บไซต์เดโม Stitched + WPML
ในการรันเว็บไซต์ Stitched หลายภาษาด้วย WPML คุณจะต้องมีสิ่งต่อไปนี้:
- ธีม Stitched
- WPML เวอร์ชันล่าสุด รวมถึงโมดูลการแปลสตริงและการจัดการการแปล
เริ่มต้นใช้งาน
ต่อไปนี้คือขั้นตอนหลักที่คุณต้องทำตามเพื่อเริ่มต้นใช้งาน:
- ติดตั้งและเปิดใช้งาน Stitched
- ติดตั้งและเปิดใช้งานปลั๊กอิน WPML (WPML Multilingual CMS, WPML การแปลสตริง, WPML การจัดการการแปล)
- ตั้งค่า WPML จาก WPML->ภาษา ดูคู่มือเริ่มต้นใช้งาน WPML ของเราสำหรับข้อมูลอ้างอิงฉบับสมบูรณ์
- ติดตั้งและเปิดใช้งานหนึ่งในปลั๊กอินหลายตัวที่สามารถทำงานร่วมกับ Stitched ได้ สำหรับบทช่วยสอนนี้ เราจะใช้ Projects
การแปลข้อความแนะนำ
คุณสมบัติ 'ข้อความแนะนำ' (Introductory Message) ของธีม Stitched เป็นการรวมกันของรูปภาพ Gravatar ของผู้ดูแลเว็บไซต์และข้อความสโลแกนของไซต์ ด้วย WPML ข้อความใดๆ (หรือที่เราเรียกว่าสตริง) ที่ไม่ได้เป็นส่วนหนึ่งของโพสต์ หน้า และอนุกรมวิธาน จะถูกแปลโดยใช้โมดูลการแปลสตริง
ข้อความสำหรับส่วนนั้นตั้งค่าไว้ที่ การตั้งค่า > ทั่วไป
และตอนนี้ในการแปล คุณเพียงแค่ไปที่ WPML->การแปลสตริง และค้นหาสตริงนั้น
แปล ทำเครื่องหมายว่าเสร็จสมบูรณ์ แล้วบันทึก
ดังนั้นนี่คือลักษณะส่วนหน้าเว็บไซต์ของเราในตอนนี้ รวมถึงรูปภาพ Gravatar ที่ธีมดึงมาโดยอัตโนมัติตามการตั้งค่าของคุณ
การแปลข้อความทั่วไป
Stitched มาพร้อมกับสตริงเพิ่มเติมบางส่วนที่คุณอาจต้องการแปล คุณสามารถแปลส่วนที่ขาดหายไปให้เสร็จสมบูรณ์ได้โดยใช้โมดูลการแปลสตริงของ WPML ตามที่ฉันได้อธิบายไว้สำหรับ 'ข้อความแนะนำ' หากมีสตริงบางส่วนขาดหายไป ให้ทำตามคำแนะนำสำหรับการแปลธีมและปลั๊กอิน สรุปสั้นๆ คือไปที่ WPML->การแปลธีมและปลั๊กอิน แล้วคลิกที่ 'สแกนธีมเพื่อหาสตริง' (Scan the theme for strings) โปรดทราบว่าคุณสามารถกรองหาสตริงที่ถูกต้องได้อย่างง่ายดายในเมนูแบบเลื่อนลงของบริบท – สำหรับ Stitched ให้กรองเป็น 'theme woothemes' และสำหรับปลั๊กอิน 'Projects' ให้กรองเป็น 'plugin projects-by-woothemes' ซึ่งจะมีลักษณะดังนี้:
การแปลปลั๊กอินที่ผสานการทำงาน
ตอนนี้เราได้เห็นวิธีแปลข้อความทั้งหมดที่มาจากธีมแล้ว มาดูกันว่าเราจะทำให้สตริงและคุณสมบัติที่มาจากปลั๊กอินของ Woo สามารถแปลได้เช่นกันอย่างไร สำหรับบทช่วยสอนนี้ ฉันได้เลือกปลั๊กอินที่ยอดเยี่ยมมากซึ่งแนะนำให้ใช้กับ Stitched นั่นคือ 'Projects โดย WooThemes'
หลังจากที่คุณติดตั้งและเปิดใช้งาน 'Projects' แล้ว คุณจะเห็นเมนูใหม่ในหน้าจัดการเว็บไซต์ WordPress ของคุณที่ชื่อว่า...'projects' ดังนี้:
เพื่อให้โปรเจกต์ของคุณและหมวดหมู่สามารถแปลได้ คุณต้องใช้การตั้งค่า WPML (WPML GUI) โดยพื้นฐานแล้วสิ่งที่คุณต้องทำคือไปที่ WPML->การจัดการการแปล ดังนี้
เลือก การตั้งค่าเนื้อหาหลายภาษา จากแท็บด้านบน
ก่อนที่เราจะดำเนินการต่อ ขออธิบายสั้นๆ เกี่ยวกับสิ่งที่เกิดขึ้นเบื้องหลัง – ปลั๊กอิน Projects เช่นเดียวกับปลั๊กอิน (และธีม) อื่นๆ ใช้ประเภทโพสต์แบบกำหนดเอง (Custom Post Types) สำหรับการทำงาน โพสต์เหล่านี้เป็นโพสต์แบบ 'พิเศษ' และเนื่องจากเป็นโพสต์พิเศษ WPML จึงไม่ 'รู้' ว่าจำเป็นต้องแปลโพสต์เหล่านี้ ดังนั้นขั้นตอนต่อไปของเราคือการบอก WPML ว่า – ให้แปล Projects!
คลิกที่ Custom posts เลือก แปล สำหรับ Projects – อย่างที่คุณเห็น คุณยังสามารถตั้งค่า slug ของ Projects ให้แปลได้ด้วย และด้านล่างคุณสามารถแปล อนุกรมวิธานที่กำหนดเอง ที่เกี่ยวข้องกับโพสต์แบบกำหนดเองเหล่านี้ได้ ซึ่งในกรณีนี้เรียกว่า 'Project categories' จากนั้นเพียงแค่ บันทึก ก็เสร็จเรียบร้อย ในทำนองเดียวกัน คุณสามารถควบคุมวิธีจัดการฟิลด์กำหนดเองสำหรับการแปลได้โดยคลิกที่ลิงก์ การแปลฟิลด์ที่กำหนดเอง ที่ด้านบน สำหรับ Projects คุณสามารถตั้งค่าฟิลด์กำหนดเองได้ 3 ฟิลด์ ได้แก่ _client, _project_image_gallery และ _url แต่สำหรับฟิลด์เหล่านี้ ฉันขอแนะนำให้คุณทำตามหัวข้อถัดไป -
มาดูกันว่าหน้าผู้ดูแลระบบของ Projects มีลักษณะอย่างไร เราคลิกที่ 'Projects' ในหน้าจอผู้ดูแลระบบ และตอนนี้ – เช่นเดียวกับหน้าหรือโพสต์ 'ปกติ' ทั่วไป เราสามารถทำสำเนา หรือแปลโปรเจกต์ที่มีอยู่ สร้างโปรเจกต์ใหม่ในภาษาใดก็ได้ที่เราต้องการ และที่สำคัญมาก – สามารถใช้ฟังก์ชันการทำงานทั้งหมดของประเภทโพสต์โปรเจกต์ได้ – ในกรณีนี้ เราสามารถเพิ่มรายละเอียด คำอธิบาย และแกลเลอรีพิเศษที่ปลั๊กอินมีให้ ดังนี้:
การทำให้ฟิลด์กำหนดเอง (และสิ่งอื่นๆ) แปลได้ในหน้าแก้ไขโพสต์แบบกำหนดเอง
ประเด็นสุดท้ายในส่วนนี้ – อย่างที่คุณอาจสังเกตเห็นในหน้าจอก่อนหน้า – คุณยังสามารถควบคุมวิธีจัดการ ฟิลด์ที่กำหนดเอง และแม้แต่อนุกรมวิธานและประเภทโพสต์สำหรับการแปลในแต่ละหน้าแก้ไขสำหรับโพสต์ได้ ลองขยายดูสักนิด:
ที่นี่เราต้องการให้คัดลอก _project_image_gallery ระหว่างภาษา และฉันพบว่าฟิลด์ _client และ _url ควรปล่อยไว้โดยไม่ต้องแปล – คุณยังสามารถเปลี่ยนฟิลด์เหล่านี้ได้ในหน้าโพสต์ที่แปลแล้ว แต่เราไม่จำเป็นต้องแปลจริงๆ
การจัดรูปแบบตัวสลับภาษา
สุดท้ายแต่ไม่ท้ายสุด มาทำการปรับแต่งเล็กน้อยเพื่อให้ตัวสลับภาษาของ WPML ผสานเข้ากับการนำทางหลักของ Stitched ได้อย่างสมบูรณ์แบบ ตัวสลับภาษาของ WPML ได้เพิ่มคลาสที่คุณสามารถจัดรูปแบบได้ตามความต้องการ หรือคุณสามารถสร้างตัวสลับภาษาแบบกำหนดเองทั้งหมดเลยก็ได้หากต้องการ แต่ที่นี่ไม่จำเป็น สิ่งที่เราต้องการคือการเพิ่ม padding ให้กับธงเพื่อให้ 'จัดวาง' เข้าที่และดูไม่แปลกตา
ในการทำเช่นนั้น ให้ไปที่ WPML->ภาษา->ตัวเลือกตัวสลับภาษา->CSS เพิ่มเติม (ไม่บังคับ) และเพิ่ม padding ให้กับคลาสที่ควบคุมการจัดรูปแบบของรูปภาพธงของตัวสลับภาษา – img.iclflag
ตอนนี้ดูสวยงามมาก เหมือนกับรายการเมนู Stitched อื่นๆ
บทสรุป
Stitched เป็นธีมที่ยอดเยี่ยมมากสำหรับการทำเป็นหลายภาษาและบอกให้โลกได้รู้เกี่ยวกับตัวคุณและโปรเจกต์ของคุณ คุณยังสามารถเพิ่มร้านค้าลงไปได้โดยใช้ WooCommerce และ WPML Multilingual & Multicurrency for WooCommerce เราได้เห็นแล้วว่าคุณสามารถปรับคุณสมบัติต่างๆ ได้อย่างราบรื่นโดยใช้ WPML
เวอร์ชันที่ใช้
- WordPress 3.9
- WPML 3.1.5
- ธีม Stitched 1.0.2
- ปลั๊กอิน Projects 1.2.0
