Page Builder Sandwich ควรเข้ากันได้กับโมดูลต่างๆ ของ Jetpack
โมดูล Markdown มีการทำงานพิเศษบางอย่างเมื่อบันทึกเนื้อหา ซึ่งส่งผลให้การเปลี่ยนแปลงสูญหายระหว่างการแปลงมาร์กดาวน์ เพื่อจัดการกับปัญหานี้ ข้อความมาร์กดาวน์ในตัวแก้ไขส่วนหลังบ้านจะเปลี่ยนเป็นแท็ก html เมื่อบันทึกการเปลี่ยนแปลงของคุณจากส่วนหน้าบ้าน (ขอขอบคุณ Jake Jackson สำหรับความช่วยเหลือ)
เราได้ทดสอบ Page Builder Sandwich กับ PHP 7 แล้ว และทุกอย่างควรทำงานได้เป็นอย่างดีโดยไม่มีปัญหาใด ๆ
โปรดใช้ความระมัดระวังเมื่ออัปเกรดเว็บไซต์ของคุณจากเวอร์ชันที่ต่ำกว่าเป็น PHP 7 เนื่องจากมีความไม่เข้ากันกับเวอร์ชันก่อนหน้าเป็นจำนวนมาก ซึ่งควรได้รับการจัดการในทุกธีมและปลั๊กอินของคุณ
มีข้อผิดพลาด Javascript เกิดขึ้นเมื่อใช้งานทั้ง Page Builder Sandwich & Materialize ร่วมกัน มีความขัดแย้งระหว่าง materialize.js และเครื่องมือเลือกสีของ WordPress Core
มีการเปิดประเด็นปัญหานี้ไว้ใน GitHub repo ของ Materialize: https://github.com/Dogfalo/materialize/issues/2821
ปลั๊กอินจะยังคงทำงานได้อย่างถูกต้องตราบใดที่คุณไม่ได้ปิดการใช้งานใบอนุญาตบนเว็บไซต์ของคุณ เมื่อคุณปิดการใช้งานแล้ว คุณจะไม่สามารถเปิดใช้งานใหม่อีกครั้งได้
คุณจะไม่สามารถรับการอัปเดตจากแดชบอร์ด WordPress ของคุณ หรือเข้าถึงเวอร์ชันที่ใหม่กว่าได้ และเราจะไม่สามารถให้การสนับสนุนเฉพาะทางที่ยอดเยี่ยมแก่คุณได้
การเพิ่มวิดเจ็ตสามารถทำได้โดยคลิกปุ่ม Widget Element ใน ส่วน Elements ในตัวตรวจสอบ เมื่อคลิกแล้ว จะมีป๊อปอัปปรากฏขึ้นเพื่อแสดงรายการวิดเจ็ตทั้งหมดที่ Page Builder Sandwich พบในเว็บไซต์ของคุณ
วิดเจ็ตทั้งหมดที่พบในไซต์ WordPress ของคุณสามารถเพิ่มได้ อย่างไรก็ตาม วิดเจ็ตบางตัวที่ใช้โค้ด Javascript ที่กำหนดเอง/มีความเฉพาะเจาะจงภายในการตั้งค่าอาจทำงานได้ไม่สมบูรณ์ วิดเจ็ตที่ใช้สิ่งต่อไปนี้อาจไม่ทำงาน:
วิดเจ็ตเริ่มต้นของ WordPress และวิดเจ็ตที่สร้างขึ้นในลักษณะเดียวกันจะไม่มีปัญหาใดๆ
หากคุณจำเป็นต้องใช้วิดเจ็ตนั้นจริงๆ มีวิธีแก้ไขปัญหาดังนี้
คุณสามารถใช้ปลั๊กอิน Custom Sidebars by WPMU Dev เพื่อสร้างแถบด้านข้าง/พื้นที่วิดเจ็ตใหม่ เพิ่มวิดเจ็ตของคุณลงในนั้นโดยใช้วิธีปกติใน รูปแบบเว็บ > วิดเจ็ต จากนั้นใน Page Builder Sandwich ให้เพิ่ม Sidebar Element และเลือกแถบด้านข้างที่มีวิดเจ็ตที่คุณต้องการ
อีกทางเลือกหนึ่งคือการสร้างเอฟเฟกต์ที่คุณต้องการขึ้นมาใหม่โดยใช้องค์ประกอบและสไตล์ต่างๆ ที่มีอยู่ใน Page Builder Sandwich
เมื่อคุณซื้อ Page Builder Sandwich เป็นครั้งแรก ไฟล์ .zip ที่มีปลั๊กอินจะถูกดาวน์โหลดลงในคอมพิวเตอร์ของคุณโดยอัตโนมัติ
ในกรณีที่คุณทำไฟล์นี้หาย คุณสามารถดาวน์โหลดไฟล์ .zip ของคุณได้อีกครั้งโดยเข้าถึงลิงก์นี้: https://dashboard.freemius.com/license-recovery/203/page-builder-sandwich/
การกรอกใบอนุญาตของคุณที่ลิงก์นี้จะช่วยให้คุณสามารถกู้คืนไฟล์ .zip ของ Page Builder Sandwich พร้อมกับใบอนุญาตและรายละเอียดบัญชีของคุณได้
ในทางเทคนิคแล้ว สิ่งนี้ควรทำงานร่วมกับทุก ๆ ธีมได้
ร่วมกับผู้ใช้และลูกค้าของเรา เราได้ใช้งาน Page Builder Sandwich ร่วมกับธีมมากมายได้สำเร็จ ซึ่งรวมถึงธีมจากคลังธีมของ WordPress.org, Genesis Themes, StudioPress Themes, Elegant Themes และธีมจาก ThemeForest
อย่างไรก็ตาม อาจมีบางครั้งที่ธีมของคุณอาจมีการทำงานที่ไม่เป็นไปตามมาตรฐานทั่วไปและอาจทำให้ Page Builder Sandwich ไม่สามารถทำงานได้อย่างถูกต้อง เมื่อเกิดเหตุการณ์ดังกล่าว โปรดส่งคำขอรับการสนับสนุนมายังเรา แล้วเราจะพยายามตรวจสอบและแก้ไขให้
มีธีมและปลั๊กอินอื่น ๆ นับพันรายการ ดังนั้นแม้ว่าเราจะพยายามระมัดระวังและสร้างทุกอย่างให้ได้มาตรฐาน แต่บางครั้งก็อาจเกิดข้อผิดพลาดขึ้นได้
หากคุณพบว่า Page Builder Sandwich ทำงานได้ไม่ถูกต้องในการตั้งค่าของคุณ ต่อไปนี้เป็นขั้นตอนสองสามข้อที่คุณสามารถทำได้เพื่อแก้ไขปัญหา
ดูบทความได้ที่นี่: ปุ่ม “Edit with Page Builder Sandwich” ไม่ปรากฏ หากยังแก้ปัญหาไม่ได้ โปรดอ่านต่อ
เรียกดูบทความต่าง ๆ ใน หมวดหมู่การแก้ไขปัญหาในเอกสารคู่มือ
WordPress, ปลั๊กอินของคุณ, ธีมของคุณ และแม้แต่ Page Builder Sandwich การอัปเดตอยู่เสมอเป็นสิ่งที่ดี การทำให้แน่ใจว่าทุกอย่างของคุณได้รับการอัปเดตหมายความว่าคุณจะได้รับการแก้ไขข้อบกพร่องและช่องโหว่ล่าสุดสำหรับเว็บไซต์ของคุณ
หากคุณไม่สามารถแก้ไขเนื้อหาของคุณด้วย Page Builder Sandwich ได้ (และอาจมีหน้าต่างป๊อปอัปแจ้งข้อผิดพลาดแสดงขึ้นมา) อาจเป็นไปได้ว่าเนื้อหาของหน้าที่คุณกำลังเปิดอยู่นั้นสร้างขึ้นโดยธีมหรือปลั๊กอินทั้งหมด หากต้องการตรวจสอบสิ่งนี้ ให้แก้ไขหน้า/โพสต์ของคุณในระบบหลังบ้านตามปกติโดยใช้ WordPress จากนั้นตรวจสอบว่าเนื้อหาที่คุณบันทึกไว้แสดงขึ้นในส่วนหน้าหรือไม่ หากไม่ปรากฏ แสดงว่าเนื้อหาหน้า/โพสต์นั้นถูกสร้างขึ้นทั้งหมดและไม่สามารถแก้ไขได้โดยใช้ PBS
บางครั้ง ปลั๊กอินอาจเกิดข้อขัดแย้งกับ Page Builder Sandwich ในการตรวจสอบว่าปลั๊กอินใดอาจเป็นสาเหตุของข้อขัดแย้ง ให้ปิดใช้งานปลั๊กอินแล้วตรวจสอบว่า PBS กลับมาทำงานได้อีกครั้งหรือไม่ ทำสิ่งนี้กับปลั๊กอินแต่ละตัวที่คุณเปิดใช้งานไว้ หาก PBS เริ่มกลับมาทำงานได้อีกครั้งและคุณสามารถแก้ไขหน้าของคุณได้ แสดงว่าปลั๊กอินที่คุณเพิ่งปิดใช้งานไปนั้นไม่สามารถทำงานร่วมกับ PBS ได้ ในกรณีดังกล่าว โปรดติดต่อเราทางอีเมลที่ [email protected] และแจ้งให้เราทราบเพื่อให้เราแก้ไขปัญหาต่อไป
หากการปิดใช้งานปลั๊กอินไม่ได้ผล ให้ลองเปลี่ยนธีมของคุณเป็นธีมเริ่มต้นของ WordPress (เช่น ธีมตระกูล Twenty ต่าง ๆ) หากคุณสามารถเริ่มแก้ไขเนื้อหาด้วย Page Builder Sandwich ได้อีกครั้ง แสดงว่าธีมที่คุณใช้อยู่ไม่สามารถทำงานร่วมกับ PBS ได้ ส่งข้อมูลนี้ถึงเราทางอีเมลที่ [email protected] และแจ้งให้เราทราบเพื่อให้เราดำเนินการแก้ไข
ในบางกรณีที่พบได้ไม่บ่อย ส่วนขยายของเบราว์เซอร์อาจขัดขวางไม่ให้โค้ด Javascript ในเว็บไซต์ทำงานได้อย่างถูกต้อง ในการตรวจสอบว่าส่วนขยายของเบราว์เซอร์ก่อให้เกิดปัญหาหรือไม่ ให้เปิดเบราว์เซอร์ของคุณในโหมดไม่ระบุตัวตน (Chrome) หรือโหมดส่วนตัว แล้วลองเข้าใช้งาน PBS ซึ่งจะเป็นการเปิดแท็บใหม่โดยไม่มีส่วนขยายใด ๆ หากใช้งานได้ แสดงว่ามีส่วนขยายที่เกิดข้อขัดแย้ง
พบว่าส่วนขยายเบราว์เซอร์ PageXray ก่อให้เกิดปัญหา
การลบสิ่งต่างๆ ใน Page Builder Sandwich โดยปกติแล้วสามารถทำได้ง่ายๆ เพียงแค่เลือกข้อความหรือองค์ประกอบ จากนั้นกดปุ่ม Delete หรือ Backspace
อีกทางเลือกหนึ่งคือการคลิกปุ่ม Delete / Remove บนแถบเครื่องมือตรวจสอบ (Inspector):
มีบางกรณีที่วิธีนี้ใช้ไม่ได้ผล รายการที่ใช้ไม่ได้มักจะเป็นคอนเทนเนอร์ เช่น แถว (rows), คอลัมน์ (columns) หรือภาพหมุน (carousels) ทั้งนี้เพื่อป้องกันการลบโดยไม่ได้ตั้งใจขณะกำลังลบเนื้อหา
หากต้องการลบรายการเหล่านั้น ให้คลิกที่ปุ่ม Delete / Remove ในคุณสมบัติขององค์ประกอบบนแถบเครื่องมือตรวจสอบ (Inspector) ตัวอย่างเช่น หากต้องการลบแถว คุณจะต้องใช้ส่วนนี้:
ขณะนี้ Page Builder Sandwich มีให้บริการในภาษา:
หากคุณต้องการช่วยมีส่วนร่วมในการพัฒนา Page Builder Sandwich โดยการแปลเป็นภาษาของคุณ โปรดไปที่ หน้า Transifex ของเรา!
การเพิ่มรูปภาพทำได้ง่ายมาก คุณสามารถทำอย่างใดอย่างหนึ่งดังนี้:
ก่อนหน้านี้เคยมีปัญหาเกี่ยวกับ NextGen และ Page Builder Sandwich
ก่อนเวอร์ชัน 2.12 PBS ได้ส่งผลให้ NextGen แสดงข้อความข้อผิดพลาดซึ่งทำให้เว็บไซต์ของคุณขึ้นหน้าจอสีขาวว่างเปล่า ปัญหานี้ได้รับการแก้ไขแล้วตั้งแต่เวอร์ชัน 2.12 ดังนั้นหากคุณกำลังใช้เวอร์ชันที่เก่ากว่า โปรดอัปเดต
เราได้ทำให้แน่ใจว่า Page Builder Sandwich แทบจะไม่มีผลกระทบต่อประสิทธิภาพของเว็บไซต์คุณเลย เมื่อออกจากระบบ อย่างน้อยที่สุดจะมีเพียงสไตล์ CSS ของแถวและคอลัมน์เท่านั้นที่ถูก enqueue ควบคู่ไปกับสคริปต์ JS และ CSS ที่จำเป็นสำหรับชอร์ตโค้ดที่คุณใช้งานที่จะถูก enqueue
โดยพื้นฐานแล้ว Markdown คือไวยากรณ์ที่คุณพิมพ์ขณะแก้ไขเพื่อเพิ่มหรือเปลี่ยนการจัดรูปแบบข้อความของคุณ สิ่งเหล่านี้เหมือนกับคีย์ลัด แต่แทนที่จะกดคีย์ผสม คุณจะใช้วิธีพิมพ์แทน
ด้านล่างนี้คือรายการไวยากรณ์ Markdown ทั้งหมดที่รองรับใน Page Builder Sandwich
## หัวข้อ 2
### หัวข้อ 3
ไปจนถึง:
###### หัวข้อ 6
> ข้อความอ้างอิง
(เว้นวรรค 4 ช่อง) ข้อความ/โค้ดที่จัดรูปแบบล่วงหน้า
* รายการสัญลักษณ์หัวข้อย่อย - รายการสัญลักษณ์หัวข้อย่อย
1. รายการลำดับเลข 1) รายการลำดับเลข
- ------------------------------(หรือขีดหลายตัว)
การพิมพ์ URL จะแปลงเป็นลิงก์โดยอัตโนมัติ:
ไปยัง https://pagebuildersandwich.com
ไปยัง [Page Builder Sandwich](https://pagebuildersandwich.com
ชอร์ตโค้ดสามารถวางหรือพิมพ์ลงไปโดยตรงได้ในขณะแก้ไข หลังจากที่คุณพิมพ์ชอร์ตโค้ดของคุณแล้ว ให้กด Enter หรือเลื่อนเคอร์เซอร์ออกจากชอร์ตโค้ด และชอร์ตโค้ดควรจะแสดงผลในรูปแบบที่เรนเดอร์ในทันที
อีกวิธีหนึ่งในการเพิ่มชอร์ตโค้ดคือคลิกที่ Shortcode Element บนตัวตรวจสอบ (Inspector) ของคุณ ซึ่งจะแสดงป็อปอัปที่ระบุชอร์ตโค้ดทั้งหมดที่มีอยู่ในไซต์ของคุณ เลือกอันใดอันหนึ่งหรือดับเบิลคลิกที่ชอร์ตโค้ดเพื่อแทรก
คุณสามารถแก้ไขชอร์ตโค้ดได้ 2 วิธี:
Page Builder Sandwich ไม่สามารถตรวจหาแอตทริบิวต์ของชอร์ตโค้ดได้ ดังนั้นคุณจึงต้องพิมพ์แอตทริบิวต์เหล่านั้นลงไป เรากำลังหาวิธีแมปชอร์ตโค้ดเข้าสู่ระบบเพื่อให้ทุกคนใช้งานได้ง่าย โปรดติดตามการอัปเดตนี้ต่อไป
คุณสามารถฝังเนื้อหาจากเว็บไซต์ต่าง ๆ เช่น วิดีโอ YouTube, วิดีโอ Vimeo, รูปภาพ Instagram, รูปภาพ Flickr, ทวีต และแม้แต่ความคิดเห็น Reddit ได้โดยตรงด้วยการวาง URL ลิงก์ถาวร
https://www.youtube.com/watch?v=dQw4w9WgXcQ
คุณสามารถดูรายการ URL ที่สามารถฝังได้จาก codex ของ WordPress: https://codex.wordpress.org/Embeds
คุณยังสามารถติดตั้งปลั๊กอินอื่น ๆ ที่เพิ่มการรองรับ URL การฝังเพิ่มเติมได้ด้วย ตัวอย่างเช่น WordPress ไม่รองรับ URL ของ Wistia มาแต่แรก คุณสามารถติดตั้งปลั๊กอินของพวกเขาเพื่อเปิดใช้งานการฝังได้ หลังจากนั้น PB Sandwich ก็จะสามารถจัดการกับ URL เหล่านั้นได้เช่นกัน
โปรดทราบว่าข้อความทั้งบรรทัดจะต้องมีเฉพาะ URL เท่านั้นเพื่อให้สามารถทำงานได้
คุณยังสามารถวางโค้ดฝังได้โดยตรงเช่นกัน
โค้ดฝังจะมีลักษณะดังนี้:
<iframe width="420" height="315" src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allowfullscreen></iframe>
โปรดทราบว่าข้อความทั้งบรรทัดจะต้องมีเฉพาะโค้ดฝังเท่านั้นเพื่อให้สามารถทำงานได้
คลิกที่เครื่องมือ “เพิ่มสื่อ” จากนั้นวาง URL ของคุณในแท็บ “แทรกจาก URL”
คุณสามารถแก้ไขได้เฉพาะเนื้อหาของ หน้า, เรื่อง และประเภทโพสต์ที่กำหนดเอง (custom post types) โดยใช้ Page Builder Sandwich
อย่างไรก็ตาม คุณไม่สามารถแก้ไขไฟล์เทมเพลตของธีมได้ เช่น:
ลองพิจารณาด้วยวิธีนี้ หากมีข้อความ “แก้ไขเรื่อง” หรือ “แก้ไขหน้า” บนแถบผู้ดูแลระบบของคุณที่ส่วนหน้าของเว็บไซต์ หน้านั้นก็น่าจะสามารถแก้ไขได้
คุณสามารถฝังเนื้อหาจากเว็บไซต์ต่าง ๆ เช่น วิดีโอ YouTube, วิดีโอ Vimeo, ทวีต และแม้กระทั่งความคิดเห็น Reddit ได้โดยการวาง URL ลิงก์ถาวรลงใน Page Builder Sandwich
โปรดทราบว่าข้อความหนึ่งบรรทัดเต็มควรมีเฉพาะ URL เท่านั้น
Page Builder Sandwich ทำงานร่วมกับฟีเจอร์ oEmbed ของ WordPress ดังนั้น URL ที่คุณสามารถฝังในส่วนหลังบ้านได้จึงควรได้รับการรองรับ ปลั๊กอินที่เพิ่มการรองรับผู้ให้บริการ oEmbed เพิ่มเติมก็ควรใช้งานได้เช่นกัน
คุณสามารถดูรายชื่อผู้ให้บริการ oEmbed ได้จาก codex: https://codex.wordpress.org/Embeds
ในเวอร์ชัน พรีเมียม ของ Page Builder Sandwich คุณสามารถใช้ไอคอน SVG / เวกเตอร์ ของคุณเองได้ โดยมีวิธีการดังนี้:
ไอคอนที่อัปโหลดแล้วยังสามารถใช้เป็นไอคอนสัญลักษณ์แสดงหัวข้อย่อยในรายการสัญลักษณ์แสดงหัวข้อย่อยและไอคอนบนปุ่มได้อีกด้วย
หมายเหตุ: หากไอคอนของคุณไม่ปรากฏในการค้นหา อาจเป็นเพราะ PBS ไม่สามารถแยกวิเคราะห์ชื่อไฟล์ได้อย่างถูกต้อง ในกรณีดังกล่าว คุณสามารถใช้คำว่า “custom” หรือ “upload” เพื่อค้นหาไอคอนที่คุณอัปโหลดไว้ได้
Page Builder Sandwich ถูกสร้างขึ้นมาให้รบกวนระบบอื่นน้อยที่สุดเท่าที่จะเป็นไปได้ เพื่อให้ปลั๊กอินอื่น ๆ สามารถทำงานร่วมกับปลั๊กอินของเราได้โดยไม่มีปัญหา
อย่างไรก็ตาม ในบางครั้งก็อาจมีข้อยกเว้น ด้านล่างนี้คือรายชื่อปลั๊กอินที่มีอาการแปลก ๆ บางประการเมื่อทำงานร่วมกับ Page Builder Sandwich ซึ่งไม่ได้หมายความว่าจะใช้งานไม่ได้หรือไม่สามารถทำงานร่วมกันได้เลย แต่หมายถึงพฤติกรรมบางอย่างอาจแตกต่างออกไปเท่านั้น
เราจะอัปเดตรายการนี้อย่างต่อเนื่อง หากคุณพบปัญหาใด ๆ สามารถส่งทิกเก็ตขอความช่วยเหลือได้ที่ [email protected]
ตรวจสอบว่า PBS เปิดใช้งานอยู่และอยู่ในโหมดแก้ไขหรือไม่
if ( PBSEditor.isEditing() ) {
// ทำงานบางอย่างเมื่อกำลังแก้ไข
}
ไม่มี.
Boolean. True เมื่อกำลังแก้ไขอยู่, false เมื่อไม่ได้แก้ไข
ใช้ภายใน iframe ที่ PBS ใช้เพื่อแสดงผลมุมมองแบบตอบสนอง (responsive) ในระหว่างการแก้ไข สิ่งนี้จะถูกเรียกก่อนที่แท็ก <head> จะปิด และสามารถใช้เพื่อเพิ่มสคริปต์และสไตล์ได้
ไม่มี
add_action( 'pbs_iframe_header', 'change_bg_color' );
function change_bg_color() {
?>
<style>
body {
background-color: hotpink;
}
</style>
<?php
}
หากคุณกำลังประสบปัญหา เราพร้อมช่วยเหลือคุณ! แต่ก่อนอื่นโปรดตรวจสอบหน้าเอกสารประกอบการใช้งาน คุณอาจพบคำตอบที่นี่และช่วยประหยัดเวลาได้
ส่งอีเมลสอบถามเกี่ยวกับการสนับสนุนถึงเราได้ที่ [email protected]
คุณสามารถป้องกันไม่ให้ PB Sandwich แสดงขึ้นมาที่ส่วนหน้าของเว็บไซต์ (front-end) ได้โดยใช้ตัวกรอง pbs_is_editable_by_user
ตัวอย่างเช่น หากต้องการหยุดไม่ให้ PB Sandwich แสดงขึ้นมาใน Custom Post Type ที่ระบุด้วย slug slider คุณสามารถเพิ่มโค้ดส่วนนี้ลงใน functions.php ของคุณได้
add_filter( 'pbs_is_editable_by_user', 'stop_pbs_in_sliders' );
function stop_pbs_in_sliders( $editable ) {
if ( is_singular( 'slider' ) ) {
return false;
}
return $editable;
}
หากต้องการหยุด PB Sandwich สำหรับหน้า/โพสต์ที่ต้องการโดยเฉพาะ คุณสามารถใช้ post ID เพื่อตรวจสอบได้:
add_filter( 'pbs_is_editable_by_user', 'stop_pbs_for_123' );
function stop_pbs_for_123( $editable ) {
global $post;
if ( is_singular() && ! empty( $post ) ) {
if ( '123' === $post->ID ) {
return false;
}
}
return $editable;
}
PBS จะส่งสถิติการใช้งานสำหรับผู้ใช้ที่เลือกเข้าร่วมในทุกครั้งที่มีการบันทึกในตัวแก้ไขของ PBS ตัวกรองนี้สามารถใช้เพื่อหยุดการส่งข้อมูลได้
$true
Boolean ค่านี้จะเป็นจริงเสมอ
หากคุณกำลังประสบปัญหา เราพร้อมให้ความช่วยเหลือ! แต่ก่อนอื่นโปรดตรวจสอบหน้าเอกสารประกอบการใช้งานก่อน คุณอาจพบคำตอบได้ที่นี่และช่วยประหยัดเวลาของคุณ
ส่งอีเมลสอบถามข้อมูลการสนับสนุนถึงเราได้ที่ [email protected]
$all_shortcodes = PageBuilderSandwich::get_all_shortcodes()
ไม่มี.
Array อาร์เรย์ของแท็ก shortcode ทั้งหมดที่ตรวจพบ
PBS >= 4.3
PBS เพิ่ม wrapper เพื่อระบุพื้นที่เนื้อหาของโพสต์ ส่วนนี้จะถูกเรียกก่อนที่จะวาง wrapper
$content
String. เนื้อหาของโพสต์ที่ใส่ wrapper เรียบร้อยแล้ว
ใช้ภายใน iframe ที่ PBS ใช้เพื่อเรนเดอร์มุมมอง responsive ระหว่างการแก้ไข ฟังก์ชันนี้จะถูกเรียกทันทีก่อนปิดแท็ก <body> และสามารถใช้เพื่อเพิ่มสคริปต์และสไตล์ได้
ไม่มี
PBS >= 4.3
แทนที่การตัดสินใจว่าจะโหลด PBS ที่ส่วนหน้าของเว็บไซต์ (front-end) หรือไม่ และอนุญาตให้ผู้ใช้ใช้ PBS เพื่อแก้ไขโพสต์ได้หรือไม่
$is_editable
Boolean. มีค่าเป็น True หากควรอนุญาตให้แก้ไขโพสต์ด้วย PBS ได้ มิฉะนั้นจะเป็น False
ไม่อนุญาตให้ post_types ประเภท portfolio สามารถแก้ไขได้ด้วย PBS
add_filter( 'pbs_is_editable_by_user', 'disallow_portfolios' );
function disallow_portfolios( $is_editable ) {
global $post;
if ( $post ) {
if ( 'portfolio' === get_post_type( $post ) ) {
return false;
}
}
return $is_editable;
}
PBS >= 4.3
รับอินสแตนซ์ของ PageBuilderSandwich
$pbs = PageBuilderSandwich::instance()
ไม่มี.
ออบเจกต์ PageBuilderSandwich. อินสแตนซ์ปัจจุบันของคลาส PBS
PBS เพิ่ม wrapper เพื่อระบุพื้นที่เนื้อหาของโพสต์ สิ่งนี้จะถูกเรียกหลังจากที่มีการวาง wrapper แล้ว
$content
String. เนื้อหาของโพสต์ที่มีการใช้ wrapper แล้ว
PageBuilderSandwich::is_editable_by_user()
ไม่มี.
Boolean. True หาก PBS สามารถแก้ไขโพสต์ได้, false ในกรณีอื่น ๆ
ฟิลเตอร์สำหรับแก้ไขสไตล์ CSS ที่กำลังถูกบันทึกสำหรับโพสต์ ซึ่งจะถูกเรียกใช้เมื่อมีการเริ่มบันทึกจากตัวแก้ไข PBS
$style
String. สไตล์ CSS ที่ส่งมาเพื่อบันทึก
$post_id
Int. ID ของโพสต์ที่เรากำลังบันทึก
ถูกเรียกใช้เมื่อตัวแก้ไข PBS โหลดเสร็จสิ้น (จะไม่ถูกเรียกใช้เมื่อผู้ใช้คลิกปุ่มเริ่มแก้ไข)
ทำบางสิ่งหลังจาก PBS โหลดเสร็จ
wp.hooks.addAction( 'pbs.init', function() {
console.log( 'PBS is ready!' );
}
รายการแท็กชอร์ตโค้ดที่จะซ่อนในตัวเลือกชอร์ตโค้ดของ PBS ใช้ตัวเลือกนี้หากคุณมีชอร์ตโค้ดที่แสดงในป็อปอัปตัวเลือก ซึ่งคุณได้เลิกใช้งานไปแล้วหรือเพียงแค่ต้องการซ่อนไม่ให้ผู้ใช้เห็น
$shortcodes
Array. อาร์เรย์ของแท็กชอร์ตโค้ด
ซ่อนชอร์ตโค้ด จากตัวเลือก
add_filter( 'pbs_shortcodes_to_hide_in_picker, 'hide_embed_shortcode' );
function hide_embed_shortcode( $shortcodes ) {
$shortcodes[] = 'embed';
return $shortcodes;
}
เพิ่มคุณสมบัติ Javascript ให้กับออบเจกต์ pbsFrontendParams ในส่วนหน้าบ้าน (front-end) โดยออบเจกต์ pbsFrontendParams จะพร้อมใช้งานในส่วนหน้าบ้านเสมอไม่ว่าผู้ใช้จะเข้าสู่ระบบและกำลังแก้ไขอยู่หรือไม่ก็ตาม
$params
Array. อาร์เรย์ของคีย์และค่าที่จะพร้อมใช้งานในตัวแปร Javascript ระดับ window ที่ชื่อว่า pbsFrontendParams
ทำให้ตัวแปรสามารถเข้าถึงได้ในส่วนหน้าบ้าน
add_filter( 'pbs_localize_frontend_scripts, 'add_my_property' );
function add_my_property( $params ) {
// สิ่งนี้จะพร้อมใช้งานใน Javascript ภายใต้ pbsFrontendParams.myProperty
$params['myProperty'] = 'My Property';
return $params;
}
ส่วนใหญ่ของ Page Builder Sandwich นั้นเป็น Javascript และเราได้เพิ่มเมธอดต่างๆ มากมายเพื่อให้นักพัฒนาสามารถขยายขีดความสามารถและเพิ่มฟังก์ชันการทำงานให้กับตัวสร้างหน้าเว็บของเราได้
เพื่อให้นักพัฒนาทำงานได้ง่ายยิ่งขึ้น เราจึงจัดรูปแบบตามวิธีการทำงานของ WordPress นั่นคือผ่านฮุก!
ใน WordPress โดยทั่วไปคุณจะใช้ฟังก์ชัน add_filter() และ add_action() เพื่อปรับเปลี่ยนหรือเพิ่มพฤติกรรมการทำงานของ WP ในทำนองเดียวกันใน PBS คุณสามารถใช้ wp.hooks.addFilter() และ wp.hooks.addAction() ได้
วิธีที่คุณใช้งานก็เหมือนกันเช่นกัน กล่าวคือ ใช้ filters เพื่อปรับเปลี่ยนสิ่งต่างๆ และใช้ actions เพื่อดำเนินการสิ่งต่างๆ เพิ่มเติม การเรียกฟังก์ชันทั้งสองนี้โดยพื้นฐานแล้วเหมือนกับฟังก์ชันที่เทียบเท่าใน PHP เพียงแต่ทำงานใน Javascript
เพื่อไม่ให้เกิดความสับสนระหว่างฮุก PHP กับฮุก Javascript เราจึงได้ตั้งชื่อฮุก Javascript ด้วยรูปแบบ “period-case” (คำที่คิดขึ้นมาเอง) โดยฮุก PHP ทั้งหมดจะใช้รูปแบบ snake case:
โปรดดูที่หมวดหมู่ Javascript Actions และ Javascript Filters ในเมนูด้านซ้ายเพื่อเรียกดูฮุกทั้งหมด
สำหรับผู้ที่สงสัย เราใช้ https://github.com/carldanley/WP-JS-Hooks ในการเพิ่มการเรียกฮุกอันชาญฉลาดเหล่านี้ใน Javascript
ถูกเรียกก่อนที่เอดิเตอร์จะบันทึกเนื้อหา คุณสามารถใช้สิ่งนี้เพื่อใส่ข้อมูลเพิ่มเติมที่จะส่งในระหว่างการบันทึก (การดำเนินการนี้ไม่ได้บันทึกข้อมูล เพียงแค่ส่งข้อมูลผ่าน Ajax ไปยังแบ็กเอนด์เท่านั้น)
payload
ออบเจ็กต์ FormData ข้อมูลที่ส่งผ่าน Ajax สำหรับการบันทึก
wp.hooks.addAction( 'pbs.save.payload', function( payload ) {
// เพิ่มข้อมูลที่จะส่งในระหว่างการบันทึก
payload.append( 'my_data', 'My Data' );
}
จัดคิว (Enqueue) สคริปต์หรือสไตล์ควบคู่ไปกับ PBS สิ่งนี้จะถูกเรียกใช้เฉพาะเมื่อโพสต์สามารถแก้ไขด้วย PBS ได้เท่านั้น เมื่อหน้าดังกล่าวไม่สามารถแก้ไขด้วย PBS ได้ สิ่งนี้จะไม่ถูกนำมาใช้งานเลย
ไม่มี
เมื่อ PBS โหลด ให้นำ my-script.js เข้าคิวด้วยเช่นกัน
add_action( 'pbs_enqueue_scripts, 'add_my_script' );
function add_my_script() {
wp_enqueue_script( 'my-script' , plugins_url( 'js/my-script.js', __FILE__ ) );
}
เพิ่มคุณสมบัติ Javascript ให้กับออบเจกต์ pbsParams ในส่วนหน้าบ้าน (front-end) ออบเจกต์ pbsParams จะพร้อมใช้งานในส่วนหน้าบ้านเมื่อผู้ใช้เข้าสู่ระบบและมีสิทธิ์ในการแก้ไขหน้าเว็บ
ตัวแปรนี้ยังเก็บคุณสมบัติจำนวนมากที่ PBS ใช้ในระหว่างการแก้ไข เช่น nonce รายการชอร์ตโค้ดที่โหลดไว้ทั้งหมด และข้อความแปลภาษา
$params
Array อาร์เรย์ของคีย์และค่าที่จะพร้อมใช้งานในตัวแปร Javascript ระดับ window pbsParams
เพิ่มชอร์ตโค้ดที่ตรวจไม่พบเข้าไปในเอดิเตอร์
add_filter( 'pbs_frontend_scripts, 'add_my_shortcode' );
function add_my_shortcode( $params ) {
$params['shortcodes'][] = 'my_shortcode';
return $params;
}
หากคุณหาไฟล์ปลั๊กอินพรีเมียมที่บันทึกไว้ไม่พบ คุณสามารถไปที่นี่และกรอกที่อยู่อีเมลของคุณเพื่อกู้คืนได้ ปลั๊กอินจะถูกส่งไปยังอีเมลของคุณ
https://dashboard.freemius.com/license-recovery/203/page-builder-sandwich/
นี่คือฟีเจอร์พรีเมียมและมีให้บริการในเวอร์ชัน 4.0.1 ขึ้นไป
ลิงก์สมอสำหรับการเลื่อนหน้าเดียวกันคือลิงก์ที่ชี้ไปยังตำแหน่งเฉพาะในหน้าเดียวกัน เมื่อคุณคลิกลิงก์หน้าเดียวกัน เบราว์เซอร์ของคุณจะเลื่อนไปยังตำแหน่งที่ระบุ
คุณต้องมีสองสิ่งนี้เพื่อสร้างลิงก์สมอหน้าเดียวกัน:
เลือกองค์ประกอบใดก็ได้ใกล้กับด้านล่างสุดของหน้าของคุณ แล้วเปิดคุณสมบัติขององค์ประกอบนั้น ในส่วนขั้นสูง ให้เพิ่มคลาสที่กำหนดเองหรือ ID ที่กำหนดเองชื่อ ” go_here“
ตอนนี้ให้สร้างลิงก์หรือเพิ่มองค์ประกอบปุ่มไว้ที่บริเวณใกล้ด้านบนของหน้าของคุณ แทนที่จะเพิ่ม URL เป็นลิงก์ ให้ใช้ ” .go_here” (มีจุด) หากคุณเพิ่ม “go_here” เป็นคลาสที่กำหนดเอง หรือใช้ “#go_here” (มีเครื่องหมายแฮช) หากคุณเพิ่มเป็น ID ที่กำหนดเอง
หลังจากที่คุณบันทึกหน้าของคุณแล้ว เมื่อคุณคลิกที่ลิงก์/ปุ่ม หน้านั้นควรเลื่อนอย่างราบรื่นไปยังองค์ประกอบที่อยู่ด้านล่างสุดของหน้าคุณ
สมอที่ตั้งชื่อไว้ เช่น
<a name="go_here"></a>
ก็สามารถกำหนดเป้าหมายได้โดยการเพิ่มลิงก์ไปยัง “#go_here” (มีเครื่องหมายแฮช)
คุณยังสามารถกำหนดเป้าหมายไปยังส่วนอื่นๆ ในหน้าของคุณได้ แม้ว่าจะอยู่นอกพื้นที่ตัวแก้ไขก็ตาม ตราบใดที่คุณกำหนดเป้าหมายโดยใช้ชื่อคลาสหรือ ID ของส่วนเหล่านั้น
ถูกเรียกหลังจากบันทึกเนื้อหาแล้ว ฟังก์ชันนี้จะถูกเรียกเมื่อมีการเริ่มบันทึกจากตัวแก้ไข PBS
ไม่มี
ฟิลเตอร์สำหรับแก้ไขข้อมูลโพสต์ที่จะบันทึก สิ่งนี้จะถูกเรียกใช้เมื่อมีการเริ่มบันทึกจากตัวแก้ไข PBS
$post_data
Array. ข้อมูลโพสต์ขั้นสุดท้ายที่จะบันทึก ซึ่งจะถูกส่งต่อไปยัง wp_update_post() โดยตรงหลังจากนั้น
$_POST
Array. ข้อมูลโพสต์ดิบที่ส่งมาจากตัวแก้ไขเพื่อบันทึก ซึ่งได้รับการตรวจสอบ nonce เรียบร้อยแล้ว
$post_id
Int. ID ของโพสต์ที่เรากำลังบันทึก
add_filter( 'pbs_save_content_data', 'save_always_as_draft', 10, 3 );
function save_always_as_draft( $post_data, $_post, $post_id ) {
// ด้วยเหตุผลบางประการ เราต้องการให้โพสต์เป็นฉบับร่างเสมอ
$post_data['post_status'] = 'draft';
return $post_data;
}
ตั้งแต่เวอร์ชัน 4.0 เป็นต้นไป คุณสามารถสลับมุมมองระหว่างเดสก์ท็อป แท็บเล็ต และโทรศัพท์มือถือขณะแก้ไขได้แล้ว! เราเรียกสิ่งนี้ว่าโหมด responsive ในโหมด responsive เว็บไซต์ของคุณจะปรับขนาดให้เล็กลงเพื่อจำลองลักษณะที่เว็บไซต์ของคุณจะปรากฏบนหน้าจอขนาดเล็ก
ขณะดูเว็บไซต์ของคุณในมุมมอง แท็บเล็ต หรือ โทรศัพท์มือถือ คุณจะมีความสามารถในการแก้ไขที่จำกัด ด้วยเหตุนี้ คุณจึงสามารถทำได้ เฉพาะ สิ่งต่อไปนี้เท่านั้น:
* PBS มีการปรับใช้การกำหนดสไตล์ responsive บางอย่างกับองค์ประกอบและแถวของคุณ ดังนั้นระยะขอบบางส่วนจึงไม่สามารถปรับแต่งได้
นี่คือสิ่งที่คุณ ไม่สามารถ ทำได้:
หากคุณกำลังดูเว็บไซต์ของคุณในมุมมอง แท็บเล็ต หรือ โทรศัพท์มือถือ การปรับ ระยะขอบ (margin) ใดๆ ที่คุณทำจะมีผลเฉพาะกับมุมมองปัจจุบันและมุมมองที่เล็กกว่าเท่านั้น สิ่งนี้ช่วยให้คุณปรับแต่งดีไซน์ให้ดูดีขึ้นบนหน้าจอขนาดเล็ก โดยแยกเป็นอิสระจากเวอร์ชันเดสก์ท็อปแบบเต็ม
นี่คือตัวอย่างเพื่อให้เข้าใจได้ชัดเจนยิ่งขึ้น
สิ่งนี้ใช้ได้กับการปรับระยะขอบเท่านั้น การเปลี่ยนแปลงข้อความหรือลักษณะข้อความจะมีผลกับทุกขนาดหน้าจอ
เมื่อดูในมุมมองแท็บเล็ตหรือโทรศัพท์มือถือ แถว ของคุณจะมีปุ่มบนแถบเครื่องมือรูป “ดวงตา” ปรากฏขึ้นใหม่เมื่อคุณเลื่อนเมาส์ไปวางเหนือแถวเหล่านั้น การคลิกปุ่มนี้จะช่วยให้คุณสามารถแสดง/ซ่อนแถวดังกล่าวสำหรับขนาดหน้าจอปัจจุบันได้
แถวที่ซ่อนอยู่จะกลายเป็นแบบโปร่งแสงเล็กน้อยขณะแก้ไข เพื่อระบุว่าแถวเหล่านั้นจะถูกซ่อนไว้เมื่อคุณแก้ไขเสร็จสิ้น
โปรดทราบว่าฟีเจอร์นี้ใช้งานได้สำหรับแถวเท่านั้น
หากคุณเป็นนักพัฒนาธีม การรวม PBS ไว้ในธีมของคุณสามารถช่วยเพิ่มมูลค่าให้กับผลิตภัณฑ์ของคุณได้อย่างมาก
ติดต่อเราได้ที่ [email protected] มาร่วมงานกันเถอะ!
CloudFlare เป็น DNS CDN ฟรีที่นิยมใช้งานกันอย่างแพร่หลาย แม้จะยอดเยี่ยมมาก แต่ปัจจุบัน PBS ประสบปัญหาเกี่ยวกับฟีเจอร์ Rocket Loader Rocket Loader ช่วยปรับปรุงเวลาในการโหลดไฟล์ Javascript แต่จะส่งผลกระทบต่อลำดับการเรียกใช้งานและการพึ่งพา (dependency) ของสคริปต์ต่างๆ ใน PBS หากคุณเปิดใช้งาน Rocket Loader ไว้ ปุ่มแก้ไขสำหรับ Page Builder Sandwich จะไม่แสดงขึ้นมา (และไม่มีข้อผิดพลาดของคอนโซล Javascript แสดงขึ้นมาด้วย)
หากต้องการปิด Rocket Loader ให้เข้าสู่ระบบบัญชี CloudFlare ของคุณ แล้วไปที่การตั้งค่าสำหรับโดเมนของคุณ นำทางไปยังการตั้งค่า Speed:
จากนั้นเลื่อนลงไปที่การตั้งค่า Rocket Loader แล้วตรวจสอบให้แน่ใจว่าได้ปรับการตั้งค่าเป็น off (ปิด) แล้ว:
หลังจากปิดส่วนนี้แล้ว อย่าลืมล้างแคชของทั้งเว็บไซต์ (purge your entire site’s cache) จากการตั้งค่า Cache:
หลังจากล้างทุกอย่างในแคชของคุณแล้ว คุณสามารถรีเฟรชหน้าเว็บ และปุ่มแก้ไขของ Page Builder Sandwich ควรจะแสดงขึ้นมาแล้ว
ถูกเรียกใช้ก่อนที่เนื้อหาจะถูกบันทึกทันที สิ่งนี้จะถูกเรียกใช้เมื่อมีการเริ่มบันทึกจากตัวแก้ไข PBS
ไม่มี
ฟิลเตอร์สำหรับปรับแต่งเนื้อหาโพสต์ที่จะบันทึก สิ่งนี้จะถูกเรียกใช้เมื่อมีการเริ่มบันทึกจากตัวแก้ไข PBS
$content
String. เนื้อหาโพสต์ขั้นสุดท้ายที่จะบันทึก
$post_id
Int. ID ของโพสต์ที่เรากำลังบันทึก
โดยพื้นฐานแล้ว Markdown คือไวยากรณ์ที่คุณพิมพ์ลงไปขณะแก้ไขเพื่อเพิ่มหรือเปลี่ยนการจัดรูปแบบข้อความของคุณ ซึ่งจะคล้ายกับคีย์ลัด แต่แทนที่จะกดคีย์ผสม คุณใช้วิธีพิมพ์ลงไปแทน
ด้านล่างนี้คือรายการไวยากรณ์ Markdown ทั้งหมดที่รองรับใน Page Builder Sandwich
(โปรดระวังการเว้นวรรค)
# หัวข้อ 1
## หัวข้อ 2
ไปจนถึง:
###### หัวข้อ 6
> ข้อความอ้างอิง
(เว้นวรรค 4 ช่อง) ข้อความที่จัดรูปแบบล่วงหน้า/โค้ด
* รายการสัญลักษณ์หัวข้อย่อย - รายการสัญลักษณ์หัวข้อย่อย
1. รายการลำดับเลข 1) รายการลำดับเลข
- ------------------------------(หรือเครื่องหมายขีดหลายตัว)
การพิมพ์ URL จะแปลงเป็นลิงก์โดยอัตโนมัติ:
ไปที่ https://pagebuildersandwich.com
พิมพ์ “lorem” แล้วกดแท็บเพื่อสร้างเนื้อหาข้อความจำลอง
ในระหว่างที่ใช้งาน Varnish Cache หากคุณบันทึกการเปลี่ยนแปลงแล้วยังคงเห็นเนื้อหาเดิมของคุณอยู่ เป็นไปได้ว่า Varnish Cache อาจไม่ได้ถูกล้างโดยอัตโนมัติ
มีปลั๊กอิน WordPress บางตัวที่ช่วยให้คุณล้างแคชได้: https://wordpress.org/plugins/search/varnish+cache/
หากวิธีดังกล่าวไม่ได้ผล คุณยังสามารถล้างข้อมูล (purge) Varnish Cache ได้ด้วยตนเองโดยการรันคำสั่งนี้ในเทอร์มินัล:
curl -X PURGE http://mysite.com/my-page/
ในการปิดใช้งาน PBS ให้เข้าสู่ระบบแดชบอร์ด / ระบบหลังบ้านของคุณก่อน จากนั้นไปที่ ปลั๊กอิน > ปลั๊กอินที่ติดตั้งแล้ว:
เมื่ออยู่ในหน้าปลั๊กอิน ให้เลื่อนลงไปตามรายการปลั๊กอินของคุณแล้วค้นหา Page Builder Sandwich ตรงด้านล่างของชื่อ คุณจะเห็นลิงก์ ปิดการใช้งาน พร้อมกับลิงก์อื่นๆ เช่น แก้ไข หรือเปลี่ยนใบอนุญาต (สิ่งนี้อาจแตกต่างกันไปในแต่ละไซต์ของคุณ) คลิกที่ลิงก์ปิดการใช้งานเพื่อปิดใช้งานปลั๊กอิน
หากคุณได้บันทึกการเปลี่ยนแปลงในหน้าของคุณแล้วและ…
นี่อาจหมายความว่าการบันทึกไม่ได้สั่งให้ระบบแคชของคุณล้างข้อมูลที่จัดเก็บไว้ออกไป
หากคุณกำลังใช้งานระบบแคชบางประเภท เช่น ปลั๊กอินแคชอย่าง W3 Total Cache, ซอฟต์แวร์แคชระดับเซิร์ฟเวอร์ เช่น Memcached หรือ Redis หรือการแคช DNS เช่น CloudFlare ระบบอาจจะยังไม่ได้ล้างเนื้อหาที่คุณบันทึกไว้
วิธีหนึ่งในการตรวจสอบว่าเป็นกรณีนี้หรือไม่ คือการแก้ไขหน้าเว็บของคุณในส่วนหลังบ้าน (backend) ตามปกติ จากนั้นเปิดดูหน้าเว็บของคุณในส่วนหน้าบ้าน (frontend) หากเนื้อหาของคุณไม่เปลี่ยนแปลง ก็อาจเป็นเพราะแคชของคุณไม่ได้ล้างโดยอัตโนมัติ
ระบบแคชที่ไม่ใช่ของ WordPress บางตัวจะมีปลั๊กอิน WordPress เสริมที่สามารถช่วยในการ purge หรือล้างแคชปัจจุบันได้ ส่วนระบบของ WordPress โดยทั่วไปจะมีปุ่มหรือตัวเลือกสำหรับการทำเช่นนี้
นอกจากนี้ยังมีความเป็นไปได้ว่าอาจเกิดข้อผิดพลาดของ PHP ระหว่างการบันทึก
ในการตรวจสอบว่าเกิดกรณีนี้ขึ้นหรือไม่ ให้เปิดคอนโซลของนักพัฒนา (developer console) ของคุณ (แนะนำให้ใช้ Chrome) จากนั้นไปที่แท็บ Network เมื่ออยู่ที่นั่นแล้ว ให้บันทึกการเปลี่ยนแปลงของคุณใน PBS แล้วคุณควรจะเห็นรายการต่างๆ ที่ส่งไปยัง admin-ajax.php หลายรายการ หากคุณเห็นรายการนี้เป็นสีแดง แสดงว่ามีข้อผิดพลาดเกิดขึ้น ให้ตรวจสอบดูว่าคุณเห็นสิ่งที่มีลักษณะคล้ายกับภาพนี้หรือไม่:
หากเป็นกรณีนี้ โปรดส่งอีเมลถึงเราที่ [email protected] พร้อมกับข้อมูลการเข้าสู่ระบบที่จำเป็น เพื่อให้เราสามารถตรวจสอบและแก้ไขให้คุณได้
โปรดอ่านบทความเกี่ยวกับความเข้ากันได้ของ Wordfence ได้ที่นี่: http://docs.pagebuildersandwich.com/article/214-wordfence-firewall-setup-compatibility
หมายเหตุ: ส่วนนี้ไม่มีผลกับลูกค้า Envato
หากคุณพบข้อผิดพลาดเมื่อเปิดใช้งานใบอนุญาตของคุณ นี่คือสิ่งที่คุณสามารถลองทำดูได้..
ปัญหานี้มักเกิดขึ้นกับผู้ที่อัปเดตเป็นเวอร์ชันที่สูงกว่า หากคุณอัปเดตไฟล์ของปลั๊กอินด้วยตนเองโดยตรงและข้ามขั้นตอนการอัปเดตทั้งหมดหรือขั้นตอนการปิดใช้งานแล้วเปิดใช้งานใหม่อีกครั้ง กระบวนการบางอย่างอาจทำงานได้ไม่สมบูรณ์ โปรดปิดใช้งานปลั๊กอิน จากนั้นเปิดใช้งานใหม่อีกครั้งแล้วลองป้อนใบอนุญาตของคุณใหม่
ตั้งแต่เวอร์ชัน 3.2 เป็นต้นมา Page Builder Sandwich ได้รวมเข้ากับ Freemius มีบางกรณีที่การล้างข้อมูล Freemius ช่วยแก้ไขข้อผิดพลาดในการเปิดใช้งานใบอนุญาตได้ นี่คือวิธีการแก้ไข
ไปที่แดชบอร์ดของคุณ และเปลี่ยน URL ของคุณเป็น http://yoursite.com/wp-admin/admin.php?page=freemius (อย่าลืมเปลี่ยน URL ให้ตรงกับเว็บไซต์ของคุณ) หากคุณมาถึงหน้านี้ตามภาพด้านล่าง แสดงว่าคุณมาถูกที่แล้ว
คลิกที่ปุ่ม Delete All Accounts จากนั้นคลิกที่ปุ่ม Clear API Cache ด้วย หลังจากทำขั้นตอนนี้แล้ว ให้ลองป้อนรหัสใบอนุญาตของคุณใหม่อีกครั้ง
หากยังคงไม่ได้ผล โปรดติดต่อเราที่ [email protected] และโปรดแจ้งรายละเอียดของปัญหาและเว็บไซต์ของคุณให้เราทราบ
ในองค์ประกอบส่วนใหญ่ (ยกเว้นชอร์ตโค้ด) คุณสามารถกำหนดแอนิเมชันเปิดตัวที่จะเล่นเมื่อองค์ประกอบนั้นปรากฏขึ้นบนหน้าจอของคุณ
ในการทำเช่นนี้ ให้วางเมาส์เหนือองค์ประกอบเพื่อให้แถบเครื่องมือปรากฏขึ้น จากนั้นคลิกที่ปุ่มรูปเฟือง
การดำเนินการนี้จะเปิดหน้าต่าง Inspector ขึ้นมา นำทางไปยังส่วน Animations เปิดส่วนดังกล่าวขึ้นมา แล้วเลือกแอนิเมชันที่ต้องการ
หลังจากเลือกแอนิเมชันแล้ว แอนิเมชันจะเล่นเพื่อแสดงตัวอย่างให้คุณเห็น คุณสามารถปรับแต่งแอนิเมชันเพิ่มเติมได้ด้วยตัวเลือกอื่นๆ ที่มีให้
แอนิเมชันจะเล่นก็ต่อเมื่อผู้ใช้เลื่อนหน้าจอและองค์ประกอบนั้นปรากฏขึ้นในมุมมอง หากองค์ประกอบนั้นปรากฏอยู่แล้วเมื่อคุณเข้ามาที่หน้าเว็บ องค์ประกอบนั้นจะไม่แสดงแอนิเมชัน
ไม่ คุณจะไม่สูญเสีย! หน้าเว็บและเนื้อหาทั้งหมดของคุณจะยังคงอยู่ในไซต์ของคุณ ซึ่งหมายความว่าคุณสามารถปิดการใช้งาน PBS ได้อย่างปลอดภัยเมื่ออัปเกรดจากเวอร์ชันฟรีเป็นเวอร์ชันพรีเมียม หรือเมื่อคุณเพียงแค่ทดสอบระบบ
อย่างไรก็ตาม ทุกอย่างอาจจะดูไม่เหมือนเดิม คุณจะสังเกตเห็นว่าองค์ประกอบบางอย่างในหน้าเว็บของคุณจะเปลี่ยนไป เนื่องจาก PBS มีสไตล์และสคริปต์เพิ่มเติมที่จำเป็นสำหรับองค์ประกอบที่มีความซับซ้อนบางส่วน
นี่คือสิ่งที่จะยังคงอยู่เมื่อคุณปิดการใช้งาน PBS:
นี่คือสิ่งที่จะหายไปเมื่อคุณปิดการใช้งาน PBS:
ในที่นี้ ฉันได้เพิ่มแถวที่มีสีพื้นหลังและเพิ่มรูปภาพลงไปด้านใน ดังนี้:
หากต้องการทำให้รูปภาพ “โผล่” ขึ้นมาเหนือคอนเทนเนอร์ ให้วางเมาส์เหนือองค์ประกอบที่คุณต้องการย้าย จากนั้นเมื่อเส้นขอบแสดงขึ้นมา ให้เลื่อนเมาส์เลยขอบด้านบนออกไป ซึ่งจะแสดงค่าระยะขอบด้านบนปัจจุบัน:
คลิกและลากระยะขอบด้านบนขึ้นเพื่อลดระยะขอบของคุณ ทำให้เป็นค่าลบ:
ตอนนี้รูปภาพก็ “โผล่” ออกมานอกแถวแล้ว!
หากองค์ประกอบถูกตัดขาดเมื่อเลยออกไปนอกแถว ให้เปิดตัวตรวจสอบคุณสมบัติ (properties inspector) สำหรับแถวนั้น แล้วสลับปิดตัวเลือก overflow hidden ในตัวเลือก Advanced:
ในการเพิ่มข้อความจำลองอย่างรวดเร็ว ให้พิมพ์คำว่า “lorem” จากนั้นกด tab หรือ enter เพื่อเพิ่มข้อความตัวยึดตำแหน่ง lorem ipsum อย่างรวดเร็ว:
Lorem ipsum dolor sit amet, consectetur adipisicing elit. At dolor sed numquam? Sapiente autem adipisci, minus expedita enim, suscipit laboriosam deleniti possimus sequi pariatur explicabo numquam alias atque officia sit.
Page Builder Sandwich สามารถทำงานร่วมกับปลั๊กอินแคชทั้งหมดได้ อย่างไรก็ตาม คุณอาจพบปัญหาบางประการหากเปิดใช้งานฟังก์ชัน minify หรือ caching ของปลั๊กอินเหล่านั้น
เพียงตรวจสอบให้แน่ใจว่า minify ได้รับการปิดใช้งานสำหรับผู้ใช้ที่เข้าสู่ระบบ และระบบควรจะทำงานได้อย่างราบรื่น
เราแสดงเฉพาะการตั้งค่าของ W3 Total Cache ที่นี่ แต่ปลั๊กอินแคชและ minify อื่นๆ ก็น่าจะมีการตั้งค่าที่คล้ายคลึงกัน
ตรวจสอบให้แน่ใจว่าได้ทำเครื่องหมายที่ Don’t cache pages for logged in users ภายใต้ Performance > Page Cache
หากคุณกำลังใช้ minify โปรดตรวจสอบให้แน่ใจว่าได้ทำเครื่องหมายที่ Disable minify for logged in users ภายใต้ Performance > Minify
หากคุณกำลังพยายามลากแฮนเดิลของ Margin หรือ Padding ด้านบนและด้านล่าง แล้วค่า Margin/Padding ขององค์ประกอบไม่เปลี่ยนแปลง อาจมีสไตล์อื่นที่บังคับเขียนทับการเปลี่ยนแปลงสไตล์ใด ๆ อยู่ ปัญหานี้อาจเกิดขึ้นได้เช่นกันเมื่อคุณไม่สามารถเปลี่ยนพื้นหลัง ขอบ หรือเมื่อภาพโปร่งใสมีสีพื้นหลังขึ้นมาตลอดเวลา
หากต้องการค้นหาปัญหา ให้เปิดตัวตรวจสอบ (Inspector) ของเบราว์เซอร์ขึ้นมาและตรวจสอบองค์ประกอบนั้น จากนั้นไล่ดูสไตล์ขององค์ประกอบดังกล่าว หากคุณพบสิ่งที่มีลักษณะเช่นนี้:
คุณก็มั่นใจได้เลยว่า ธีมหรือปลั๊กอินของคุณกำลังขัดขวางไม่ให้สไตล์อื่น ๆ ถูกนำไปใช้กับองค์ประกอบ เลื่อนเมาส์ไปวางเหนือสไตล์ชีตเพื่อดูว่ามาจากธีมหรือปลั๊กอินใด
ในการแก้ไขปัญหานี้ ให้ลบส่วน “! important” ของสไตล์ออก แล้วคุณจะสามารถปรับใช้สไตล์ได้ตามปกติอีกครั้ง คุณอาจจำเป็นต้องติดต่อผู้พัฒนาธีมหรือปลั๊กอินเพื่อแก้ไขปัญหานี้
หากต้องการฝังเนื้อหาจากเว็บไซต์ภายนอก เพียงแค่วาง URL แล้วกด Enter ตัวอย่างเช่น คุณสามารถคัดลอกและวาง URL นี้จาก YouTube ได้:
https://www.youtube.com/watch?v=dQw4w9WgXcQ
นอกจากนี้ยังสามารถฝังด้วย Iframe ได้โดยการวางโค้ดสำหรับฝัง <iframe> ตัวอย่างเช่น คัดลอกและวางข้อความโค้ดสำหรับฝังนี้:
<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/dQw4w9WgXcQ?rel=0″ frameborder=”0″ allowfullscreen></iframe>
คุณสามารถฝัง URL จากเว็บไซต์ที่ระบุไว้ใน WordPress Codex: https://codex.wordpress.org/Embeds และเว็บไซต์ใดก็ตามที่เปิดใช้งาน oEmbed
Page Builder Sandwich จะตรวจสอบอย่างสม่ำเสมอว่าคุณยังคงเข้าสู่ระบบใน WordPress อยู่หรือไม่ ทั้งนี้เพื่อให้มั่นใจว่าการเปลี่ยนแปลงของคุณจะถูกบันทึกจริงเมื่อคุณคลิกปุ่มบันทึก นอกจากนี้ยังใช้สำหรับการล็อกโพสต์และการบันทึกอัตโนมัติอีกด้วย
เราอาศัย WordPress Heartbeat API ในการตรวจสอบของเรา และในทางกลับกัน ระบบนี้ก็อาศัยคุกกี้และเซสชันของเบราว์เซอร์ ดังนั้นหากคุณยังคงได้รับป็อปอัป “เซสชันหมดอายุ” เหล่านั้นขณะแก้ไข อาจมีบางอย่างขัดขวางไม่ให้ WordPress ติดตามสถานะของคุณได้อย่างถูกต้อง นี่คือสิ่งที่คุณสามารถทำได้เพื่อแก้ไขปัญหานี้:
หากคุณได้ติดตั้งปลั๊กอินแคช แคช DNS หรือการแคชในรูปแบบใดๆ ให้ล้างข้อมูลเหล่านั้นออก และล้างแคชของเบราว์เซอร์ของคุณด้วยเช่นกัน อาจเป็นไปได้ว่าคุณไม่ได้กำลังใช้งานสคริปต์ล่าสุดของเว็บไซต์ของคุณ
นอกจากนี้ยังเป็นไปได้ว่าคุกกี้ของคุณอาจเกิดข้อผิดพลาด ซึ่งสามารถแก้ไขได้อย่างง่ายดายโดยการล้างคุกกี้ของเบราว์เซอร์จากการตั้งค่าของเบราว์เซอร์ของคุณ โดยปกติแล้วตัวเลือกนี้จะอยู่ใกล้กับตำแหน่งที่คุณล้างแคชของเบราว์เซอร์
ไปที่ การตั้งค่า > ทั่วไป (Settings > General) และตรวจสอบการตั้งค่าของคุณ มองหาการตั้งค่าสำหรับ ที่อยู่ WordPress (URL) และ ที่อยู่เว็บไซต์ (URL) โดเมนและโปรโตคอลของรายการเหล่านั้นควรตรงกับโดเมนจริงของคุณ ตัวอย่างเช่น หากมีอันใดอันหนึ่งใช้ “http://” แต่คุณเข้าชมเว็บไซต์โดยใช้ “https://” การตั้งค่าก็ควรอ่านได้เป็น “https://” อีกปัญหาหนึ่งที่พบบ่อยคือ URL หนึ่งมี “www” แต่อีกอันไม่มี
ค่าเหล่านี้ควรตรงกัน:
หรือ:
ในการแก้ไขปัญหานี้ คุณสามารถเปลี่ยนการตั้งค่าได้จาก การตั้งค่า > ทั่วไป หากคุณไม่สามารถแก้ไขการตั้งค่าเหล่านั้นได้ คุณสามารถเปิด FTP ของคุณและแก้ไขไฟล์ wp-config.php แล้วเพิ่มบรรทัดเหล่านี้เข้าไป:
define( 'WP_HOME', 'http://example.com' ); define( 'WP_SITEURL', 'http://example.com' );
หมายเหตุ: ตามค่าเริ่มต้น ส่วนหัวจะถูกลบออกจากหน้าแรกเท่านั้น
หากต้องการลบส่วนหัวหรือเมนูออกจากหน้าใดๆ ของคุณ คุณจะต้องมีปลั๊กอินที่ช่วยให้คุณเพิ่ม CSS ที่กำหนดเองได้ เช่น Jetpack
หากต้องการลบส่วนหัว คุณจะต้องมี ID โพสต์ ของโพสต์ของคุณ จากนั้นเพิ่ม CSS ที่กำหนดเองนี้ (แทนที่ 9999 ที่นี่ด้วย ID โพสต์ของคุณ):
body.page-id-9999 #masthead {
display: none;
}
หากต้องการลบเมนูออกจากหน้าใดหน้าหนึ่ง (แทนที่ 9999 ที่นี่ด้วย ID โพสต์ของคุณ):
body.page-id-9999 #header-wrapper {
display: none;
}
หรือเมื่อต้องการลบเมนูออกจากหน้าแรกของคุณเท่านั้น:
body.page-id-9999 #header-wrapper {
display: none;
}
คุณสามารถเพิ่มภาพพื้นหลังลงในแถวและพื้นหลังของคุณได้ ยิ่งไปกว่านั้น คุณยังสามารถย้อมสีภาพพื้นหลังของคุณด้วยสีสันต่างๆ เพื่อให้เข้ากับการออกแบบของคุณได้ดียิ่งขึ้น
ตัวอย่างเช่น ที่นี่มีแถวที่มีภาพพื้นหลังพร้อมข้อความซ้อนทับสีขาว ตอนนี้ค่อนข้างยากที่จะมองเห็นข้อความเนื่องจากภาพพื้นหลังที่เลือกไว้
เพื่อให้ดูดีขึ้น เราสามารถเพิ่มสีสันให้กับภาพพื้นหลังของเราได้ ในการทำเช่นนี้ ให้วางเมาส์เหนือ แถว จากนั้นคลิกที่ ไอคอนรูปเฟือง ของแถวเพื่อเปิดการตั้งค่าคุณสมบัติ ไปที่ตัวเลือก Background จากนั้นเปิดใช้งาน Background Image Tint
หลังจากเปิดใช้งานแล้ว คุณเปลี่ยนสีพื้นหลังและระบบจะเพิ่มการย้อมสีลงในภาพพื้นหลังของคุณ คุณยังสามารถเปลี่ยนความเข้มหรือความทึบแสง (opacity) ของการย้อมสีได้อีกด้วย นี่คือภาพพื้นหลังที่ย้อมด้วยสีเขียวเพื่อให้มองเห็นข้อความได้ชัดเจนยิ่งขึ้น:
| เวอร์ชัน Lite | ไม่พร้อมใช้งาน |
| เวอร์ชัน Premium | ใช้งานได้ทุกฟีเจอร์
|
Carousel เป็นวิธีแปลกใหม่ในการเพิ่มเนื้อหาที่หมุนวนวนซ้ำให้ปรากฏในมุมมอง Page Builder Sandwich มีองค์ประกอบ Carousel ในตัวที่สามารถนำมาใช้งานได้เลย ทำให้ไม่จำเป็นต้องใช้ปลั๊กอิน Carousel จากภายนอก
การคลิกปุ่มรูปเฟืองขององค์ประกอบ Carousel จะช่วยให้คุณสามารถกำหนดลักษณะการทำงานของ Carousel ได้ เช่น แอนิเมชันของสไลด์ การหน่วงเวลา และอื่นๆ เมื่อสร้างขึ้น คุณจะได้รับสไลด์ Carousel สามสไลด์สำหรับเริ่มต้นใช้งาน พร้อมตัวเลือกในการเพิ่มหรือลบสไลด์ สไลด์ทั้งหมดเหล่านี้รองรับองค์ประกอบทั่วไปที่ใช้ เช่น ข้อความ รูปภาพ และชอร์ตโค้ดบางประเภท
การสลับสไลด์ทำได้ง่ายเพียงแค่เลือกปุ่มนำทาง นอกจากนี้ยังสามารถปรับเปลี่ยนลำดับของสไลด์ผ่านการตั้งค่าคุณสมบัติ (ไอคอนรูปเฟือง) ได้เช่นกัน
หากต้องการเปลี่ยนสถานะโพสต์ของคุณ ให้เลื่อนเมาส์ไปวางเหนือสัญลักษณ์ลูกศรดรอปดาวน์บนปุ่มบันทึกที่ด้านบนซ้ายของหน้าจอ ซึ่งจะแสดงตัวเลือกการบันทึกเพิ่มเติม
หากคุณกำลังใช้งานเวอร์ชัน lite คุณอาจสังเกตเห็นธงสามเหลี่ยมสีเหลือง ธงเหล่านี้จะระบุว่าปุ่ม/องค์ประกอบ/ตัวเลือกนั้นเป็นฟีเจอร์พรีเมียมหรือไม่
หากคุณต้องการซ่อนธงเหล่านั้น คุณสามารถไปที่แดชบอร์ดของคุณ ไปที่หน้าการตั้งค่าใน PBSandwich > Settings และทำเครื่องหมายที่การตั้งค่าสำหรับ Hide Premium Feature Flags
| เวอร์ชัน Lite | ใช้งานได้ทุกฟีเจอร์ |
| เวอร์ชัน Premium | ใช้งานได้ทุกฟีเจอร์ |
คลิกที่องค์ประกอบ HTML ในตัวตรวจสอบ (Inspector) เพื่อเพิ่มองค์ประกอบ HTML ใหม่ โดยหน้าต่างโมดอลจะปรากฏขึ้น ให้พิมพ์หรือวางโค้ด HTML ของคุณลงในนั้น จากนั้นคลิกบันทึก HTML โค้ด HTML ของคุณจะปรากฏขึ้นภายในตัวแก้ไข
ชี้เมาส์ไปที่องค์ประกอบ HTML เพื่อแสดงแถบเครื่องมือ คุณสามารถแก้ไข HTML ของคุณได้โดยคลิกที่ไอคอนรูปดินสอในแถบเครื่องมือ หรือดับเบิลคลิกที่ตัวองค์ประกอบเอง
เราไม่ต้องการอินเทอร์เฟซที่ดูรกตา และต้องการให้ทุกอย่างเข้าใจง่ายและค้นพบได้ไม่ยาก ดังนั้น แม้ว่าหน้าตาการใช้งานของ Page Builder Sandwich จะดูเรียบง่าย แต่ก็ทรงพลังมากและคุณสามารถทำสิ่งต่างๆ ได้มากมายในขณะแก้ไข
คุณยังสามารถทำสิ่งดีๆ ได้มากมายโดยใช้เคอร์เซอร์เมาส์ของคุณ โอเวอร์เลย์และแถบเครื่องมือแบบโต้ตอบจะปรากฏขึ้นเมื่อคุณเลื่อนเมาส์ไปวางเหนือองค์ประกอบต่างๆ ซึ่งแต่ละอย่างจะทำหน้าที่แตกต่างกัน เช่น:
หากคุณไม่เห็นปุ่ม “Edit with Page Builder Sandwich” ที่หน้าบ้านของเว็บไซต์ ต่อไปนี้คือสิ่งที่คุณสามารถลองตรวจสอบดูได้:
ปุ่มแก้ไขของ PB Sandwich จะมีให้ใช้งานในแถบผู้ดูแลระบบที่หน้าบ้านของคุณ ตรวจสอบให้แน่ใจว่าแถบผู้ดูแลระบบแสดงอยู่โดยไปที่การดูแลระบบของคุณ แล้วไปที่ Users > Your Profile และตรวจสอบอีกครั้งว่าได้ทำเครื่องหมายที่ช่อง Show Toolbar when viewing site แล้ว
เฉพาะ Posts, Pages & Custom Post Types เท่านั้นที่สามารถแก้ไขได้ที่หน้าบ้าน คุณจะแก้ไขสิ่งต่างๆ ที่หน้าบ้านได้ก็ต่อเมื่อคุณสามารถแก้ไขได้โดยใช้ตัวแก้ไขเนื้อหาของ WordPress ในหลังบ้าน พื้นที่อื่นๆ ของเว็บไซต์คุณ เช่น รายการบล็อกโพสต์ในหน้าแรก, รายการบล็อกโพสต์ทั้งหมด, หน้ารายการหมวดหมู่, หน้า 404, หน้าการค้นหา เป็นหน้าแบบไดนามิกที่สร้างโดย WordPress ร่วมกับธีมที่คุณใช้อยู่ และไม่สามารถแก้ไขได้โดยใช้ PB Sandwich
สิ่งหนึ่งที่บ่งบอกว่าหน้าเว็บปัจจุบันสามารถแก้ไขได้หรือไม่คือ หากคุณเห็น “Edit Post” หรือ “Edit Page” บนแถบผู้ดูแลระบบของคุณ
หากหน้า/โพสต์ของคุณถูกสร้างขึ้นแบบไดนามิกโดยธีมหรือปลั๊กอิน หน้า/โพสต์นั้นจะไม่สามารถแก้ไขด้วย Page Builder Sandwich ได้ (และเป็นไปได้สูงว่าจะแก้ไขในตัวสร้างหน้าอื่นๆ ไม่ได้ด้วยเช่นกัน) หากคุณสังเกตเห็นว่าตัวแก้ไขเนื้อหาในหลังบ้านของคุณว่างเปล่า แต่เมื่อดูหน้าเว็บที่หน้าบ้านกลับมีเนื้อหาเต็มไปหมด นี่เป็นข้อบ่งชี้ที่ดีว่าหน้าของคุณถูกสร้างขึ้นแบบไดนามิก
หากต้องการตรวจสอบว่าหน้าของคุณถูกสร้างขึ้นแบบไดนามิกหรือไม่ ให้ดูซอร์สโค้ดของหน้าเว็บ (คลิกขวาแล้วเลือก “View Page Source”) ค้นหาข้อความ “pbs-main-wrapper” หากคุณไม่เห็นข้อความนั้น แสดงว่าหน้าเว็บของคุณถูกสร้างขึ้นแบบไดนามิก
ต่อไปนี้คือตัวอย่างบางส่วนของเนื้อหาที่สร้างขึ้นแบบไดนามิก:
เคยมีกรณีที่ธีมไม่แสดงเนื้อหาเลยหากเนื้อหาว่างเปล่า และทำให้ PBS เข้าใจผิดว่าหน้านั้นไม่สามารถแก้ไขได้ ในการตรวจสอบว่าเป็นกรณีนี้หรือไม่ ให้แก้ไขหน้า/โพสต์ของคุณในตัวแก้ไขหลังบ้าน ลองเพิ่มข้อความใดๆ ลงในเนื้อหาของคุณ (ตัวอย่างเช่น “hello”) จากนั้นคลิกที่ปุ่ม “Edit with Page Builder Sandwich” จากตรงนั้น
ขอขอบคุณ Mathias Hellquist สำหรับคำแนะนำนี้!
ตัวสร้างหน้าบางตัวจะให้คุณเลือกว่าจะใช้ตัวแก้ไขเนื้อหาเริ่มต้นของ WordPress หรือใช้ตัวแก้ไขของตัวสร้างหน้านั้นเอง หากคุณได้แก้ไขหน้าของคุณโดยใช้ตัวสร้างหน้าอื่นไปแล้ว เป็นไปได้ว่าตัวสร้างหน้านั้นอาจครอบครองเนื้อหาไปแล้ว และ hooks/filters ของเนื้อหาอื่นๆ จะไม่สามารถทำงานได้อีก ด้วยเหตุนี้ บางครั้ง Page Builder Sandwich จึงไม่สามารถตรวจจับได้ว่าเนื้อหาของคุณอยู่ที่ไหน และจะไม่แสดงปุ่มแก้ไขเนื่องจากไม่มีอะไรให้แก้ไข
ในการแก้ไขปัญหานี้ เพียงเลือกที่จะไม่ใช้ตัวสร้างหน้านั้นสำหรับหน้า/โพสต์นั้นๆ และเลือกใช้เพียงตัวแก้ไขเนื้อหาเริ่มต้นของ WordPress
ตรวจสอบให้แน่ใจว่าคุณมีสิทธิ์ในการแก้ไขหน้านั้น
ปุ่มแก้ไขจะไม่ปรากฏหากคุณไม่สามารถแก้ไขหน้านั้นได้ ตัวอย่างเช่น หากคุณเป็นผู้แก้ไข (Editor) หรือผู้ร่วมเขียน (Contributor) และคุณสามารถเขียนบล็อกโพสต์และบทความในเว็บไซต์ได้ นั่นไม่ได้หมายความว่าคุณจะสามารถแก้ไขหน้าแรกหรือหน้าติดต่อเราได้ หากคุณเห็นปุ่ม “Edit Post” บนแถบผู้ดูแลระบบของคุณ คุณก็น่าจะสามารถแก้ไขได้โดยใช้ PB Sandwich เช่นกัน โปรดติดต่อผู้ดูแลเว็บไซต์ของคุณเพื่อขอสิทธิ์การแก้ไขหากจำเป็น
PB Sandwich มีการใช้งาน Javascript อย่างมาก หากมีข้อผิดพลาด Javascript ที่มาจากสคริปต์อื่นๆ ในเว็บไซต์ของคุณ สิ่งนี้อาจทำให้ PB Sandwich ใช้งานไม่ได้ ในการตรวจสอบว่าเป็นกรณีนี้หรือไม่ คุณสามารถเปิดคอนโซลนักพัฒนา (developer console) ในเบราว์เซอร์ของคุณเพื่อตรวจสอบข้อผิดพลาดได้
ขอแนะนำให้ใช้ Chrome สำหรับขั้นตอนนี้ คลิกขวาที่ส่วนใดก็ได้ในหน้าเว็บ จากนั้นคลิกที่ตัวเลือก “Inspect” การดำเนินการนี้จะเปิดหน้าต่างใหม่ขึ้นมาที่ด้านล่างของเบราว์เซอร์ของคุณ ให้คลิกที่แท็บ “console” หากคุณมีข้อผิดพลาด คุณควรจะเห็นข้อความในลักษณะนี้:
หากคุณมีข้อผิดพลาด คุณยังสามารถดูเบาะแสได้ว่าสิ่งนี้มาจากไหนโดยการคลิกหรือเลื่อนเมาส์ไปวางเหนือชื่อสคริปต์:
ข้อผิดพลาดเหล่านี้อาจมาจากธีมของคุณหรือปลั๊กอินอื่นๆ ที่คุณอาจมี การแก้ไขข้อผิดพลาดเหล่านั้นจะช่วยให้ PB Sandwich กลับมาทำงานได้อีกครั้ง
หากธีมหรือปลั๊กอินตัวใดตัวหนึ่งของคุณทำให้เกิดข้อผิดพลาด Javascript โปรดแจ้งให้เราทราบทางอีเมลที่ [email protected] และเราจะพยายามอย่างเต็มที่เพื่อแก้ไขปัญหาให้คุณ 🙂
CloudFlare เป็น DNS CDN ฟรีที่นิยมใช้งานกันอย่างแพร่หลาย เป็นบริการที่ยอดเยี่ยม แต่ปัจจุบัน PBS มีปัญหาเมื่อพูดถึงฟีเจอร์ Rocket Loader โดย Rocket Loader จะช่วยเพิ่มความเร็วในการโหลดไฟล์ Javascript แต่จะทำให้ลำดับการเรียกใช้งานและการพึ่งพาของสคริปต์ PBS ผิดเพี้ยนไป หากคุณเปิด Rocket Loader ไว้ ปุ่มแก้ไขสำหรับ Page Builder Sandwich จะไม่แสดงขึ้นมา (และไม่มีข้อผิดพลาด Javascript ใดๆ แสดงในคอนโซล)
หากต้องการตรวจสอบว่าเว็บไซต์ของคุณใช้ CloudFlare Rocket Loader หรือไม่ ให้ดูซอร์สโค้ดของหน้าเว็บ (คลิกขวาแล้วเลือก “View Page Source”) จากนั้นค้นหาข้อความ “rocketscript” หากคุณพบข้อความดังกล่าว แสดงว่าคุณเปิด Rocket Loader ไว้อยู่
อ่านบทความเกี่ยวกับ ความเข้ากันได้ของ CloudFlare & Rocket Loader สำหรับคำแนะนำแบบละเอียดเกี่ยวกับวิธีการปิดใช้งาน
เอาล่ะ ถึงตรงนี้ หากไม่มีวิธีแก้ไขปัญหาใดข้างต้นได้ผล อาจถึงเวลาที่จะต้องอธิบายว่า ทำไม ปุ่มถึงไม่แสดง และควรทำอย่างไรกับปัญหานี้ พร้อมหรือยัง? ลุยกันเลย!
Page Builder Sandwich จำเป็นต้องรู้ว่าเนื้อหาของหน้า/โพสต์ของคุณอยู่ที่ไหน เราทำสิ่งนี้โดยการคอยตรวจจับเมื่อ WordPress โหลดเนื้อหาของโพสต์และ “ทำเครื่องหมาย” ในบริเวณนั้นไว้ เพื่อที่ว่าเมื่อทุกอย่างโหลดเสร็จแล้ว เราจะสามารถค้นหาได้ว่าเนื้อหาสำคัญอยู่ที่ไหน
ในบางครั้ง ปลั๊กอินบางตัวอาจเขียนทับหรือข้ามขั้นตอนนี้ และพยายามโหลดเนื้อหาด้วยวิธีของตนเองแทน บางครั้งสิ่งนี้ก็ไม่มีปัญหา แต่ในบางสถานการณ์ โดยเฉพาะอย่างยิ่งเมื่อเกี่ยวข้องกับการโหลดเนื้อหาหลักของโพสต์ สิ่งนี้อาจทำให้ปลั๊กอินบางตัวหยุดทำงานได้ เมื่อมีปลั๊กอินอื่นข้ามกระบวนการโหลดนี้ “เครื่องหมาย” ที่เราทำไว้อาจสูญหายไป และเมื่อถึงเวลาที่ตัวแก้ไขต้องทำงาน มันจะไม่สามารถค้นหาตำแหน่งเนื้อหาของคุณได้อีกต่อไป ดังนั้น ปุ่มแก้ไขจึงไม่แสดงขึ้นมา! คุณอาจพบว่าปลั๊กอินบางตัวที่เพิ่มเนื้อหาลงในหน้าของคุณ เช่น ปลั๊กอินแชร์ไปยังโซเชียล อาจหยุดทำงานเนื่องจากสาเหตุเดียวกันนี้ได้เช่นกัน
Page Builder Sandwich จำเป็นต้อง รู้ ว่าเนื้อหาของหน้า/โพสต์ของคุณอยู่ที่ไหน และทำสิ่งนี้โดยการ hook เข้ากับตัวกรอง the_content และเพิ่ม wrapper ครอบเนื้อหาหลักของคุณ ปลั๊กอินบางตัวอาจแทนที่สิ่งนี้และเขียนทับเนื้อหาด้วยฟังก์ชัน get_the_content() ในขั้นตอนต่อไปแทน น่าเสียดายที่การทำเช่นนี้จะป้องกันไม่ให้ตัวกรอง the_content ทั้งหมดถูกเรียกใช้งาน และทำให้ wrapper ของ PBS สูญหายไป การเปลี่ยนแปลงของปลั๊กอินอื่นๆ ก็จะสูญหายไปด้วยเช่นกัน
ไม่มีอะไรผิดกับการใช้ get_the_content() โดยตัวมันเอง แต่ก็อาจมีผลกระทบตามมาหากนำไปใช้ในการสืบค้นหลัก (main query) และภายในหน้าเทมเพลตโพสต์เดี่ยว แทนการเรียกใช้ the_content() ตามปกติซึ่งตัวกรอง the_content ทั้งหมดจะทำงาน
คุณสามารถตรวจสอบว่า “เครื่องหมาย” ของ Page Builder Sandwich ไม่ปรากฏอยู่หรือไม่ โดยไปที่หน้า/โพสต์ของคุณที่หน้าบ้านและดูซอร์สโค้ดของหน้า ในขณะที่เข้าสู่ระบบอยู่ ค้นหาดูในโค้ดว่าคุณพบข้อความนี้หรือไม่:
data-name="main-content"
หากคุณพบข้อความนี้ แสดงว่าอาจเป็นเพียงปัญหา Javascript ที่ใดที่หนึ่ง เพียงแจ้งให้เราทราบเกี่ยวกับธีมและปลั๊กอินที่คุณใช้งานอยู่ และเราสามารถแก้ไขปัญหานั้นได้
แต่หากคุณไม่พบข้อความนี้ อาจเป็นไปได้ว่าธีมของคุณ (หรือปลั๊กอิน แต่มักจะเป็นธีมหากเป็นหน้าเพจหรือบล็อกโพสต์) กำลังทำอะไรบางอย่างกับเนื้อหาของโพสต์ หากเป็นกรณีนี้ คุณควรติดต่อนักพัฒนาธีมและแจ้งให้พวกเขาทราบเกี่ยวกับปัญหานี้! คุณยังสามารถแสดงคำอธิบาย “ทำไม” ในเชิงเทคนิคด้านบนให้พวกเขาดูได้ ซึ่งจะช่วยในการแก้ไขข้อบกพร่อง (debug) ได้ 🙂
หากคุณมั่นใจในการแก้ไข PHP คุณสามารถลองแก้ไขได้โดยค้นหาไฟล์เทมเพลตที่จัดการเนื้อหาของโพสต์ วิธีแก้ปัญหาหนึ่งที่เราพบคือการแทนที่การเรียกใช้:
$content = get_the_content();
ด้วย:
ob_start(); the_content(); $content = ob_get_clean();<br>
หมายเหตุ: ตัวแปร PHP อาจแตกต่างกันไปในไฟล์ของคุณ แต่แนวคิดควรจะเหมือนกัน หากวิธีนี้ใช้ได้ผล จะเป็นการดีกว่าเช่นกันหากคุณสร้าง child theme ขึ้นมาแทนที่จะนำการเปลี่ยนแปลงนี้ไปใช้ในธีมของคุณโดยตรง นอกจากนี้อาจมีผลข้างเคียงจากการเปลี่ยนแปลงนี้ ดังนั้นจึงเป็นการดีกว่าหากคุณปรึกษากับนักพัฒนาธีมของคุณเกี่ยวกับเรื่องนี้
เมื่อคุณเริ่มแก้ไขด้วย PBS ให้วางเมาส์เหนือชื่อเรื่องของหน้า/โพสต์ของคุณ เส้นขอบจะปรากฏขึ้น คลิกที่ชื่อเรื่องเพื่อวางเคอร์เซอร์และแก้ไข
เครื่องมือจัดรูปแบบไม่สามารถใช้งานได้ในพื้นที่ชื่อเรื่อง คุณไม่สามารถแก้ไขสไตล์หรือเพิ่มองค์ประกอบลงในชื่อเรื่องได้
แถวและคอลัมน์เป็นเครื่องมือที่คุณสามารถใช้เพื่อสร้างเนื้อหาที่แบ่งเป็นส่วนๆ
เมื่อแก้ไขโดยใช้ Page Builder Sandwich จากหน้า/โพสต์ที่สร้างขึ้นใหม่ เนื้อหาที่คุณพิมพ์จะถูกจัดวางไว้ในคอลัมน์เดียวทั้งหมด ซึ่งเหมาะสำหรับการเขียนโพสต์บล็อก แต่หากคุณต้องการเลย์เอาต์พิเศษสำหรับหน้า Landing Page หรือหน้าติดต่อ คุณอาจต้องการเลย์เอาต์แบบ 2 คอลัมน์ หรือแม้แต่การผสมผสานคอลัมน์ที่แตกต่างกันไปตามหน้าเว็บของคุณ
คุณสามารถเพิ่มแถวและคอลัมน์ได้โดยใช้ปุ่มเหล่านี้ในหน้าต่างตัวตรวจสอบ (inspector):
เมื่อเพิ่มแล้ว แถวใหม่ของคุณจะมีเส้นเค้าร่างล้อมรอบ:
คุณสามารถใส่สิ่งใดก็ได้ไว้ในแถวและคอลัมน์ของคุณ – ข้อความ, ชอร์ตโค้ด, วิดเจ็ต และแม้กระทั่งเพิ่มแถวและคอลัมน์เพิ่มเติม
เมื่อเลือกแถว (หรือเนื้อหาภายในแถวของคุณ) ตัวเลือกเพิ่มเติมจะปรากฏขึ้นในหน้าต่างตัวตรวจสอบของคุณ คุณสามารถใช้ปุ่มเหล่านี้เพื่อปรับแต่งสไตล์ส่วนของคุณเพิ่มเติม:
นอกจากนี้ยังมีตัวเลือกเพิ่มเติมสำหรับการจัดแต่งสไตล์คอลัมน์ของคุณอยู่ด้านล่างนี้ในหน้าต่างตัวตรวจสอบ
คุณสามารถย้ายแถวไปยังตำแหน่งต่างๆ ได้โดยการคลิกค้างไว้ที่ตัวแถว (หากคุณคลิกค้างไว้ที่องค์ประกอบภายในแถว ตัวองค์ประกอบจะถูกลากแทนที่จะเป็นแถว)
| เวอร์ชัน Lite | ไม่พร้อมใช้งาน |
| เวอร์ชัน Premium | ใช้งานได้ทุกฟีเจอร์
|
คุณสามารถเลือกไฮไลต์ข้อความบางส่วนได้ตามต้องการ จากนั้นคลิกที่องค์ประกอบปุ่มในอินสเปกเตอร์ (Inspector) การดำเนินการนี้จะเปิดหน้าต่างโมดอลขึ้นมาเพื่อให้คุณพิมพ์ URL ที่ต้องการลิงก์ไปสำหรับปุ่มของคุณ คุณยังสามารถค้นหาหน้าเว็บใดๆ ที่มีอยู่แล้วในเว็บไซต์ของคุณได้จากตรงนั้น
ปุ่มจะถูกวางแบบอินไลน์ (inline) ซึ่งแตกต่างจากองค์ประกอบอื่นๆ ซึ่งหมายความว่าปุ่มจะถูกวางควบคู่ไปกับข้อความอื่นๆ (หรือปุ่มอื่นๆ) คุณไม่สามารถลากและวางปุ่มเดี่ยวๆ ไปยังตำแหน่งอื่นได้ แต่จะต้องลากปุ่มไปพร้อมกับข้อความที่อยู่ล้อมรอบ
ในระหว่างการแก้ไข เมื่อคุณคลิกที่ปุ่ม คุณจะสามารถเห็นตัวเลือกการจัดสไตล์เพิ่มเติมในอินสเปกเตอร์ นอกจากนี้คุณยังสามารถเลื่อนเมาส์ไปวางเหนือปุ่มเพื่อดู URL ที่ปุ่มลิงก์ไป รวมถึงคำสั่งอื่นๆ ได้อีกด้วย
หมายเหตุ: ให้ทำตามขั้นตอนนี้เมื่อคุณติดตั้งและเปิดใช้งาน PBS ไว้อยู่แล้ว และต้องการอัปเดตด้วยไฟล์ zip ที่คุณดาวน์โหลดมาจากเว็บไซต์ หรือจากไฟล์แนบที่เราส่งให้คุณทางอีเมล
หมายเหตุ: เรากำลังใช้ปลั๊กอินอื่นเพื่อทำการอัปเดต ซึ่งวิธีนี้ช่วยให้เราสามารถอัปเดต PBS ได้ทันทีโดยไม่จำเป็นต้องถอนการติดตั้งก่อน
ไปที่ ปลั๊กอิน > เพิ่มปลั๊กอินใหม่ (Plugins > Add New) จากนั้นในช่องค้นหา ให้ค้นหาปลั๊กอิน “Easy Theme and Plugin Upgrades”
เมื่อคุณพบปลั๊กอินแล้ว ให้ติดตั้งและเปิดใช้งาน
หลังจากเปิดใช้งานปลั๊กอิน Easy Theme and Plugin Upgrades แล้ว ให้ไปที่ ปลั๊กอิน > เพิ่มปลั๊กอินใหม่ อีกครั้ง จากนั้นคลิกที่ปุ่ม อัปโหลดปลั๊กอิน (Upload Plugin) ที่อยู่บริเวณด้านบน:
เลือกและติดตั้งไฟล์ zip ของ Page Builder Sandwich
เพียงเท่านี้ก็เรียบร้อย ตอนนี้คุณก็จะมี PBS เวอร์ชันใหม่แล้ว
| เวอร์ชัน Lite | ใช้งานได้พร้อมการปรับแต่งสไตล์ที่จำกัด |
| เวอร์ชัน Premium | ใช้งานได้ครบทุกฟีเจอร์
|
คลิกที่องค์ประกอบแผนที่เพื่อเพิ่มแผนที่ลงในหน้าเว็บของคุณ เมื่อใดก็ตามที่เลือกองค์ประกอบแผนที่ แผง inspector จะแสดงการตั้งค่าแผนที่ คุณสามารถป้อนพิกัดละติจูด & ลองจิจูด หรือที่อยู่ลงในช่องตำแหน่งที่ตั้งใน inspector เพื่อจัดให้แผนที่ของคุณอยู่กึ่งกลางในพื้นที่นั้น นอกจากนี้ยังมีตัวเลือกการจัดสไตล์อื่นๆ ให้ใช้งานที่นั่นด้วย
คุณสามารถปรับเปลี่ยนองค์ประกอบแผนที่เพิ่มเติมได้โดยการเลื่อน (pan) หรือซูมเข้า/ออกแผนที่ โปรดทราบว่าการเปลี่ยนแปลงของคุณบนแผนที่จะถูกนำไปใช้กับองค์ประกอบดังกล่าว
สำหรับผู้ใช้ Premium คุณสามารถปรับแต่งสไตล์แผนที่ของคุณได้โดยการเลือกสีเพื่อย้อมสีแผนที่ อีกทางเลือกหนึ่งคือการใช้ snazzymaps.com เพื่อสร้างชุดโทนสีแล้วนำมาใช้ SnazzyMaps สามารถใช้เพื่อสร้างชุดโทนสีที่คล้ายกับอันนี้ได้: https://snazzymaps.com/style/20053/papuportal-dark หากต้องการใช้ชุดโทนสีเหล่านี้ ให้คัดลอก Javascript style array ลงใน inspector
สามารถปรับความสูงของแผนที่ได้ อย่างไรก็ตาม ความกว้างของแผนที่ไม่สามารถปรับได้โดยตรง และจะปรับขนาดให้เต็มความกว้างสูงสุดที่มีอยู่เสมอ หากต้องการปรับขนาด ให้วางแผนที่ของคุณไว้ในแถวและคอลัมน์ คุณยังสามารถตั้งค่าให้แผนที่แสดงผลเต็มความกว้างของเบราว์เซอร์ได้อีกด้วย
คุณสามารถใช้เมาส์เพื่อวางเคอร์เซอร์ในบริเวณต่างๆ ของเนื้อหาได้อย่างรวดเร็ว หรือเลือกองค์ประกอบต่างๆ
คุณยังสามารถใช้ปุ่มลูกศรบนแป้นพิมพ์เพื่อเลื่อนเคอร์เซอร์ไปตามเนื้อหาของคุณได้ คุณสามารถใช้วิธีนี้เพื่อเลื่อนไปด้านบนหรือด้านล่างของแถว
เมื่อจัดการกับแถวและคอลัมน์ คุณสามารถคลิกที่ขอบของแถวเพื่อเพิ่มเนื้อหาต่อท้ายหรือก่อนหน้าแถวของคุณได้ ซึ่งจะมีประโยชน์อย่างยิ่งหากคุณมีหลายแถวซ้อนกันอยู่ และต้องการเพิ่มเนื้อหาบางส่วนระหว่างแถวเหล่านั้น
Page Builder Sandwich ไม่เหมือนกับเครื่องมือสร้างเพจทั่วไป เพราะไม่ซับซ้อนและใช้งานง่าย
คุณสามารถดูวิดีโอด้านล่างนี้เพื่อดูภาพรวมการใช้งานอย่างรวดเร็ว
ขั้นแรก ให้สร้างหน้า, โพสต์ หรือ CPT ใหม่ จากนั้นไปที่โพสต์ใหม่ของคุณหรือโพสต์ใดๆ ที่มีอยู่แล้วบนหน้าบ้าน (Frontend) ของคุณ PBS ทำงานบนหน้าบ้าน 100% คุณจึงไม่ต้องไปวุ่นวายกับการตั้งค่าในระบบหลังบ้าน
จะมีปุ่ม “Page Builder Sandwich” อยู่ที่ด้านบนของหน้าเว็บ (บนแถบผู้ดูแลระบบของคุณ) ให้คลิกที่ปุ่มนั้นเพื่อเริ่มแก้ไข คุณจะเห็นพื้นที่จัดรูปแบบข้อความปรากฏขึ้นจากด้านบน และแผงเพิ่มองค์ประกอบปรากฏขึ้นจากด้านข้าง ตอนนี้พื้นที่เนื้อหาในธีมของคุณก็กลายเป็นตัวแก้ไขแล้ว!
คุณสามารถแก้ไขได้เฉพาะหน้าเดี่ยวด้วย PBS เท่านั้น คุณไม่สามารถแก้ไขหน้ารายการบล็อกโพสต์ หรือหน้า 404 ได้ เนื่องจากหน้าเหล่านั้นถูกสร้างขึ้นโดยธีมของคุณ ทั้งนี้ โพสต์, หน้า และ custom post types สามารถแก้ไขได้ตามปกติ
และนี่คือส่วนที่ยอดเยี่ยมมาก… เมื่อคุณอยู่ที่หน้าบ้านและอยู่ในตัวแก้ไขแล้ว ให้คลิกที่ข้อความใดก็ได้ในเนื้อหาของคุณ หรือคลิกภายในพื้นที่เนื้อหาแล้วเริ่มพิมพ์ได้เลย! แตกต่างจากเครื่องมือสร้างเพจอื่นๆ PBS ให้คุณแก้ไขเนื้อหาได้โดยตรงโดยไม่ต้องผ่านกล่องข้อความป๊อปอัป
ในขณะที่แก้ไข พื้นที่ด้านบนจะเรียกว่า Text Formatting Bar แถบนี้ประกอบด้วยเครื่องมือจัดรูปแบบทั้งหมดที่คุณจะใช้สำหรับตกแต่งข้อความ เช่น สี, ตัวหนา, ตัวเอียง, การจัดแนว, การเพิ่มลิงก์, สัญลักษณ์แสดงหัวข้อย่อย และอื่นๆ เลื่อนเมาส์ไปวางเหนือแต่ละปุ่มเพื่อดูว่าเครื่องมือนั้นใช้ทำอะไร
เลื่อนเมาส์ไปวางเหนือปุ่ม Add Elements ที่ด้านซ้ายบนของหน้าจอเพื่อแสดง Add Element Panel หรือคุณเพียงแค่เลื่อนเมาส์ไปทางด้านซ้ายของหน้าจอเพื่อให้แผงดังกล่าวแสดงขึ้นมาก็ได้
หากต้องการแทรกองค์ประกอบใดๆ ให้คลิกเมาส์ค้างไว้ที่องค์ประกอบนั้น แล้วลากไปยังพื้นที่เนื้อหาของคุณ พื้นที่ที่จะวางองค์ประกอบจะแสดงไฮไลต์ขึ้นมา ปล่อยปุ่มเมาส์เพื่อวางองค์ประกอบ
เลื่อนเมาส์ไปวางเหนือองค์ประกอบใดๆ ที่คุณมีในเนื้อหา จากนั้นเส้นขอบและแถบเครื่องมือจะปรากฏขึ้นเหนือองค์ประกอบเหล่านั้น
คุณสามารถเลื่อนเมาส์ไปวางเหนือขอบของเส้นโครงร่างเพื่อเพิ่ม/ลดระยะขอบระหว่างองค์ประกอบได้
คุณยังสามารถคลิกที่ปุ่มบนแถบเครื่องมือเพื่อดำเนินการด่วนกับองค์ประกอบได้ การคลิกที่ไอคอน ฟันเฟือง บนแถบเครื่องมือจะเปิด Properties Inspector ซึ่งมีตัวเลือกเพิ่มเติมมากมาย
Properties Inspector ช่วยให้คุณควบคุมรูปลักษณ์ขององค์ประกอบได้มากขึ้น คุณสามารถเพิ่มสิ่งต่างๆ ได้มากมาย เช่น เงา, แอนิเมชัน, เปลี่ยนสีแผนที่, รัศมีขอบมน และอื่นๆ อีกมากมาย
คุณยังสามารถเข้าถึงคุณสมบัติขององค์ประกอบระดับบนได้อีกด้วย ตัวอย่างเช่น หากคุณวางรูปภาพไว้ในคอลัมน์แล้วเปิด Properties Inspector ขึ้นมา คุณจะสามารถเข้าถึงคุณสมบัติของรูปภาพ คอลัมน์ที่บรรจุรูปภาพนั้น และแถวที่คอลัมน์นั้นอยู่ได้
Properties Inspector มีการตั้งค่าที่หลากหลายสำหรับแต่ละองค์ประกอบ ดังนั้นอย่าลืมลองสำรวจดูทั้งหมด
Page Builder Sandwich จะแสดงชอร์ตโค้ดจริงบนหน้าบ้าน และคุณก็สามารถแก้ไขได้อย่างง่ายดายเช่นกัน!
หากคุณจำชอร์ตโค้ดของคุณได้ คุณสามารถแทรกชอร์ตโค้ดได้โดยพิมพ์ลงในเนื้อหาของคุณโดยตรง แต่ถ้าคุณจำไม่ได้ทั้งหมด (ใครจะไปจำได้หมด?) ตัวตรวจสอบจะแสดงรายการชอร์ตโค้ดทั้งหมดที่มีอยู่ในเว็บไซต์ของคุณ ลากปุ่ม Shortcode จากตัวตรวจสอบเข้ามายังพื้นที่เนื้อหาของคุณ แล้วค้นหาชอร์ตโค้ดที่คุณต้องการแทรก จากนั้นคลิกเพื่อแทรกลงไป
ชอร์ตโค้ดจะถูกเรนเดอร์เป็นเนื้อหาจริงในหน้าบ้าน หากต้องการแก้ไข คุณสามารถเลือกชอร์ตโค้ดนั้นและตรวจสอบแอตทริบิวต์ในตัวตรวจสอบ หรือหากต้องการควบคุมเพิ่มเติม คุณสามารถดับเบิลคลิกที่ชอร์ตโค้ดเพื่อแก้ไขในรูปแบบดิบได้ หลังจากการแก้ไขของคุณ ชอร์ตโค้ดจะอัปเดตเพื่อแสดงการเปลี่ยนแปลง
คุณสามารถคลิกและลากสิ่งใดก็ได้เพื่อย้ายไปที่ใดก็ได้ด้วย PBS เมื่อคุณลากบางสิ่ง ให้เลื่อนไปวางเหนือองค์ประกอบอื่นในหน้า โดยคุณสามารถย้ายไปไว้ด้านบนหรือด้านล่างของเนื้อหาอื่นๆ ได้
การบันทึกงานของคุณ
เมื่อคุณพอใจกับการออกแบบของคุณแล้ว เพียงคลิกที่ปุ่มบันทึกที่ด้านซ้ายบนของหน้าเว็บ เพียงเท่านี้ก็เสร็จเรียบร้อย!
Page Builder Sandwich ไม่เหมือนกับเครื่องมือสร้างหน้าทั่วไปของคุณ เพราะไม่ซับซ้อนและใช้งานง่าย
คุณสามารถดูวิดีโอด้านล่างเพื่อดูข้อมูลคร่าว ๆ ได้อย่างรวดเร็ว
ขั้นแรก ให้สร้างหน้า โพสต์ หรือ CPT ใหม่ จากนั้นไปที่โพสต์ใหม่ของคุณหรือโพสต์ที่มีอยู่แล้วที่หน้าบ้าน (frontend) PBS ทำงานที่หน้าบ้าน 100% คุณจึงไม่ต้องไปวุ่นวายกับการปรับแต่งในระบบหลังบ้าน (backend)
ควรจะมีปุ่ม “Page Builder Sandwich” ที่ด้านบนของหน้า (บนแถบผู้ดูแลระบบของคุณ) ให้คลิกที่ปุ่มนั้นเพื่อเริ่มแก้ไข คุณจะเห็นพื้นที่จัดรูปแบบข้อความปรากฏขึ้นมาจากด้านบน และแผงเพิ่มองค์ประกอบปรากฏขึ้นมาจากด้านข้าง พื้นที่เนื้อหาของธีมของคุณตอนนี้กลายเป็นเครื่องมือแก้ไขของคุณแล้ว!
คุณสามารถแก้ไขได้เฉพาะหน้าเดี่ยวด้วย PBS เท่านั้น คุณไม่สามารถแก้ไขหน้ารายการบล็อกโพสต์ หรือหน้า 404 ได้ เนื่องจากหน้าเหล่านั้นถูกสร้างขึ้นโดยธีมของคุณ ทั้งนี้สามารถแก้ไขโพสต์ หน้า และประเภทโพสต์ที่กำหนดเอง (custom post types) ได้
ตอนนี้มาถึงส่วนที่ยอดเยี่ยมแล้ว.. เมื่อคุณอยู่ที่หน้าบ้านและอยู่ในตัวแก้ไข ให้คลิกข้อความใดก็ได้ในเนื้อหาของคุณ หรือคลิกภายในพื้นที่เนื้อหาของคุณแล้วเริ่มพิมพ์ได้เลย! แตกต่างจากเครื่องมือสร้างหน้าอื่น ๆ PBS ช่วยให้คุณแก้ไขเนื้อหาได้โดยตรงโดยไม่จำเป็นต้องผ่านกล่องโต้ตอบป๊อปอัป
ขณะแก้ไข พื้นที่ด้านบนเรียกว่า แถบจัดรูปแบบข้อความ แถบนี้ประกอบด้วยเครื่องมือจัดรูปแบบทั้งหมดที่คุณจะใช้สำหรับตกแต่งข้อความ เช่น สี ตัวหนา ตัวเอียง การจัดแนว การเพิ่มลิงก์ รายการสัญลักษณ์แสดงหัวข้อย่อย และอื่น ๆ ชี้เมาส์เหนือแต่ละปุ่มเพื่อดูว่าเครื่องมือนั้นทำอะไรได้บ้าง
วางเมาส์เหนือปุ่ม Add Elements (เพิ่มองค์ประกอบ) ที่ด้านซ้ายบนของหน้าจอเพื่อแสดง แผงเพิ่มองค์ประกอบ คุณยังสามารถเลื่อนเมาส์ไปทางด้านซ้ายของหน้าจอเพื่อให้แผงแสดงขึ้นมาได้เช่นกัน
หากต้องการแทรกองค์ประกอบใด ๆ ให้คลิกเมาส์ค้างไว้ที่องค์ประกอบนั้น แล้วลากเข้าไปในพื้นที่เนื้อหาของคุณ พื้นที่ที่จะวางองค์ประกอบจะถูกเน้น ปล่อยปุ่มเมาส์เพื่อวางองค์ประกอบ
วางเมาส์เหนือองค์ประกอบใด ๆ ที่คุณมีในเนื้อหาของคุณ จากนั้นเส้นขอบและแถบเครื่องมือจะปรากฏขึ้นมาเหนือองค์ประกอบเหล่านั้น
คุณสามารถวางเมาส์เหนือขอบของเส้นร่างเพื่อเพิ่ม/ลดระยะขอบระหว่างองค์ประกอบได้
คุณยังสามารถคลิกที่ปุ่มบนแถบเครื่องมือเพื่อดำเนินการด่วนกับองค์ประกอบได้ การคลิกที่ไอคอน รูปฟันเฟือง บนแถบเครื่องมือจะเปิด ตัวตรวจสอบคุณสมบัติ (Properties Inspector) ซึ่งมีตัวเลือกเพิ่มเติม
ตัวตรวจสอบคุณสมบัติช่วยให้คุณควบคุมรูปลักษณ์ขององค์ประกอบได้มากขึ้น คุณสามารถเพิ่มสิ่งต่าง ๆ ได้มากมาย เช่น เงา ภาพเคลื่อนไหว เปลี่ยนสีแผนที่ รัศมีความโค้งมนของขอบ และอื่น ๆ อีกมากมาย
คุณยังสามารถเข้าถึงคุณสมบัติขององค์ประกอบหลัก (parents) ได้อีกด้วย ตัวอย่างเช่น หากคุณวางรูปภาพไว้ในคอลัมน์แล้วเปิดตัวตรวจสอบคุณสมบัติขึ้นมา คุณสามารถเข้าถึงคุณสมบัติของรูปภาพ คอลัมน์ที่มีรูปภาพนั้นอยู่ และแถวที่มีคอลัมน์นั้นอยู่ได้
ตัวตรวจสอบคุณสมบัติมีการตั้งค่าที่แตกต่างกันมากมายสำหรับองค์ประกอบที่ต่างกัน ดังนั้นอย่าลืมลองตรวจสอบดูทั้งหมด
Page Builder Sandwich จะแสดงชอร์ตโค้ดจริง ๆ ให้คุณเห็นที่หน้าบ้าน และคุณก็สามารถแก้ไขได้อย่างง่ายดายด้วยเช่นกัน!
หากคุณจำชอร์ตโค้ดของคุณได้ คุณสามารถแทรกชอร์ตโค้ดได้โดยพิมพ์ลงในเนื้อหาของคุณโดยตรง แต่ถ้าคุณจำไม่ได้ทั้งหมด (ใครจะไปจำได้หมด?) ตัวตรวจสอบจะแสดงรายการชอร์ตโค้ดทั้งหมดที่มีอยู่ในเว็บไซต์ของคุณ ให้ลากปุ่ม Shortcode จากตัวตรวจสอบเข้าไปในพื้นที่เนื้อหาของคุณ และค้นหาชอร์ตโค้ดที่คุณต้องการแทรก จากนั้นคลิกที่ชอร์ตโค้ดนั้นเพื่อแทรก
ชอร์ตโค้ดจะถูกเรนเดอร์เป็นเนื้อหาจริงที่หน้าบ้าน ในการแก้ไข คุณสามารถเลือกชอร์ตโค้ดและตรวจสอบแอตทริบิวต์ต่าง ๆ ในตัวตรวจสอบได้ หรือเพื่อการควบคุมที่ละเอียดยิ่งขึ้น คุณสามารถดับเบิลคลิกที่ชอร์ตโค้ดเพื่อแก้ไขในรูปแบบโค้ดดิบ (raw form) ได้ หลังจากทำการแก้ไขแล้ว ชอร์ตโค้ดของคุณจะอัปเดตเพื่อแสดงการเปลี่ยนแปลง
คุณสามารถคลิกและลากสิ่งใดก็ได้และย้ายไปที่ใดก็ได้ด้วย PBS เมื่อคุณลากบางสิ่ง ให้ย้ายไปไว้ด้านบนขององค์ประกอบอื่นในหน้า โดยคุณสามารถย้ายไปไว้ด้านบนหรือด้านล่างของเนื้อหาอื่น ๆ ได้
การบันทึกงานของคุณ
เมื่อคุณพอใจกับการออกแบบของคุณแล้ว เพียงคลิกที่ปุ่มบันทึกที่ด้านซ้ายบนของหน้าจอ เท่านี้ก็เรียบร้อย!
ปลั๊กอิน Lite และปลั๊กอิน Premium เป็นปลั๊กอินคนละตัวกัน ในการใช้งานฟีเจอร์พรีเมียม คุณจะต้องปิดการใช้งาน (หรือถอนการติดตั้ง) เวอร์ชัน Lite จากนั้นติดตั้งและเปิดใช้งานปลั๊กอิน Premium แล้วจึงกรอกรหัสสัญญาอนุญาตของคุณ
หมายเหตุ: หากคุณเปิดใช้งานทั้งปลั๊กอิน lite และ premium พร้อมกัน ปลั๊กอินจะแจ้งให้คุณปิดการใช้งานตัวที่คุณมีอยู่ก่อนดำเนินการต่อ
หมายเหตุสำหรับลูกค้าที่ซื้อ PBS จาก pagebuildersandwich.com: คุณยังสามารถดาวน์โหลดปลั๊กอินได้จากเว็บไซต์ และรหัสสัญญาอนุญาตปัจจุบันที่คุณมีก็ควรจะยังใช้งานได้ หากใช้งานไม่ได้ โปรดติดต่อเราและเราจะออกรหัสใหม่ให้คุณ
หลังจากที่คุณซื้อ PBS แล้ว คุณจะได้รับอีเมลที่มีสองสิ่งนี้:
ติดตั้งและเปิดใช้งานปลั๊กอินพรีเมียม จากนั้นคุณจะพบกับหน้าจอนี้:
กรอกรหัสสัญญาอนุญาตของคุณที่นี่ แล้วคลิกที่ Agree & Activate License ตอนนี้ฟีเจอร์พรีเมียมจะพร้อมใช้งานแล้ว
หรือคุณสามารถไปที่หน้าปลั๊กอินของคุณ แล้วค้นหาปลั๊กอิน Page Builder Sandwich ในรายการ:
คลิกที่ลิงก์ Activate License แล้วคุณจะสามารถใส่รหัสสัญญาอนุญาตของคุณได้จากตรงนั้น
คุณสามารถแก้ไขได้เฉพาะหน้าเดี่ยว (single pages) หรือโพสต์เดี่ยว (posts) เท่านั้นโดยใช้ Page Builder Sandwich ลองคิดในแง่นี้ หากมีส่วน “สร้างโพสต์ใหม่” (New Post) พร้อมตัวแก้ไขเนื้อหาในส่วนหลังบ้านสำหรับสิ่งนั้น คุณก็จะสามารถแก้ไขสิ่งนั้นได้ด้วย Page Builder Sandwich
คุณควรจะสามารถแก้ไขเนื้อหาของ Custom Post Type ใดๆ ก็ตามได้
เราได้ตรวจสอบให้แน่ใจว่า Page Builder Sandwich แทบจะไม่มีผลกระทบต่อประสิทธิภาพเว็บไซต์ของคุณ เมื่อออกจากระบบแล้ว อย่างน้อยที่สุดจะมีเพียงสไตล์ CSS ของแถวและคอลัมน์เท่านั้นที่ถูกนำเข้าสู่คิว (enqueue) พร้อมกับสคริปต์ JS และ CSS ที่จำเป็นสำหรับชอร์ตโค้ดที่คุณใช้งานเท่านั้น
สำหรับผู้เยี่ยมชมเว็บไซต์ของคุณ อย่างน้อยที่สุดจะมีเพียงสไตล์ CSS ของแถวและคอลัมน์เท่านั้นที่ถูกนำเข้าสู่คิว พร้อมกับสคริปต์ JS และ CSS ที่จำเป็นสำหรับชอร์ตโค้ดที่คุณใช้งานเท่านั้นที่ถูกรวมไว้
เพื่อช่วยให้คุณทำงานได้เร็วยิ่งขึ้น คุณสามารถใช้แป้นพิมพ์ลัดต่างๆ ที่มีอยู่ใน Page Builder Sandwich
แป้นพิมพ์ลัดเหล่านี้เป็นคำสั่งที่ไม่เกี่ยวกับการจัดรูปแบบ/เครื่องมือ สำหรับแป้นพิมพ์ลัดในการจัดรูปแบบ/เครื่องมือ ให้เลื่อนเมาส์ไปวางเหนือปุ่มต่างๆ บนแถบจัดรูปแบบข้อความเพื่อดูชุดแป้นพิมพ์ลัดของปุ่มนั้นๆ
| แป้นพิมพ์ลัด | คำอธิบาย |
| CTRL+E (ขณะไม่ได้แก้ไข) | เริ่มแก้ไข |
| CTRL+SHIFT+R (ขณะแก้ไข) | รีเฟรชหน้า (เนื่องจากใช้ CTRL+R สำหรับจัดชิดขวา) |
| CTRL+S | บันทึกการเปลี่ยนแปลง |
| CTRL+ESC | ละทิ้งการเปลี่ยนแปลงและหยุดการแก้ไข |
| CTRL+C | คัดลอก |
| CTRL+V | วาง |
| CTRL+X | ตัด |
| CTRL+ENTER | ขึ้นบรรทัดใหม่ |
| CTRL+Z | เลิกทำ |
| CTRL+SHIFT+Z (Mac) CTRL+Y (PC) |
ทำซ้ำ |
เมื่อเร็วๆ นี้ เราได้เพิ่มการแก้ไขเกี่ยวกับปัญหาความเข้ากันได้เมื่อเปิดใช้งานปลั๊กอิน Page Builder Sandwich และ IMPress for IDX Broker พร้อมกัน ซึ่งทำให้เกิดการขัดข้องที่ส่วนหน้าเว็บไซต์สำหรับผู้ใช้ที่เข้าสู่ระบบ
การแก้ไขนี้ทำให้ PBS กลับมาใช้งานได้อีกครั้ง แต่เราจำเป็นต้องนำความสามารถในการแทรกวิดเจ็ต IDX Broker ลงในตัวแก้ไขออก ถึงกระนั้น วิดเจ็ต IDX Broker ก็ยังคงสามารถใช้งานได้ในเมนู Appearance > Widgets ของคุณ