คู่มือการปรับแต่ง Gutenberg Blocks
เผยแพร่แล้ว: 2022-11-08ในกรณีที่คุณไปงานปาร์ตี้ WordPress ช้า บล็อกจะอยู่ ใน รูปแบบ .
WordPress ยังคงพัฒนาและปรับปรุงประสบการณ์การใช้งาน Gutenberg อย่างต่อเนื่อง ซึ่งทำให้นักพัฒนาหลายคนถามว่าควรสร้าง Gutenberg Blocks แบบกำหนดเองหรือไม่
ในโพสต์นี้ เราจะพิจารณาว่าบล็อกแบบกำหนดเองทำงานอย่างไร เมื่อใดควรใช้ ตัวเลือกอื่นสำหรับสร้างเว็บไซต์ของคุณ และวิธีสร้างบล็อก Gutenberg
Custom Gutenberg Blocks คืออะไร?
บล็อกเป็นหน่วยพื้นฐานสำหรับการสร้างเพจและโพสต์ใน WordPress WordPress เปิดตัวบล็อกด้วยประสบการณ์การแก้ไข Gutenberg ในปี 2018 WordPress มีบล็อกประเภทเนื้อหาเริ่มต้นมากมาย รวมถึงชื่อโพสต์ รูปภาพ และแกลเลอรี่ นอกจากนี้ ปลั๊กอินยังเพิ่มบล็อกของตัวเองให้กับประสบการณ์การแก้ไขของคุณ ตัวอย่างเช่น WooCommerce รุ่นล่าสุดบางรุ่นได้แนะนำบล็อกใหม่เพื่อให้ง่ายต่อการเพิ่มผลิตภัณฑ์และฟังก์ชันอีคอมเมิร์ซไปยังหน้าหรือโพสต์ใดๆ ใน WordPress
การสร้างบล็อก Gutenberg แบบกำหนดเองทำให้คุณสามารถใช้บล็อกนั้นในหน้าใดก็ได้หรือโพสต์บนไซต์ของคุณ ตัวอย่างเช่น คุณสามารถสร้างบล็อกที่ดึงและแสดงคำรับรองจากลูกค้า
หากคุณไม่เต็มใจที่จะโอบรับบล็อกอย่างเต็มที่ ถือว่าคุณพลาด ฟีเจอร์ล่าสุดของ WordPress ทั้งหมดมุ่งเน้นไปที่การปรับปรุงประสบการณ์ตัวแก้ไขบล็อก คุณจะต้องใช้บล็อกเพื่อใช้ประโยชน์จากคุณลักษณะต่างๆ ของ WordPress ล่าสุดและที่กำลังจะมี ขึ้น
ดาวน์โหลด e-book ของเราเกี่ยวกับการเริ่มต้นแก้ไขไซต์แบบเต็ม เพื่อเรียนรู้เพิ่มเติมเกี่ยวกับวิธีที่คุณสามารถใช้บล็อกเพื่อสร้างและแก้ไขไซต์ทั้งหมดของคุณ
เมื่อใดควรใช้บล็อก Gutenberg แบบกำหนดเอง
คุณสามารถสร้างบล็อก Gutenberg แบบกำหนดเองได้เมื่อตัวเลือกบล็อกที่มีอยู่ไม่ตรงกับความต้องการของคุณและคุณไม่สามารถหาทางเลือกอื่นที่ใช้ได้กับปลั๊กอินหรือธีมของคุณ
การสร้างบล็อก Gutenberg แบบกำหนดเองนั้นไม่ใช่โครงการที่เป็นมิตรสำหรับผู้เริ่มต้น สาเหตุที่พบบ่อยที่สุดสองประการในการเขียนโค้ดบล็อก Gutenberg ที่คุณกำหนดเองคือเมื่อคุณกำลังพัฒนาปลั๊กอินหรือสร้างธีมของคุณเอง
การสร้างบล็อกไม่ใช่โครงการที่คนส่วนใหญ่ทำสำหรับเว็บไซต์เดียว เว้นแต่จะเป็นโครงการระดับองค์กรที่มีนักพัฒนาหรือทีมพัฒนาโดยเฉพาะ เรากำลังแบ่งปันวิธีการอื่นที่อาจทำงานได้ดีขึ้นหากคุณต้องการบล็อกแบบกำหนดเองสำหรับไซต์เดียวเท่านั้น
ทางเลือกอื่นในการใช้ Custom Gutenberg Blocks
ก่อนที่คุณจะทำงานทั้งหมดเพื่อค้นหาบล็อกที่กำหนดเอง ให้พิจารณาว่าทางเลือกใดทางเลือกหนึ่งเหล่านี้อาจเหมาะกับคุณ
รูปแบบบล็อกหรือบล็อกที่นำกลับมาใช้ใหม่
หากคุณไม่ต้องการดึงเนื้อหาแบบไดนามิกและต้องการเพียงแค่บล็อกเพื่อจำลองเค้าโครง ให้ใช้ คุณลักษณะรูปแบบบล็อก ใหม่หรือบล็อกที่นำกลับมาใช้ใหม่แทน ตัวเลือกนี้เป็นมิตรกับผู้เริ่มต้นและสามารถเขียนโค้ดได้เพียงเล็กน้อยหรือไม่มีเลย
รูปแบบเป็นเหมือนแม่แบบขนาดเล็กที่คุณสามารถใช้ได้ทุกที่บนไซต์ของคุณ คุณสามารถแทรกลงในหน้าแล้วแก้ไขได้ บล็อกที่นำกลับมาใช้ใหม่ได้ทำงานในลักษณะเดียวกัน ความแตกต่างที่สำคัญคือวิธีการปฏิบัติหลังจากที่คุณใช้บนเพจหรือโพสต์
รูปแบบเป็นจุดเริ่มต้น เมื่ออยู่บนหน้าแล้ว การแก้ไขใดๆ ที่คุณทำจะไม่ซ้ำกับหน้านั้น หากคุณเปลี่ยนรูปแบบในภายหลัง จะไม่เปลี่ยนที่ที่มีการใช้งานอยู่แล้ว
บล็อกที่นำกลับมาใช้ใหม่ยังคงเชื่อมโยงถึงกัน หากคุณอัปเดตบล็อก การเปลี่ยนแปลงจะมีผลกับทุกสถานที่ที่คุณใช้บล็อกนั้น
โค้ดบล็อค
ใช้บล็อคโค้ดเพื่อแทรกโค้ดที่กำหนดเองลงในเพจ ผู้พัฒนาธีมและปลั๊กอินสร้างบล็อกที่กำหนดเองเพื่อใช้ในหลายไซต์ หากคุณกำลังทำงานในไซต์เดียว คุณอาจบรรลุเป้าหมายเดียวกันได้ในเวลาอันสั้นโดยการเพิ่มข้อมูลโค้ดที่กำหนดเอง ทั้งสองตัวเลือกต้องการความเชี่ยวชาญด้านเทคนิคในระดับเดียวกัน
กรณีหนึ่งที่อาจคุ้มค่าที่จะพิจารณาสร้างบล็อกแบบกำหนดเองของคุณคือถ้าคุณเป็นนักพัฒนาที่ต้องการเปลี่ยนไซต์ให้กับลูกค้า ลูกค้าอาจสามารถทำงานกับบล็อกที่คุณกำหนดเองได้โดยใช้ตัวแก้ไข Gutenberg แต่จะสูญเสียความพยายามทั้งหมดในการพยายามแก้ไขโค้ดของคุณ
วิธีสร้างบล็อก Gutenberg แบบกำหนดเอง
คุณมีสองตัวเลือกสำหรับการสร้างบล็อก Gutenberg แบบกำหนดเอง คุณสามารถเขียนโค้ดได้เองหรือใช้ปลั๊กอินสำหรับสร้างบล็อก ทั้งสองตัวเลือกต้องมีการเข้ารหัส คุณจะต้องศึกษาข้อมูลพื้นฐานเกี่ยวกับการพัฒนาเว็บก่อนที่จะลองใช้งาน
การเข้ารหัสด้วยตัวคุณเอง
การสร้างบล็อกที่กำหนดเองต้องใช้ประสบการณ์ในการพัฒนา หากคุณชอบที่จะยึดติดกับบรรณาธิการของ WYSIWIG และหัวใจของคุณเต้นแรงทุกครั้งที่คุณคลิกตัวเลือกรหัสการแสดงโดยไม่ตั้งใจ วิธีนี้ไม่เหมาะสำหรับคุณ
การสร้างบล็อกที่กำหนดเองต้องใช้ความรู้ระดับกลางเกี่ยวกับ HTML, CSS, JavaScript และ React
เริ่มต้นด้วยการตั้งค่าสภาพแวดล้อมการพัฒนาและเครื่องมือของคุณ คุณจะต้องมีสภาพแวดล้อม WordPress, Node, NPM และโปรแกรมแก้ไขโค้ด หลังจากนั้น ให้ทำตาม บทช่วยสอนนี้เกี่ยวกับการสร้างบล็อกแรกของคุณ จากคู่มือตัวแก้ไขบล็อก WordPress อย่างเป็นทางการ
การใช้ปลั๊กอิน
หากคุณคุ้นเคยกับ HTML, CSS และ JavaScript แต่ยังไม่พร้อมที่จะเขียนโค้ดทุกอย่างตั้งแต่เริ่มต้น ให้พิจารณาแนวทางของปลั๊กอิน การใช้ปลั๊กอินเพื่อสร้างบล็อกแบบกำหนดเองเป็นตัวเลือกที่ดีเมื่อคุณต้องการบล็อกแบบกำหนดเองเพื่อใช้ในเว็บไซต์เดียว
ปลั๊กอิน Genesis Custom Blocks เป็นปลั๊กอิน ยอดนิยมสำหรับการสร้างบล็อกที่กำหนดเอง คุณจะสร้างช่องบล็อกโดยใช้อินเทอร์เฟซ WordPress ที่คุ้นเคย หลังจากตั้งค่าฟิลด์ คุณจะต้องจัดหาเทมเพลต HTML, CSS, JavaScript และ PHP เพื่อให้บล็อกทำงานได้
แม้ว่าจะง่ายกว่า แต่ก็ยังต้องมีการเข้ารหัสอยู่บ้าง ความแตกต่างคือคุณสามารถทำได้ทั้งหมดจากผู้ดูแลระบบ WordPress โดยไม่ต้องตั้งค่าสภาพแวดล้อม dev ในพื้นที่ ปลั๊กอินยังช่วยให้ทดสอบและดูตัวอย่างบล็อกได้ง่ายขึ้นเพื่อให้แน่ใจว่าทำงานได้อย่างถูกต้อง
ไม่ว่าคุณกำลังสร้างอะไร เราช่วยคุณได้
ไม่ว่าคุณจะสร้างไซต์ด้วยวิธีใด ด้วยบล็อกแบบกำหนดเอง หรือหากคุณยังคงใช้ตัวแก้ไขแบบคลาสสิกอยู่ คุณก็ต้องมีโฮสต์ที่เชื่อถือได้ Pressable มีความภูมิใจที่เป็นสถานที่ที่ WordPress ทำงานได้ดีที่สุดสำหรับทุกคน ตั้งแต่ Solopreneur ไปจนถึงทีมนักพัฒนาขั้นสูง
Pressable นำเสนออินเทอร์เฟซที่ใช้งานง่าย การรักษาความปลอดภัยระดับแนวหน้า และความเร็วที่รวดเร็ว ด้วยการโฮสต์ของ Pressable เว็บไซต์ของคุณจะอัปเดตได้ง่ายและง่ายสำหรับลูกค้าของคุณในการค้นหาและใช้งาน
ลงทะเบียน วันนี้และเริ่มสร้างไซต์ของคุณหรือเรียนรู้เพิ่มเติมเกี่ยวกับการถ่ายโอนไซต์ที่มีอยู่ เรายินดีที่จะช่วยคุณย้ายข้อมูลไซต์ของคุณ!