วิธีเพิ่มปุ่มใน WordPress: ปรับปรุงปุ่ม WordPress ของคุณด้วย PostX

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

ใช้ขั้นตอนต่อไปนี้เพื่อใช้ปุ่มใน WordPress

• ติดตั้ง PostX
• เพิ่มบล็อกปุ่ม PostX
• เพิ่มลิงค์ในปุ่ม WordPress
• ปรับแต่งบล็อคปุ่ม

วันนี้เราจะมาดูไฮไลท์ของบล็อกปุ่ม PostX วิธีเพิ่มปุ่มใน WordPress โดยใช้ PostX เริ่มกันเลยดีกว่า

วิธีเพิ่มปุ่มใน WordPress

ตอนนี้ เราจะอธิบายวิธีเพิ่มปุ่มไปยังเว็บไซต์ WordPress ทำตามคำแนะนำทีละขั้นตอนนี้ และคุณสามารถเพิ่มปุ่ม WordPress ที่สมบูรณ์แบบในเว็บไซต์ของคุณ

วิดีโอสอน

นี่คือวิดีโอสอนการเพิ่มปุ่ม WordPress ในเว็บไซต์ของคุณ

ขั้นตอนที่ 1: ติดตั้ง PostX

หากต้องการปลดล็อกคุณสมบัติอันทรงพลังของ PostX และใช้ประโยชน์จากคุณสมบัติต่างๆ คุณต้องติดตั้งปลั๊กอิน

ในการติดตั้งและเปิดใช้งานปลั๊กอิน PostX Gutenberg Blocks:

1. ไปที่ปลั๊กอิน → เพิ่มใหม่
2. ค้นหา “PostX”
3. คลิก ติดตั้ง จากนั้น เปิดใช้งาน

รับ PostX Pro เพื่อปลดล็อกคุณสมบัติที่น่าตื่นเต้นและสร้างเว็บไซต์ที่น่าทึ่ง !

ตอนนี้คุณพร้อมที่จะปรับปรุงเว็บไซต์ของคุณด้วยปุ่ม WordPress แล้ว

ขั้นตอนที่ 2: เพิ่มบล็อกปุ่ม PostX

เราได้ติดตั้ง PostX เรียบร้อยแล้ว และตอนนี้ปุ่มพร้อมใช้งานพร้อมกับการปรับแต่งเพิ่มเติม เพื่อไม่ให้เป็นการเสียเวลา เรามาแสดงวิธีเพิ่มปุ่มใน WordPress กันดีกว่า

ก่อนอื่นคุณต้องไปที่หน้า คุณสามารถไปที่ตัวเลือกหน้า WordPress แล้วคลิกเพิ่มใหม่เพื่อสร้างหน้าใหม่ จากนั้น ค้นหา “กลุ่มปุ่ม” เพื่อเลือกบล็อกนี้ และนี่จะเพิ่มปุ่ม WordPress ลงในหน้า

ขั้นตอนที่ 3: เพิ่มลิงก์ในปุ่ม WordPress

การเชื่อมโยงหลายมิติของปุ่ม หรือพูดง่ายๆ การเพิ่มลิงก์ในปุ่ม WordPress นั้นเป็นเรื่องง่าย

คุณต้องเลือกปุ่มก่อน แล้วเลือกข้อความที่คุณต้องการเชื่อมโยงหลายมิติ ตอนนี้ คุณจะเห็นคำแนะนำเครื่องมือ WordPress เริ่มต้น จากคำแนะนำเครื่องมือ คุณจะเห็นตัวเลือก “ลิงก์” พร้อมไอคอนไฮเปอร์ลิงก์ เพียงคลิกเพื่อเปิดช่อง URL จากนั้นเพิ่มลิงก์ที่คุณต้องการเพื่อเพิ่มลิงก์ในปุ่ม

ขั้นตอนที่ 4: ปรับแต่งบล็อกปุ่ม

เมื่อคุณเลือกบล็อกแล้ว คุณจะเห็นตัวเลือกการปรับแต่งทั้งหมดในแถบด้านข้างขวา

มีการตั้งค่าสองประเภทสำหรับบล็อกนี้ เนื่องจากคุณสามารถเพิ่มปุ่มได้หลายปุ่ม บล็อกนี้มีการตั้งค่าแยกต่างหากสำหรับ "ปุ่ม" และ "กลุ่มปุ่ม"

เราจะแสดงตัวเลือกการปรับแต่งทั้งหมดและวิธีการใช้งาน

การตั้งค่าการปรับแต่งสำหรับปุ่มเดียว

หากต้องการเลือกและเปิดการตั้งค่าสำหรับปุ่ม คุณต้องคลิกที่ปุ่ม

สไตล์

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

ขนาดปุ่ม

ตัวเลือกถัดไปที่คุณจะได้รับคือการเปลี่ยนขนาดปุ่ม คุณจะได้รับ Small, Medium, Large, Extra Large และ Custom ตามค่าเริ่มต้น คุณจะได้ขนาดปุ่มที่ตั้งไว้ล่วงหน้าหากคุณเลือกตัวเลือกขนาดเล็ก กลาง ใหญ่ หรือใหญ่พิเศษ

แต่ถ้าคุณต้องการปรับแต่งขนาดของปุ่มทั้งหมด คุณสามารถทำได้โดยเลือก "กำหนดเอง" และปรับด้านบน ขวา ล่าง และซ้ายเพื่อตั้งค่าการวัดแนวนอนและแนวตั้ง

นี่คือภาพรวมของรูปแบบปุ่มต่างๆ

ข้อความ

จากนั้น คุณจะได้รับการตั้งค่าข้อความ สิ่งนี้จะช่วยให้คุณปรับแต่งข้อความของปุ่มตามความต้องการของคุณ คุณจะเห็นการตั้งค่าสำหรับ “Text Typography” “Text Color” และ “Text Hover Color”

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

นี่คือมุมมองภาพของเอฟเฟ็กต์โฮเวอร์

พื้นหลัง

การตั้งค่านี้จะช่วยให้คุณปรับแต่งพื้นหลังทั้งหมดของบล็อกปุ่มนี้ได้

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

จากนั้นคุณสามารถเปลี่ยนสีปุ่มได้ทั้งแบบทึบและแบบไล่ระดับสี คลิกที่แต่ละรายการเพื่อเปิดจานสี

หลังจากนั้น คุณสามารถปรับเส้นขอบของปุ่มนี้ได้ การตั้งค่านี้รวมถึงรูปแบบเส้นขอบ (รูปแบบสำเร็จรูป 3 รูปแบบ) ความกว้างของเส้นขอบ และสี

และปรับรัศมีเส้นขอบของปุ่มที่เลือก

นอกจากนี้ คุณจะได้รับการตั้งค่า Box Shadow การขยายจะช่วยให้คุณสามารถปรับ "Offset-X" "Offset-Y" "Blur" และ "Spread"

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

ไอคอน

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

มีปุ่มสำหรับเปลี่ยนไอคอนจากข้อความก่อนไปหลัง

คุณสามารถเปลี่ยนขนาดไอคอนและปรับช่องว่างระหว่างไอคอนและข้อความได้

และยังสามารถเปลี่ยนสี Icon ได้ทั้งแบบปกติและแบบโฮเวอร์ คุณต้องคลิกที่การปรับแต่งสีของไอคอนเพื่อเปิดจานสี

การตั้งค่าการปรับแต่งสำหรับกลุ่มปุ่ม (หลายปุ่ม)

หากต้องการเลือกกลุ่มปุ่ม คุณจะเห็นไอคอน "เลือกกลุ่มปุ่ม" ในคำแนะนำเครื่องมือ WordPress เริ่มต้น

ช่องว่างของปุ่ม

หลังจากเลือกกลุ่มปุ่มแล้ว คุณจะพบการตั้งค่าช่องว่างของปุ่ม การตั้งค่านี้ช่วยในการกำหนดช่องว่างระหว่าง 2 ปุ่มขึ้นไป

การจัดตำแหน่งแนวนอนและแนวตั้ง

ที่นี่ คุณสามารถปรับการจัดตำแหน่งแนวนอนและแนวตั้งของปุ่มหลายปุ่มได้

คุณยังสามารถสลับการจัดตำแหน่งแนวตั้งเพื่อตั้งค่าปุ่มในแนวตั้ง

ระยะขอบ

คุณยังสามารถปรับระยะขอบของกลุ่มปุ่มทั้งหมดได้จากการตั้งค่านี้

นิเมชั่นปุ่ม

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

นี่คือภาพแอนิเมชั่นของปุ่ม

และนั่นคือทั้งหมดที่คุณจะได้รับจากบล็อกปุ่ม WordPress ตอนนี้คุณรู้วิธีเพิ่มปุ่ม WordPress ด้วย PostX แล้ว

รับ PostX Pro เพื่อปลดล็อกคุณสมบัติที่น่าตื่นเต้นและสร้างเว็บไซต์ที่น่าทึ่ง !

บทสรุป

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

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

คุณสามารถดูบทแนะนำวิดีโอ WordPress ในช่อง YouTube ของเรา นอกจากนี้ พบกับเราบน Facebook และ Twitter เพื่อรับการอัปเดตเป็นประจำ!