สอนฝัง Code ภายนอก ในเว็บไซต์ WordPress ทำได้อย่างไร

สอนฝัง Code ภายนอก ในเว็บไซต์ Wordpress ทำได้อย่างไร
https://www.youtube.com/embed/GuYlD2kRqR8?feature=oembed&autoplay=1

ในบทเรียนนี้ ผมก็จะพูดถึง การวาง Code ภายนอก เช่น Google Map, ป้ายโฆษณา, หรือป้าย Sponsor ต่างๆ ใน เว็บไซต์ของเราว่าจะวางอย่างไร โดย Code ที่ว่านี้มีลักษณะเป็น Code [HTML] ซึ่งเป็น Code ที่เว็บของเรารู้จักนั่นเองครับ

วิธีการวางขึ้นอยู่กับตำแหน่งที่เราจะวาง

ถ้าเราต้องการวางในแถบด้านข้างของเว็บไซต์ หรือ ที่เราเรียกว่า Sidebar เราก็ต้องวาง Code ที่ Sidebar โดยใช้ Widget ครับ หรือ ในทางกลับกัน ถ้าต้องการวาง Code ในเนื้อหา เราก็ต้องวางใน Block Editor ครับ มาดูกันเลยครับว่าแต่ละวิธีจะใช้วิธีการวางอย่างไร

การวาง Code ที่ Sidebar

เราจะใช้ Widget ที่ชื่อว่า Custom HTML ในการวาง Code ลงไปครับ เมื่อเรามี Code HTML ที่ต้องการวาง เราก็สามารถที่จะใช้ Widget นี้แล้ววาง Code ในส่วนของเนื้อหาได้เลยครับ

คำแนะนำในการ วาง Code ที่ Sidebar นี้คือ ให้เราตั้งชื่อ Widget นี้เอาไว้ก่อนครับ เพื่อที่จะดูว่า ตำแหน่งของ Widget นี้อยู่ตรงไหน และ เมื่อเราวางลงไปแล้ว Code จะขึ้นหรือไม่ ที่สำคัญวางแล้วอย่าลืมกด Save แล้วไปทดสอบที่หน้าเว็บไซต์ด้วยครับ ไม่งั้นมันไม่ติดนะครับ

การวาง Code ในเนื้อหาของเว็บเรา

การวาง Code ในเนื้อหาของเว็บไซต์เรา สามารถทำได้สองวิธีง่ายๆ ด้วยกันครับ วิธีการแรกคือใช้ Custom HTML Block ครับ เราสามารถวาง Code HTML ลงไปได้เลยครับ ที่ร้ายกาจก็คือ เจ้า Custom HTML Block นี้สามารถที่จะ PREVIEW ได้เลยครับว่า Code ของเราแสดงผลอย่างไร

สำหรับ อีกวิธีหนึ่งก็คือ เราสามารถที่จะใช้ Classic Block ได้ครับ แล้ววางใน Mode HTML แต่เจ้า Classic Block มันไม่เก่งเท่า Custom HTML Block ครับ เพราะว่ามัน Preview ไม่ได้ครับ อย่าลืมทดลองดูทั้งสองแบบนะครับ

เอา Code Google Map มาได้อย่างไร

ให้เราไปที่ https://maps.google.com ครับ แล้วเราก็ค้นหาสถานที่ที่เราต้องการ จากนั้นเมื่อได้หมุดมาแล้ว ให้เราเลือก Share ครับ จะมีคำสั่งอีกสองคำสั่งเพิ่มมาครับ คือ Share เป็น Link หรือ การฝังครับ ให้เราเลือกการฝัง แล้วเราจะสามารถ Copy Code เอามาฝังที่เว็บไซต์ของเราได้ครับ

ปัญหาที่พบบ่อย ว่าวาง Code แล้วไม่ขึ้นคือ…

1. ธีม หรือ ปลั๊กอินของเรา มี Script หรือ Style บางอย่าง ที่ทำให้เรามองไม่เห็น Code ที่เราวางลงไปครับ
2. เว็บบราวเซอร์ของเรามี Ad Blocker ติดตั้งอยู่ เลย Block สิ่งที่เราฝังลงไปครับ
3. ถ้าเว็บเราเป็น HTTPS แล้วเราฝังอะไรก็ตามที่เป็น HTTP สิ่งที่เป็น HTTP จะไม่ขึ้นครับ

สรุป

การฝัง Code ใน WordPress ทำได้ 2 วิธีครับ เราจะใช้วิธีไหน ขึ้นอยู่กับ ตำแหน่งที่เราจะนำไปวางครับ ซึ่งการวางทั้งสองแบบ ไม่ยากเลย ที่สำคัญคือ เราต้องวางแล้วทำสอบครับ

ข่าวประชาสัมพันธ์

ถ้ากำลังมองหาคอร์สเรียน แบบสอนกันสดๆ ไม่ต้องเสียเวลาเรียนรู้ และ ทดลองเอง พิจารณาคอร์สเรียนสด ตรงนี้ได้เลยครับ

ใส่ความเห็น

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