ในบทความนี้จะพูดถึงวิธีสร้างปุ่ม (Button) ในบทความของ WordPress 5.0 Gutenberg ค่ะ สำหรับท่านที่เพิ่งเข้ามาอ่านบทความนี้ และยังไม่คุ้นเคยกับการใช้งาน WordPress เวอร์ชั่น 5.0 ขึ้นไป มลขอแนะนำให้ท่านอ่านบทความ การสร้างบทความสำหรับผู้เริ่มต้นใช้ WordPress นี้ก่อนค่ะ

วิธีสร้างปุ่ม (Button)

1. คลิกที่ปุ่ม Add block ดังรูป

2. จากนั้นพิมพ์คำว่า button ในช่อง “Search for a block” ดังรูป
** สำหรับท่านที่ใช้เว็บรูปแบบภาษาไทย ให้พิมพ์ว่า ปุ่ม ในช่อง “ค้นหาบล็อก” ค่ะ

3. ระบบจะแสดงบล็อกชื่อ button ขึ้นมา ให้คลิกที่ บล็อก button ดังรูป

4. บล็อก button จะมีหน้าตาดังรูปด้านล่างค่ะ
โดยตัวบล็อกจะมีช่อง 2 ช่อง ได้แก่

• ช่องกรอกข้อความในปุ่ม เช่น อ่านต่อ, ดูทั้งหมด เป็นต้น
• ช่องกรอกลิงก์ โดยกรอกลิงก์ที่ต้องการให้แสดงหลังจากมีการคลิกที่ปุ่ม เช่น ในหน้าข่าวสาร เมื่อคลิกที่ปุ่ม “ดูข่าวทั้งหมด” ก็จะแสดงลิงก์หน้าข่าวทั้งหมด เป็นต้น

5. ในที่นี้ จะทดลองสร้างปุ่ม ชื่อปุ่ม “ดูข่าวทั้งหมด” ดังรูปด้านล่าง

6. สามารถกำหนดสีปุ่ม และสีข้อความ ได้ที่แถบ Color Settings ดังรูป
ในที่นี้ กำหนดให้ ปุ่มเป็นสีฟ้า และ ข้อความเป็นสีขาว

7. กำหนดรูปแบบปุ่มได้ที่แถบ Styles ดังรูป
ในที่นี้ กำหนดให้ ปุ่มเป็นแบบ Fill

8. สามารถกำหนดความโค้งของหัวมุมของปุ่มได้ที่แถบ Border Settings ดังรูป
ในที่นี้ กำหนดค่าความโค้งเป็น 8

9. กำหนดการแสดงผลหลังจากคลิกปุ่มได้ที่แถบ Link settings โดยหากต้องการให้คลิกปุ่มแล้วเปิดแท็บใหม่ ให้เราคลิกที่ปุมหน้าข้อความ “Open in new tab” ดังรูป
ตัวอย่างในที่นี้ กำหนดให้คลิกแล้วเปิดในหน้าเดิม ดังรูป