วิธีการสร้างรูปแบบบล็อกเพื่อเพิ่มความเร็วในการสร้างเว็บไซต์

รูปแบบบล็อกจะเป็นเรื่องใหญ่สำหรับผู้ใช้ WordPress และในโพสต์นี้ฉันจะแสดงวิธีสร้างรูปแบบบล็อกของคุณเอง.


add_action ('init', ฟังก์ชัน () {

register_pattern ('NAME', [
'title' => __ ('TITLE'),
'เนื้อหา' =>
'รูปแบบ'
]);
});

สองวันที่ผ่านมาฉันออกมาพร้อมกับวิดีโอและฉันแนะนำแนวคิดนี้ที่มาใกล้ ๆ กับ WordPress เรียกว่ารูปแบบบล็อก ตอนนี้เป็นการทดลองแล้วและมันเป็นสิ่งที่ฉันตื่นเต้นจริงๆ และฉันคิดว่าถ้าคุณตั้งใจฟังสิ่งที่มีอยู่ในบล็อกรูปแบบนั้นคุณก็จะเห็นศักยภาพของมันที่จะช่วยให้คุณส่งมอบเว็บไซต์ได้เร็วขึ้นถ้าคุณมีลูกค้าเพื่อให้พวกเขาสามารถทำสิ่งต่าง ๆ ได้มากขึ้น เว็บไซต์.

ดังนั้นฉันจะแสดงให้คุณ วิธีสร้างรูปแบบบล็อกในวิดีโอนี้ ตอนนี้เรากำลังจะทำบางสิ่งที่อยู่ด้านเทคนิคเล็กน้อยและฉันรู้ว่านี่คือช่องทางของ WordPress สำหรับผู้ที่ไม่ใช้เทคโนโลยีดังนั้นฉันจะพยายามทำให้มันง่ายที่สุด แต่คุณ จะเห็นจริงในตอนท้ายว่ามันง่ายแค่ไหนในการสร้างหนึ่งในรูปแบบบล็อกเหล่านี้.

ดังนั้นเราจะไปข้างหน้าและดูมัน ดังนั้นนี่คือหน้าเว็บที่พูดถึงคุณลักษณะใหม่ในการสร้าง สามารถเป็นเพียงคนทั่วไปในการสร้างรูปแบบบล็อก ดังนั้นเมื่อฉันเลื่อนลงมันให้ประเภทของเทมเพลตสำหรับมัน ดังนั้นสิ่งที่เกี่ยวข้องทั้งหมดคือการสร้างสิ่งที่เรียกว่าฟังก์ชันที่กำหนดเอง.

แต่ไม่ต้องกังวลฉันจะทำให้ทุกคนทำง่ายสุด ๆ แต่นี่คือที่มาของรหัสขนาดเล็ก ตอนนี้ฉันจะมีลิงก์ในคำอธิบายวิดีโอด้านล่าง มันจะนำคุณไปสู่เว็บไซต์ของฉัน คุณจะได้รับคำแนะนำเป็นลายลักษณ์อักษรเกี่ยวกับวิธีการทำเช่นนี้เช่นกัน ตัวอย่างรหัสขนาดเล็กนี้ที่คุณสามารถคัดลอกและวางลงบนเว็บไซต์ของคุณเอง.

โอเคนี่คือสิ่งที่เราต้องการ นี่เป็นคุณลักษณะใหม่ของ Gutenberg และคุณจะต้องติดตั้งปลั๊กอิน Gutenberg เพื่อเปิดใช้งานดังนั้นคุณจะต้องใช้เวอร์ชันขั้นต่ำ 7.8 และนี่คือสิ่งที่เพิ่งออกมา ตอนนี้สิ่งที่จะเกิดขึ้นอาจจะอยู่ในสี่ถึงหกเดือนบางทีในช่วงปลายฤดูร้อนปี 2020 นี้จะรวมอยู่ใน WordPress โดยค่าเริ่มต้น แต่สำหรับตอนนี้คุณจะต้องถ้าคุณต้องการลอง คุณจะต้องติดตั้งปลั๊กอิน Gutenberg.

สิ่งต่อไปที่คุณสามารถทำได้และนี่เป็นทางเลือกถ้าคุณไม่รู้วิธีเพิ่มฟังก์ชั่นที่กำหนดเองในธีมลูกและฉันไม่ได้ใช้ธีมลูกอีกต่อไปคุณอาจต้องการใช้ปลั๊กอินฟรีนี้ และนี่คือหนึ่งในปลั๊กอินฟรีที่ดีที่สุด ที่ฉันเคยเจอและมันเรียกว่าตัวอย่างโค้ด และนี่จะช่วยให้เราสามารถเพิ่มฟังก์ชั่นที่กำหนดเองนี้และลักษณะที่ใช้งานง่ายและง่ายต่อการจัดการ.

ตกลง? ดังนั้นคุณจะต้องการมัน และนี่เป็นทางเลือก นี่เป็นปลั๊กอินฟรีที่เรียกว่า cadence blocks และสิ่งนี้ก็คือมันเพิ่มฟังก์ชั่นการสร้างหน้าจำนวนมากให้กับกูเทนแบร์ก มันค่อนข้างเรียบร้อยในสิ่งที่อนุญาตให้คุณทำ คุณสามารถลากและปรับขนาดคอลัมน์ มีองค์ประกอบหลายอย่างที่เพิ่มฟังก์ชั่นการสร้างหน้า แต่สำหรับกูเทนแบร์กและเป็นปลั๊กอินที่สมบูรณ์ฟรี.

ตกลง. ตอนนี้เรามาข้ามไปยังเว็บไซต์ของฉัน ดังนั้นนี่คือเว็บไซต์ ทุกอย่างพร้อมแล้ว และถ้าคุณไม่รู้วิธีติดตั้งปลั๊กอินมีบางคนโกรธฉันจริง ๆ เมื่อวันก่อนโดยไม่แสดงวิธีติดตั้งปลั๊กอินและวิดีโอ คุณไปที่ปลั๊กอินคุณคลิกที่เพิ่มใหม่จากนั้นที่นี่คุณทำการค้นหาชื่อของปลั๊กอินนั้นแล้วคุณคลิก.

ดาวน์โหลดหรือฉันขอโทษคุณคลิกติดตั้งตอนนี้จากนั้นเปิดใช้งาน มันเป็นกระบวนการที่ง่ายมาก ดังนั้นฉันจะคลิกที่ปลั๊กอินที่ติดตั้งของฉันและคุณสามารถเห็นฉันมี Gutenberg ติดตั้งและนี่คือบล็อกจังหวะการเลือกและนี่คือตัวอย่างรหัส ดังนั้นฉันจะไปข้างหน้าและเปิดใช้งานตัวอย่างรหัสและคุณสามารถดูได้ว่าตอนนี้เปิดใช้งานได้ที่นี่.

ดังนั้นไปข้างหน้าและคลิกที่ตัวอย่างรหัสและคุณจะเห็นบางอย่างที่มาพร้อมกับ และนี่คือสวิตช์สลับและสลับเป็น พวกเขาทั้งหมดถูกสลับเป็นปิดและคุณไม่จำเป็นต้องเก็บไว้ตามค่าเริ่มต้น คุณสามารถคลิกได้ที่นี่และคุณสามารถลบได้ทั้งหมด แต่ฉันได้ไปข้างหน้าแล้วและเพิ่มที่นี่ที่เรียกว่าเทมเพลตรูปแบบบล็อก.

ดังนั้นสิ่งที่คุณจะทำ คลิกที่เพิ่มใหม่และคุณสามารถตั้งชื่อเทมเพลตรูปแบบบล็อกนี้ในโค้ดตัวอย่างเล็ก ๆ น้อย ๆ ที่ฉันแสดงให้คุณเห็นว่าอยู่ที่นี่ แต่ฉันจะให้รุ่นที่ดัดแปลงนี้ในเว็บไซต์ของฉัน คุณเพิ่งจะคัดลอกและวางที่นี่แล้วคุณจะคลิกที่บันทึกการเปลี่ยนแปลง.

คุณจะไม่คลิกที่บันทึกและเปิดใช้งานคุณจะคลิกเพื่อบันทึกการเปลี่ยนแปลงและฉันจะแสดงให้คุณเห็นว่าทำไมในอีกสักครู่ ตกลง. ตอนนี้สิ่งที่คุณต้องการทำคือสร้างรูปแบบบล็อกนี้ และรูปแบบบล็อกเป็นเพียงส่วนที่บันทึกไว้ ดังนั้นหากคุณใช้เครื่องมือสร้างหน้าเว็บตอนนี้คุณรู้แล้วว่าคุณสามารถบันทึกส่วนและบางส่วนมาพร้อมกับส่วนที่ออกแบบไว้ล่วงหน้า แต่ประสบการณ์ของผู้ใช้ฉันคิดว่าดีกว่าในกูเทนแบร์ก.

ดังนั้นสิ่งที่คุณต้องการทำคือไปที่หน้า และคลิกที่เพิ่มใหม่และคุณจะต้องตั้งชื่อนี้ อืมจริงให้ฉันกำจัดทัวร์นี้ คุณจะต้องการตั้งชื่อรูปแบบบล็อกนี้และนี่คือที่เราจะสร้างรูปแบบบล็อกนี้ ตอนนี้ฉันจะไม่ผ่านการสร้างรูปแบบบล็อกในขณะนี้.

ฉันจะแสดงให้คุณเห็นสิ่งที่ฉันได้สร้างไว้แล้วและมัน ที่นี่. นี่คือรูปแบบบล็อกที่ฉันสร้างขึ้น คุณสามารถดูได้ในส่วนนี้ มันมีพื้นหลังที่มีสีสันนี้ ฉันมีหัวเรื่องหัวเรื่องย่อยและปุ่มคู่ที่นี่และฉันใส่วิดีโอลงไปดังนั้นฉันจะสร้างรูปแบบบล็อกของฉันเพื่อที่ฉันจะได้เพียงแค่คลิกเม้าส์สองครั้งเพิ่มสิ่งนี้ลงในที่ใดก็ได้บนเว็บไซต์ของฉัน.

สิ่งที่ฉันจะทำคือคลิกที่มุมขวาบนมีจุดสามจุดนี้ มันยากที่จะมองเห็นและเมื่อคุณคลิกที่นั่นมีตัวเลือกนี้ตรงนี้ที่บอกว่าตัวแก้ไขรหัส ดังนั้นคุณจะต้องการคลิกที่ตัวแก้ไขรหัสจากนั้นมันจะแสดงรหัสทั้งหมดที่เกี่ยวข้องกับการทำบล็อกนั้นให้เป็นบล็อกรูปแบบบล็อก.

ตกลง? ดังนั้นคุณจะคลิกที่นี่แล้วคุณจะคลิกควบคุมหรือสั่ง a บนคอมพิวเตอร์ของคุณเพื่อเน้นมันทั้งหมด และพวกเขากำลังปีใหม่ วางไว้ในคลิปบอร์ดของคุณ ดังนั้นฉันจะทำมันควบคุมซีดังนั้นตอนนี้มันอยู่ในคลิปบอร์ดของฉัน ดังนั้นตอนนี้สิ่งที่ฉันจะทำคือฉันกำลังจะออกไปจากที่นี่ ที่จริงแล้วถ้าคุณต้องการออกไปจากมุมมองนี้มี X อยู่ตรงนี้ที่บอกว่าตัวแก้ไขรหัสทางออกและตอนนี้มันจะแสดงให้ฉันเห็นว่ามันปกติแล้วที่นี่.

ตกลง. ดังนั้นคุณสามารถบันทึกสิ่งนี้เป็นแบบร่างหากคุณต้องการ แต่คุณจะไม่ต้องการสิ่งนี้ นี่เป็นเพียงสำหรับคุณที่จะสร้างรูปแบบบล็อกนี้และคุณสามารถสร้างรูปแบบบล็อกที่เป็นอะไรก็ได้และมันไม่จำเป็นต้องเป็นสิ่งหนึ่งบล็อก อาจเป็นเทมเพลตทั้งหมดสำหรับโพสต์บล็อกตัวอย่างเช่น ตกลงดังนั้นตอนนี้ฉันจะคลิกที่ที่มี w มันทำให้ฉันออกจากตัวแก้ไขบล็อก.

ตอนนี้ฉันจะกลับไปที่ตัวอย่างโค้ด ตรงนี้คือที่ที่ฉันสร้างเทมเพลตบล็อกนั้น ฉันจะคลิกที่โคลนและตอนนี้มันสร้างโคลนของมันขึ้นมาแล้วฉันจะคลิกเข้าไปที่ชื่อเพื่อเริ่มแก้ไข ดังนั้นสำหรับชื่อเรื่องฉันจะเปลี่ยนเป็นชื่อที่เหมาะสมสำหรับการจัดการ.

ดังนั้นสำหรับฉันฉันแค่จะตั้งชื่อมัน ฮีโร่พร้อมวิดีโอ ดังนั้นตอนนี้ฉันรู้ว่านี่คืออะไรเมื่อฉันดูรายการในอนาคต โอเคมีบางสิ่งที่คุณจะต้องแก้ไข สามสิ่ง. มันง่ายมาก คนแรกคือชื่อ ดังนั้นนี่อาจเป็นชื่อใด ๆ ที่มันจะต้องเป็นตัวพิมพ์เล็กทั้งหมดไม่มีช่องว่างหรือตัวอักษรที่ขี้ขลาด.

ดังนั้นฉันจะไปข้างหน้าและใส่ชื่อในตอนนี้ คุณสามารถเห็นฉันตั้งชื่อฮีโร่ด้วยวิดีโอ ถัดไปที่นี่คุณจะต้องใส่ชื่อ ดังนั้นเราจึงเปลี่ยนชื่อคำนี้และนี่คือสิ่งที่จะปรากฏในคุณกำลังดูรายการรูปแบบบล็อกบล็อกไม่ใช่รูปแบบบล็อกบล็อก และถ้าคุณสังเกตเห็นคุณสามารถนี่คือชื่อที่เป็นมิตรดังนั้นจึงสามารถมีช่องว่าง.

เอ่อฉันจะไม่ใส่ตัวละครขี้ขลาดเข้าไปในนั้น ช่องว่างเป็นเรื่องปกติ นั่นคือสิ่งที่จะแสดงในรายการนี้และต่อไปที่นี่ที่ซึ่งมันบอกว่าแบบ คุณกำลังจะวางสิ่งที่คุณเพิ่งคัดลอกไว้ในคลิปบอร์ด ตอนนี้ฉันต้องการให้คุณจดบันทึกสิ่งหนึ่ง สำหรับแต่ละสิ่งเหล่านี้ ฉันทิ้งเครื่องหมายอัญประกาศเดี่ยวที่ด้านหน้าและด้านหลัง.

คุณเห็นว่ามีเครื่องหมายอะโพสโทรฟีที่ต้องอยู่ตรงนั้น หากคุณลบไฟล์นั้นโดยไม่ตั้งใจ ตกลง. เราแค่เปลี่ยน เราแค่แทนที่ตัวยึดข้อความ ดังนั้นที่นี่ฉันไม่ต้องการแทนที่ทุกอย่าง ฉันต้องการแทนที่รูปแบบคำดังนั้นฉันจะเน้นสีแล้วฉันจะวางในสิ่งที่ฉันคัดลอก.

และนั่นก็คือ ดังนั้นตอนนี้ฉันจะเลื่อนลงและคราวนี้ฉันจะคลิกที่บันทึกการเปลี่ยนแปลงและเปิดใช้งาน ดังนั้นในตอนนี้ควรบอกว่าข้อมูลโค้ดได้รับการอัปเดตและเปิดใช้งาน และเมื่อฉันคลิกตัวอย่างทั้งหมดคุณจะเห็นตอนนี้ฮีโร่ตัวหนึ่งพร้อมวิดีโอเปิดอยู่ ดังนั้นในอนาคตสำหรับรูปแบบบล็อกเพิ่มเติมฉันต้องการไปที่ที่กล่าวว่าแม่แบบรูปแบบบล็อกและคลิกที่โคลนและทำให้แม่แบบรูปแบบบล็อกนั้นแบบนั้น.

ด้วยวิธีนี้ฉันมีแม่แบบอยู่ในนั้นเสมอ ตอนนี้ถ้าคุณรู้แล้วและคุณมีวิธีการเพิ่มฟังก์ชั่นที่กำหนดเองของคุณเองคุณไม่จำเป็นต้องมีข้อมูลโค้ดและสิ่งต่าง ๆ ทั้งหมดนี้คุณสามารถวางไว้ในตำแหน่งที่คุณต้องการ นี่เป็นวิธีที่ง่ายกว่ามากในการจัดการถ้าคุณถามฉัน ตกลงดังนั้นตอนนี้ฉันจะไปที่หน้าเว็บที่ฉันคลิกที่เพิ่มใหม่และถ้าคุณต้องการที่จะเห็น.

รูปแบบบล็อก เอ่อตรงนี้คือไอคอนสำหรับมัน และเมื่อคุณวางเมาส์เหนือมันจะบอกว่ารูปแบบบล็อก และเมื่อฉันคลิกที่มันคุณจะเห็นรูปแบบบล็อกบางส่วนที่ถูกทดลองตอนนี้ แต่เมื่อคุณเลื่อนลงคุณจะเห็นรูปแบบบล็อกที่ฉันสร้างขึ้น และสิ่งที่เนี้ยบจริงๆคือมันสร้างภาพตัวอย่างขนาดย่อ.

และมันทำสิ่งนี้แบบไดนามิก คุณมีเครื่องมือสร้างหน้าเว็บที่ไม่ได้ทำสิ่งนี้ เอ่อและมันทำให้ง่ายขึ้นมากในการจัดการรูปแบบบล็อกของคุณ ดังนั้นและคุณสามารถดูได้ที่นี่มันบอกว่าฮีโร่พร้อมเทมเพลต ตอนนี้ถ้าฉันต้องการใช้ที่ใดก็ได้บนเว็บไซต์ของฉันมันเป็นการคลิกเมาส์เพียงครั้งเดียว และจากนั้นก็มี และทั้งหมดที่ฉันต้องทำ ณ จุดนั้นเพื่อเริ่มเปลี่ยนข้อความบางส่วนเปลี่ยนลิงค์ไปยังปุ่มต่างๆ.

ฉันสามารถคลิกที่นี่และเปลี่ยนวิดีโอได้ ดังนั้น. นั่นคือวิธีที่คุณสร้างรูปแบบบล็อก ตอนนี้เป็นเรื่องใหญ่ฉันคิดว่าเพราะสิ่งที่จะเกิดขึ้นคือธีม นักพัฒนาและผู้สร้างปลั๊กอินพวกเขาจะสามารถสร้างรูปแบบบล็อกเหล่านี้ให้คุณได้ดังนั้นมันจะเร็วมากเร็วขึ้นและง่ายขึ้นในการสร้างเว็บไซต์โดยใช้เครื่องมือสร้างบล็อกพื้นเมืองที่ WordPress มีอยู่แล้ว.

ไม่มีอะไรจะซื้อไม่มีการขยายโค้ด ไม่มีสิ่งเหล่านี้และ อะไรจะยิ่งดีกว่า คุณสามารถเห็นความง่ายในการสร้างรูปแบบบล็อกของคุณเองและเห็นได้ง่ายในรายการ คลิกที่ปุ่มและมันจะเข้าที่นั่น ดังนั้นตอนนี้คุณสามารถคิดได้ว่าจะสามารถสร้างเว็บไซต์ได้ง่ายขึ้นเพียงใดเมื่อคุณมีไลบรารีรูปแบบบล็อกของคุณเอง.

ดังนั้นหากคุณสร้างเว็บไซต์สำหรับลูกค้าและคุณไม่ต้องการใช้เครื่องมือสร้างหน้าเว็บ คุณเพียงต้องการใช้เครื่องมือสร้างบล็อกในตัว คุณสามารถสร้างห้องสมุดรูปแบบของคุณเอง คุณเห็นว่ามันง่ายแค่ไหน ฉันทำได้. คุณสามารถทำได้ เอ่อคุณสามารถสร้างไลบรารี่รูปแบบบล็อกของคุณเองซึ่งคุณสามารถย้ายจากไซต์หนึ่งไปยังอีกไซต์หนึ่งได้.

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

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

ดังนั้นสิ่งสุดท้ายก่อนที่เราจะสรุปนี่คือแนวคิดใหม่และเป็นสิ่งที่คิดเกี่ยวกับอีกไม่กี่เดือนข้างหน้า ทดลองกับตอนนี้ มันค่อนข้างไม่ Yeti, Yeti ยังไม่พร้อมสำหรับช่วงเวลาสำคัญเพราะถ้าคุณสังเกตเห็นอืมสิ่งที่ฉันเห็นในทางลบคือเมื่อคุณดูบล็อก ดูที่นั่นฉันไปอีกครั้ง.

หากคุณกำลังดูรูปแบบบล็อกมันเป็นเพียงรายการบทความที่สูงกว่าที่คุณต้องเลื่อนดูดังนั้นพวกเขาจำเป็นต้องปรับปรุงกระบวนการจัดหมวดหมู่และจัดระเบียบ บางทีพวกเขาอาจมีอินเทอร์เฟซบางอย่างเพื่อให้ใช้งานได้ง่ายขึ้น หากคุณจะมี 50 บล็อกที่แตกต่างกัน.

รูปแบบ ดังนั้นพวกเขาจึงต้องปรับปรุงมัน และไวยากรณ์บางส่วนของรหัสอาจเปลี่ยนไปเล็กน้อย ใครจะรู้เมื่อสิ่งนี้เกิดขึ้นในที่สุด แต่ประเด็นทั้งหมดของวิดีโอนี้ก็เพื่อแสดงให้คุณเห็นว่าอะไรจะเกิดขึ้นได้เร็ว ๆ นี้เพื่อที่คุณจะได้เริ่มต้น คิดว่ามันสามารถนำไปใช้กับเวิร์กโฟลว์ของคุณและสิ่งที่คุณทำในฐานะผู้สร้างเว็บไซต์.

อย่างไรก็ตามนั่นคือทั้งหมดที่ฉันมีให้คุณในโพสต์นี้ ฉันหวังว่าคุณจะประทับใจกับรูปลักษณ์ขั้นสูงในอนาคตของ WordPress เช่นนี้และหากคุณพอใจกับวิดีโอนี้หรือค้นหาคุณค่าลองพิจารณาใช้นิ้วโป้งและแชร์วิดีโอนี้เพื่อให้ผู้คนได้เห็นว่ามีอะไรเกิดขึ้นบ้าง.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map