วิธีเพิ่มตัวอย่างโค้ดที่กำหนดเองใน WordPress (วิธีที่ง่ายที่สุด)

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

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

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

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

ข้อมูลโค้ดใน WordPress คืออะไร?

ภายใต้อินเทอร์เฟซที่ใช้งานง่ายของ WordPress มีโลกแห่งโค้ดที่ขับเคลื่อนทุกการเคลื่อนไหว

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

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

พิจารณาว่า WordPress เทียบเท่ากับคาถา ซึ่งเมื่อร่ายอย่างเหมาะสมอาจให้ผลลัพธ์ที่ยอดเยี่ยมในส่วนหน้า

วิธีเพิ่มตัวอย่างโค้ดที่กำหนดเองใน WordPress

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

1. ติดตั้งและเปิดใช้งานปลั๊กอิน WPCode

WPCode เป็นวิธีที่ดีที่สุดสำหรับผู้ใช้ WordPress ในการเพิ่มข้อมูลโค้ดที่กำหนดเองลงในไซต์ของตนโดยไม่ต้องยุ่งกับไฟล์ functions.php หรือกังวลเกี่ยวกับการทำลายไซต์ด้วยข้อผิดพลาดเพียงเล็กน้อย

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

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

2. สร้างโค้ดแบบกำหนดเอง (PHP, CSS, HTML)

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

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

.wpforms-container input[type=radio] {
	-webkit-appearance: radio !important;
	-moz-appearance: radio !important;
	appearance: radio !important;
}

.wpforms-container input[type=checkbox] {
	-webkit-appearance: checkbox !important;
	-moz-appearance: checkbox !important;
	appearance: checkbox !important;
}

.wpforms-container input[type=radio]:checked:before,
.wpforms-container input[type=radio]:before,
.wpforms-container input[type=checkbox]:checked:before,
.wpforms-container input[type=checkbox]:before,
.wpforms-container input[type=radio]:checked:after,
.wpforms-container input[type=radio]:after,
.wpforms-container input[type=checkbox]:checked:after,
.wpforms-container input[type=checkbox]:after {
	display: none !important;
}

โค้ดด้านบนใช้ CSS เพื่อแก้ไขปัญหาข้อขัดแย้งของธีม แต่ดังที่กล่าวไว้ข้างต้น คุณสามารถสร้างโค้ดด้วย PHP และ HTML ได้เช่นกัน

3. เพิ่มโค้ดที่คุณกำหนดเอง (ตัวอย่างใหม่)

จากแถบเมนูผู้ดูแลระบบ WordPress คลิกตัวเลือก ตัวอย่างโค้ด จากนั้นคลิกปุ่ม เพิ่มใหม่ เนื่องจากคุณเพิ่งติดตั้งปลั๊กอิน รายการของคุณจะว่างเปล่า

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

คลิกที่ปุ่ม ใช้ตัวอย่างข้อมูล ถัดจากตัวเลือก เพิ่มรหัสที่กำหนดเองของคุณ (ตัวอย่างข้อมูลใหม่) เพื่อแทรกรหัสใหม่ของคุณ

ตอนนี้ สิ่งที่คุณต้องทำคือตั้งชื่อส่วนย่อย จากนั้นเพียงคัดลอกและวางโค้ดที่กำหนดเองที่คุณสร้างไว้ในพื้นที่ แสดงตัวอย่างโค้ด ในปลั๊กอิน WPCode

เนื่องจากเราสร้างโค้ดใน CSS ใต้เมนูแบบเลื่อนลง ประเภทโค้ด เราจึงเลือก CSS Snippet คุณสามารถเปลี่ยนแปลงได้ตามรหัสที่คุณสร้างขึ้น

จากนั้นเลื่อนลงไปที่แท็บ การแทรก ตอนนี้ เลือก แทรกอัตโนมัติ และจากดรอปดาวน์ ตำแหน่ง เลือกตัวเลือก Site Wide Header

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

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

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

ถัดไป คุณลักษณะ Smart Conditional Logic ที่ซับซ้อนช่วยให้คุณสามารถเปิดเผยหรือปกปิดตัวอย่างข้อมูลที่แทรกอัตโนมัติตามชุดเกณฑ์

สุดท้ายนี้ สิ่งที่คุณต้องทำคือตรวจสอบตัวเลือก ที่ใช้งานอยู่ และกดปุ่ม บันทึกตัวอย่างข้อมูล ก่อนที่จะออกจากปลั๊กอิน!

4. การจัดการข้อผิดพลาดในโค้ดที่กำหนดเอง

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

ข้อผิดพลาดทางไวยากรณ์หรือข้อผิดพลาดเซิร์ฟเวอร์ภายใน 500 รายการจะปรากฏบนไซต์ของคุณ คุณจะต้องใช้ไคลเอนต์ FTP เพื่อย้อนกลับการเปลี่ยนแปลงของคุณด้วยตนเอง

คุณลักษณะเฉพาะของปลั๊กอิน WPCode คือจะระบุและปิดใช้งานข้อผิดพลาดทางไวยากรณ์ในโค้ดโดยอัตโนมัติ

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

เมื่อคุณวางเมาส์เหนือปัญหา ป๊อปอัปพร้อมคำแนะนำในการแก้ไขปัญหาจะปรากฏขึ้น

5. การจัดการข้อมูลโค้ดที่คุณกำหนดเอง

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

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

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

คุณยังมีตัวเลือกในการส่งออกข้อมูลโค้ดเฉพาะหรือส่งออกทั้งหมดเป็นกลุ่ม เพียงไปที่ Code Snippets » Tools แล้วเลือกตัวเลือก Export

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

คำถามที่พบบ่อยเกี่ยวกับข้อมูลโค้ดที่กำหนดเอง

การเพิ่มข้อมูลโค้ดที่กำหนดเองเป็นหัวข้อยอดนิยมในการใช้งานในหมู่ผู้อ่านของเรา ต่อไปนี้เป็นคำตอบสั้นๆ สำหรับคำถามที่พบบ่อยบางข้อ:

ตัวจัดการข้อมูลโค้ดที่ดีที่สุดสำหรับ WordPress คืออะไร?

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

ฉันจะเพิ่ม CSS ลงในข้อมูลโค้ดใน WordPress ได้อย่างไร

ภายใน WPCode เพียงไปที่ส่วน + เพิ่มใหม่ ป้อน CSS ที่คุณต้องการ และให้แน่ใจว่าคุณเลือกประเภท CSS ก่อนที่จะบันทึกและเปิดใช้งาน

ฉันจะเพิ่มโค้ดที่กำหนดเองลงใน WordPress โดยไม่ต้องใช้ปลั๊กอินได้อย่างไร

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

ฉันจะเพิ่มโค้ด php ที่กำหนดเองลงใน WordPress ได้อย่างไร

สำหรับ PHP ให้ไปที่อินเทอร์เฟซของ WPCode เลือก + เพิ่มใหม่ วางโค้ด PHP ของคุณ จากนั้นบันทึก ตรวจสอบให้แน่ใจเสมอว่ามีการทดสอบบนไซต์ธีมย่อยชั่วคราวก่อน

ต่อไป เรียนรู้วิธีการกำหนดที่อยู่อีเมลสำหรับการดาวน์โหลดไฟล์

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

สร้างแบบฟอร์ม WordPress ของคุณตอนนี้

พร้อมที่จะสร้างแบบฟอร์มของคุณแล้วหรือยัง? เริ่มต้นวันนี้ด้วยปลั๊กอินตัวสร้างแบบฟอร์ม WordPress ที่ง่ายที่สุด WPForms Pro มีเทมเพลตฟรีมากมายและมีการรับประกันคืนเงินภายใน 14 วัน

หากบทความนี้ช่วยคุณได้ โปรดติดตามเราบน Facebook และ Twitter เพื่อรับบทช่วยสอนและคำแนะนำ WordPress ฟรีเพิ่มเติม