คุณต้องการสร้างวิดเจ็ตที่กำหนดเองของคุณเองบน WordPress หรือไม่?

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

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

จากนั้นกลับไปที่สาเหตุที่เราอยู่ที่นี่

สร้างวิดเจ็ตแบบกำหนดเองบน wordpress

วิดเจ็ต WordPress คืออะไร?

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

ตามค่าเริ่มต้น WordPress มาพร้อมกับชุดวิดเจ็ตมาตรฐานที่คุณสามารถใช้กับธีม WordPress ใดก็ได้ 

ค้นพบด้วย ธีม WordPress พรีเมี่ยมที่ดีที่สุดของเรา.

วิดเจ็ตแดชบอร์ด Wordpress

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

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

ที่กล่าวว่ามาดูวิธีสร้างวิดเจ็ตที่คุณกำหนดเองบน WordPress

วิธีการสร้างเครื่องมือที่กำหนดเองใน WordPress

บทช่วยสอนนี้มีไว้สำหรับผู้ที่มีความรู้ในการพัฒนาเว็บ

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

คุณยังสามารถวางรหัสลงในไฟล์ "functions.php" ของธีม WordPress ของคุณ อย่างไรก็ตามมันจะใช้ได้เฉพาะเมื่อธีม WordPress นั้นเปิดใช้งาน

ในบทช่วยสอนนี้เราจะสร้างเครื่องมือง่ายๆที่จะทักทายผู้เยี่ยมชม ดูที่รหัสนี้จากนั้นวางลงในปลั๊กอินเฉพาะของคุณเพื่อดูการทำงาน

// ลงทะเบียนและโหลดฟังก์ชันวิดเจ็ต wpb_load_widget () {register_widget ('wpb_widget'); } add_action ('widgets_init', 'wpb_load_widget'); // การสร้างคลาสวิดเจ็ต wpb_widget ขยาย WP_Widget {function __construct () {parent :: __ build (// Base ID of your widget 'wpb_widget', // ชื่อวิดเจ็ตจะปรากฏใน UI __ ('BPC Widget', 'wpb_widget_domain') , // อาร์เรย์คำอธิบายวิดเจ็ต ('description' => __ ('Simple WordPress Widget', 'wpb_widget_domain'),)); } // การสร้างวิดเจ็ตฟังก์ชันวิดเจ็ต front-end สาธารณะ ($ args, $ instance) {$ title = apply_filters ('widget_title', $ instance ['title']); // ก่อนและหลังอาร์กิวเมนต์ของวิดเจ็ตถูกกำหนดโดยธีม echo $ args ['before_widget']; ถ้า (! empty ($ title)) echo $ args ['before_title'] $ title. $ args ['after_title']; // นี่คือที่ที่คุณรันโค้ดและแสดงเอาต์พุต echo __ ('Simple Widget', 'wpb_widget_domain'); echo $ args ['after_widget']; } // แบบฟอร์มฟังก์ชันสาธารณะของวิดเจ็ตแบ็กเอนด์ ($ อินสแตนซ์) {if (isset ($ instance ['title'])) {$ title = $ instance ['title']; } else {$ title = __ ('ชื่อใหม่', 'wpb_widget_domain'); } // วิดเจ็ตฟอร์มผู้ดูแลระบบ?> get_field_id( 'title' ); ?>" name="get_field_name( 'title' ); ?>" type="text" value="" />

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

วิดเจ็ตแบบกำหนดเองของ Wordpress

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

ทีนี้ลองมาดูรหัสนี้กัน

อันดับแรกเราบันทึก“ wpb_widget และโหลดวิดเจ็ตที่กำหนดเองของเรา ต่อไปเราจะกำหนดสิ่งที่วิดเจ็ตนี้ทำและวิธีแสดงบนแดชบอร์ด

สุดท้ายเราได้กำหนดวิธีจัดการกับการเปลี่ยนแปลงที่เกิดขึ้นกับวิดเจ็ต

ขณะนี้มีบางสิ่งที่คุณอาจต้องการทราบ เช่นวัตถุประสงค์คืออะไร " wpb_text_domain "?

WordPress ใช้ "gettext" เพื่อจัดการการแปลและการแปล ดังนั้น " wpb_text_domain "และ __e บอก gettext วิธีดึงสตริงการแปลถ้ามีอยู่

หากคุณสร้างวิดเจ็ตที่กำหนดเองสำหรับธีม WordPress ของคุณคุณสามารถแทนที่ "wpb_text_domain" ด้วยข้อความของโดเมนของธีมของคุณ

ค้นพบปลั๊กอิน WordPress พรีเมียมบางอย่าง  

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

เราเสนอปลั๊กอิน WordPress พรีเมี่ยมให้คุณที่นี่ซึ่งจะช่วยคุณได้

1 Galaxy Funder

Galaxy Funder เป็นระบบคราวด์ฟันดิ้งที่เต็มไปด้วยฟีเจอร์ที่ออกแบบมาสำหรับเว็บไซต์ WooCommerce ใด ๆ การใช้ WordPress ปลั๊กอิน พรีเมี่ยม Galaxy Funder คุณจะสามารถจัดการเว็บไซต์คราวด์ฟันดิ้งของคุณเองหรือเพิ่มแคมเปญการระดมทุนที่ส่วนหัวของร้านค้าออนไลน์ WooCommerce ของคุณ

Galaxy Funder woocommerce ปลั๊กอินระบบคราวด์ฟันดิ้ง wordpress

คุณยังสามารถใช้ไฟล์ เกตเวย์การชำระเงินสนับสนุนโดย WooCommerce. โปรดทราบว่า“ Galaxy Funder” ทำงานโดยตรงบนหน้าร้านค้าออนไลน์ซึ่งทำให้กระบวนการสนับสนุนผู้ใช้ง่ายขึ้น

ดาวน์โหลด | การสาธิต | เว็บโฮสติ้ง

2 คลิกเพื่อ WhatsApp Chat

Le WordPress ปลั๊กอิน Premium Click to WhatsApp Chat ช่วยให้ลูกค้า WordPress เชื่อมต่อกับเจ้าของเว็บไซต์หรือฝ่ายสนับสนุนลูกค้าได้อย่างง่ายดายโดยใช้บัญชี WhatsApp 

คลิกเพื่อแชท whatsapp สำหรับปลั๊กอิน wordpress

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

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

ดาวน์โหลด | สาธิต | เว็บโฮสติ้ง

3. ดาวน์โหลด Image Watermark

นี้ ส่วนขยายของ WordPress พรีเมี่ยมช่วยให้คุณเพิ่มลายน้ำให้กับรูปภาพของคุณได้อย่างง่ายดาย ดิจิตอลดาวน์โหลดได้ง่ายลายน้ำง่ายดิจิตอลไฟล์ดาวน์โหลดภาพ

เหล่านี้ ลายน้ำ สามารถเป็นภาพสัญลักษณ์ลิขสิทธิ์ โลโก้ บริษัทหรือส่วนหนึ่งของการสร้างตราสินค้าเป็นภาพ PNG โปร่งใส

ดาวน์โหลด | สาธิต | เว็บโฮสติ้ง

แหล่งข้อมูลอื่น ๆ ที่แนะนำ

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

สรุป

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

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

แต่ในขณะเดียวกัน แบ่งปันบทความนี้ในเครือข่ายโซเชียลต่าง ๆ ของคุณ

...