เขียน AJAX บน WordPress

ปกติเวลาที่เราเขียน AJAX กัน  การรับส่งข้อมูลระหว่างเบราเซอร์และเซิร์ฟเวอร์  จำเป็นจะต้องมี handler ตัวหนึ่งคอยจัดการ (ก็ที่เราสร้างออพเจ็กท์ xhr เรียกไปหาสคริปท์บนเซิร์ฟเวอร์สักตัวหนึ่ง  เช่น xhr.php นั่นแหละ) ซึ่งหลายๆ คนที่เป็นมือใหม่เวิร์ดเพรส  อาจจะมีคำถามว่า แล้วบนเวิร์ดเพรสมันทำยังไง?

ในการทำ AJAX บนเวิร์ดเพรสนั้น เวิร์ดเพรสจะเตรียม action ตัวหนึ่งเอาไว้ให้เรา  นั่นคือ wp_ajax  วิธีใช้ของมันก็คือจัดการ add_action(); เข้าไป  โดย action ที่จะใช้คือ wp_ajax_xxxx โดย xxxx จะเป็นชื่ออะไรก็ได้ที่เราต้องการใช้  โดยชื่อนี้จะเอาไว้เรียกหาแอคชันนี้ด้วย admin-ajax.php (ผมรู้ว่างง  เดี๋ยวอ่านๆ ไปจะเก็ตเอง)

เอาล่ะ  มาดูโค๊ดกัน

<?php
	add_action("wp_ajax_myxhr", "myajax");
	function myajax(){
		...
		die();
	}
?>

อันนี้คือการ add_action(); ปกติของเวิร์ดเพรส  โดยพารามิเตอร์แรกจะเป็นชื่อแอคชัน  และพารามิเตอร์ที่สองจะเป็นชื่อฟังก์ชันที่เราจะใช้  สังเกตุว่าเราจะใส่ die(); ลงไปที่ท้ายฟังก์ชันด้วย  เพราะว่าถ้าเราไม่สั่ง die(); ตัว admin-ajax.php มันจะพ่นค่าต่อท้ายออกมา (เอาจริงๆ ผมก็ไม่รู้เหมือนกันว่ามันคือค่าของอะไร) ทำให้ xhr ของเราเจ๊งได้ครับ  อย่างนี้

Read More

$(document).ready กับ $(window).load จะใช้อะไรดี?

ใน jQuery มีวิธีสั่งให้สคริปท์ทำงานเมื่อหน้าเว็บโหลดเสร็จอยู่สองวิธี คือ

$(document).ready();

และ

$(window).load();

ซึ่งสองวิธีนี้มันมีจุดต่างกันเล็กน้อยครับ

$(document).ready();

สำหรับ $(document).ready(); นั้น จะเป็นการสั่งให้โค๊ดทำงานเมื่อเบราเซอร์โหลด HTML Document ทั้งเว็บเสร็จเรียบร้อย และ DOM อยู่ในสถานะพร้อมใช้งาน จึงจะสั่งให้ JavaScript ทำงานครับ (คือมันไม่รอให้อะไรอย่างอื่น เช่นไฟล์ภาพบนหน้าเว็บโหลดเสร็จ ก็จะสั่งให้สคริปท์ทำงานเลย)

วิธีนี้จะมีปัญหากับเบราเซอร์บางตัว ไม่สิ ตัวเดียวเลย ก็คือ Google Chrome ครับ อย่างล่าสุดที่ผมเจอนี่คือสคริปท์จะทำงานก่อนที่ CSS จะประมวลผลหมด

$(window).load();

เมื่อวิธีแรกมีปัญหา เราก็เปลี่ยนมาใช้วิธีนี้ครับ $(window).load(); จะเป็นการสั่งให้สคริปท์ทำงานเมื่อหน้าเว็บทั้งหน้าโหลดเสร็จเรียบร้อยครับ คือสคริปท์จะรอให้ทุกอย่างบนหน้าเว็บโหลดเสร็จเรียบร้อย ทั้งภาพ วัตถุ หรือเฟรมต่างๆ แล้วจึงค่อยให้สคริปท์ทำงานครับ

Read More

ปฏิบัติการ Exteen

เมื่อนานมาแล้ว สมัยที่ใช้โดเมน .co.cc ตอนนั้นผมเคยเขียนเรื่อง Redirect จาก Bloggang มาที่เว็บผมเอง มาวันนี้ก็ไปลองคุ้ยๆ Exteen ดู (ระบบภายในออกแบบมาคล้ายๆกับ WordPress ครับ) พบว่าเราก็สามารถใน JavaScript ลงไปในส่วนของ Widget “Custom Code” ได้เช่นเดียวกันกับที่เราใส่ JavaScript ไปที่ Head ของ Bloggang ซึ่ง Exteen ได้ให้เราไว้ 4 Widgets ด้วยกัน

เสร็จโจรสิครับ…

Read More

เมื่อ BlogGang ไม่เพียงพอต่อความต้องการ

ในตอนแรกก่อนที่ผมจะมาแปะ Blog ไว้บนโฮสต์ตัวเอง ผมได้ด้อมๆมองๆ Blog Community ใหญ่ๆเอาไว้ก่อนแล้ว ซึ่งผมมีอยู่ 3 ตัวเลือกในหัว คือ WordPress.com , Exteen.com และ Bloggang.com ซึ่ง WordPress.com เป็นที่ที่ผมตัดทิ้งไปที่แรก เพราะผมไม่สามารถสมัครด้วย Username ประจำ (mrwhisper) ของผมได้ เหตุเกิดเพราะชื่อมันโหล มีฝรั่งเอาไปใช้แล้วนั่นเอง

มาดูที่ Exteen ซึ่งเป็น Blog Provider ที่เป็นที่นิยมในหมู่วัยรุ่นคนไทยในปัจจุบัน (ผมคิดว่าน่าจะเป็นอันดับ 1 ด้วยซ้ำ) และใช้เอ็นจิ้นที่มีลักษณะคล้ายกับ WordPress (ซึ่งผมก็ไม่แน่ใจว่า Core จริงๆของ Exteen คืออะไร) และสามารถตกแต่งบล็อกได้ค่อนข้างอิสระ แต่ว่าึบล็อกของผมค่อนข้างเกี่ยวกับ Software ซึ่งใน Exteen ไม่ค่อยเป็นที่นิยมสักเท่าไหร่นัก Exteen เลยตกขอบไปอีกอัน (แต่ผมก็เปิดเอาไว้เขียนเรื่องไร้สาระ)

มาดูที่สุดท้าย คือ Bloggang ที่ถ้าดูที่กลุ่มผู้ใช้ ก็ค่อนข้างจะตรงกับความต้องการมากที่สุด แต่ปัญหามันอยู่ที่ตัวระบบของ Bloggang ครับ ที่ไม่ค่อยถูกใจผมสักเท่าไหร่ แต่ในแง่ของการ Customize แล้ว ก็ค่อนข้างจะทำได้สูงอยู่มากทีเดียว เนื่องจากผู้ใช้สามารถใส่สคริปท์ตกแต่งได้เองในแท็ก <head> และยังใส่พารามิเตอร์เพิ่มเติมให้กับแท็ก <body> ได้อีกด้วย ซึ่งงานนี้ก็ได้ใส่ JavaScript กันสนุกเลยครับ

Read More