การใช้ AJAX กับ PHP บนไซต์ WordPress ของคุณด้วยปลั๊กอินของคุณเอง

ในบทความนี้ เราจะพูดถึง AJAX กับ PHP สำหรับเว็บไซต์ WordPress ของคุณ

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

AJAX คืออะไร?

AJAX ย่อมาจาก 'Asynchronous JavaScript และ XML' ดังที่ได้กล่าวไว้ก่อนหน้านี้ มันถูกใช้เพื่อสร้างเว็บแอปพลิเคชันที่ให้ความบันเทิง เปลี่ยนแปลงตลอดเวลา และโต้ตอบได้

ตัวอย่างยอดนิยมของเว็บแอปพลิเคชันที่พัฒนาขึ้นด้วยความช่วยเหลือของ AJAX และเทคโนโลยีที่เกี่ยวข้อง ได้แก่ Google Maps คุณลักษณะการเติมข้อความอัตโนมัติในการค้นหาของ Google ความคิดเห็นและการชอบบนโพสต์โซเชียลมีเดียต่างๆ และอื่นๆ อีกมากมาย

พื้นฐานของ AJAX

Ajax ด้วยความช่วยเหลือของภาษาการเขียนโปรแกรมต่างๆ เช่น JavaScript, HTML, CSS และ XML พัฒนาเว็บแอปพลิเคชันและเว็บไซต์ที่ปรับปรุงได้เร็วขึ้น นอกเหนือจากภาษาโปรแกรมเหล่านี้แล้ว สำหรับการพัฒนาสำหรับเว็บแอปพลิเคชัน ยังใช้ AJAX กับ PHP และภาษาฝั่งเซิร์ฟเวอร์อื่นๆ ด้วย

มันใช้ JavaScript สำหรับการแสดงเนื้อหา ในขณะที่ CSS ช่วยในการนำเสนอและ Document Object Model มันยังใช้ XHTML สำหรับเนื้อหาอีกด้วย

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

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

ทักษะที่จำเป็นในการทำงานกับ AJAX ใน WordPress

ตามที่เข้าใจจากการสนทนาข้างต้น ผู้ใช้ต้องการทักษะต่อไปนี้เพื่อใช้งาน AJAX อย่างเหมาะสม
• ความรู้เกี่ยวกับภาษาโปรแกรม เช่น JavaScript, HTML และ CSS
• ความชำนาญในภาษาฝั่งเซิร์ฟเวอร์ เช่น PHP และอื่นๆ
• พื้นฐานของ XML หรือ JSON

ข้อดีของ AJAX

ข้อดีต่างๆ ของ AJAX มีการกล่าวถึงด้านล่าง
• รองรับแทบทุกบราวเซอร์ที่ใช้ในยุคปัจจุบัน
• มันเกี่ยวข้องกับเวลาตอบสนองที่เร็วขึ้น ซึ่งหมายถึงประสบการณ์ผู้ใช้ที่ดีขึ้นในแง่ของความเร็วและประสิทธิภาพ
• ไลบรารี JavaScript แบบโอเพนซอร์ส เช่น Prototype, jQuery และอื่นๆ พร้อมให้ใช้งาน
• ช่วยลดเวลาระหว่างไคลเอนต์และเซิร์ฟเวอร์ ดังนั้นเวลาของทั้งผู้ใช้ และเซิร์ฟเวอร์ จะถูกบันทึกไว้
• เนื่องจากเซิร์ฟเวอร์ไม่จำเป็นต้องประมวลผลข้อมูลจำนวนมาก จึงช่วยลดการใช้แบนด์วิธและเพิ่มประสิทธิภาพการทำงานของเครือข่าย
• เนื่องจากคำขอ XMLHTTP ใช้สำหรับดึงข้อมูล ผู้ใช้จึงสามารถทำงานหลายอย่างพร้อมกันได้

AJAX ใน WordPress

AJAX ถูกใช้ที่ส่วนหลังของ WordPress ด้วยเหตุนี้ เมื่อใดก็ตามที่มีการเปลี่ยนแปลงใดๆ ในโพสต์หรือหมวดหมู่ หรือเมื่อใดก็ตามที่ผู้ดูแลระบบกลั่นกรองความคิดเห็น การอัปเดตจะทำในทันที AJAX ส่วนใหญ่จะใช้กับ JQuery บน WordPress กระบวนการที่ WordPress ใช้ AJAX มีดังนี้
• เมื่อมีการร้องขอ มันจะส่งผ่านไฟล์ 'admin-ajax.php' ที่อยู่ในโฟลเดอร์ 'wp-admin'
• คำขอเหล่านี้จำเป็นต้องระบุข้อมูลอย่างน้อยหนึ่งส่วน หรือเรียกอีกอย่างว่า 'การดำเนินการ' โดยทั่วไป โดยใช้วิธีการ 'รับ' หรือ 'โพสต์'
• การดำเนินการนี้จะแจ้งให้โค้ดในไฟล์ 'admin-ajax.php' สร้างสอง hooks คือ 'wp_ajax_my_action' และ 'wp_ajax_nopriv_my_action' 'my_action' ใน hooks เหล่านี้ระบุค่าของตัวแปร 'action' ของวิธี 'get' หรือ 'post'
• ในขณะที่ hook แรกมีไว้สำหรับการดำเนินการของผู้ใช้ที่เข้าสู่ระบบ hook ที่สองมีไว้สำหรับผู้ใช้ที่ออกจากระบบเท่านั้น
• ฟังก์ชันที่ติดหูควรมีการวางแผนสำหรับการลดระดับลงอย่างสง่างาม ซึ่งทำให้แน่ใจได้ว่าแม้ว่า JavaScript จะถูกปิดใช้งานบนเบราว์เซอร์ โค้ดจะยังคงทำงานอยู่

สร้างปลั๊กอิน WordPress AJAX

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

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

ขั้นตอนที่ 2 : ในขั้นตอนต่อไป ไฟล์ PHP จะต้องสร้างโดยใช้ชื่อปลั๊กอินที่เลือก ในฐานะผู้ใช้ที่จะติดตั้งปลั๊กอินนี้ จะต้องวางไฟล์ PHP ในไดเร็กทอรีปลั๊กอิน WordPress 'wp-content/plugins-' สำหรับการติดตั้ง ปลั๊กอินไม่สามารถใช้ชื่อเดียวกันสำหรับไฟล์ PHP ได้

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

ขั้นตอนที่ 3 : ควรสังเกตว่าปลั๊กอิน WordPress ควรมีไฟล์ PHP อย่างน้อยหนึ่งไฟล์พร้อมกับ JavaScript, CSS, ภาษา และไฟล์รูปภาพ หากมีไฟล์หลายไฟล์ ให้เลือกชื่อที่ไม่ซ้ำสำหรับไดเร็กทอรีและชื่อที่ต้องการสำหรับไฟล์ PHP หลัก

วางไฟล์ปลั๊กอินทั้งหมดลงในไดเร็กทอรีที่สร้างและขอให้ผู้ใช้ปลั๊กอินอัปโหลดไดเร็กทอรีทั้งหมดไปยังไดเร็กทอรี 'wp-content/plugins/'

การติดตั้ง WordPress สามารถกำหนดค่าให้เปลี่ยนไดเร็กทอรีปลั๊กอินมาตรฐาน 'wp-content/plugins/' ดังนั้น เราต้องใช้ plugin_dir_path() และ plugin_url() หรือพาธแบบสัมบูรณ์และ URL ในโค้ด PHP

โพสต์เทมเพลตของธีม

หลังจากสร้างปลั๊กอินแล้ว เราต้องหาเทมเพลตโพสต์ 'single.php' ของธีมของตน สามารถพบได้ที่ไดเร็กทอรีรากของธีมที่ใช้งานอยู่ ใช้เมื่อมีการสอบถามโพสต์เดียว ที่ต้องการวางปลั๊กอิน 'Post Like Counter' ควรเปิดไฟล์ไว้เพื่อแก้ไข

เตรียม Post Template ให้พร้อมสำหรับการโทร AJAX

จำเป็นต้องสร้างลิงก์เพื่อให้ผู้ใช้สามารถกดถูกใจโพสต์ได้ หากผู้ใช้เปิดใช้งาน JavaScript พวกเขาจะสามารถใช้ไฟล์ JavaScript (ที่จะสร้างขึ้นในภายหลัง) หรือมิฉะนั้นก็สามารถไปที่ลิงก์ได้โดยตรง เพื่อจุดประสงค์นี้ ให้ใส่รหัสต่อไปนี้ในไฟล์ 'single.php' โค้ดนี้สามารถเพิ่มไปยังส่วนเทมเพลตใดก็ได้ในไฟล์ 'single.php'

// ค่าเมตาคีย์ 'ชอบ' จะเก็บจำนวนไลค์ทั้งหมดสำหรับโพสต์เฉพาะ โดยจะแสดงเป็น 0 หากเป็นสตริงว่าง
ID, "ชอบ", จริง);
	$likes = ($likes == "") ? 0 : $ ชอบ;
?>

โพสต์นี้มี <span id='like_counter'></span> ชอบ<br>

// เชื่อมโยงไปยังไฟล์ admin-ajax.php ไม่มีการตรวจสอบรวมเพื่อความปลอดภัยเป็นพิเศษ สังเกตคลาส "user_like" สำหรับไคลเอนต์ที่เปิดใช้งาน JS
ID.'&amp;nonce='.$nonce);
	echo '<a class="user_like" data-nonce="' . $nonce . '">ID '" href="' $ลิงค์ '"&gt;ถูกใจโพสต์นี้</a>';
?&gt;

ระบุการโทร Ajax โดยไม่ต้องใช้ JavaScript

เมื่อคลิกลิงก์ที่สร้างในขั้นตอนก่อนหน้า ลิงก์หนึ่งจะถูกส่งต่อไปยังสคริปต์ 'admin-ajax.php' อย่างไรก็ตาม จะไม่พบผลลัพธ์ที่เป็นประโยชน์ใดๆ เนื่องจากไม่ได้สร้างฟังก์ชันเพื่อเรียกใช้การดำเนินการ ในการสร้างฟังก์ชันในไฟล์ปลั๊กอินและเพิ่มลงใน hooks ที่สร้างโดย WordPress ให้ใส่โค้ดต่อไปนี้

<?php // ใช้ที่นี่เพื่อเปิดใช้งานการเน้นไวยากรณ์เท่านั้น ทิ้งสิ่งนี้ไว้หากรวมอยู่ในไฟล์ปลั๊กอินของคุณแล้ว

// กำหนดการดำเนินการสำหรับสอง hook ที่สร้างขึ้น อันดับแรกสำหรับผู้ใช้ที่เข้าสู่ระบบและถัดไปสำหรับผู้ใช้ที่ออกจากระบบ
add_action("wp_ajax_my_user_like", "my_user_like");
add_action("wp_ajax_nopriv_my_user_like", "โปรด_เข้าสู่ระบบ");

// กำหนดฟังก์ชั่นที่จะเริ่มทำงานสำหรับผู้ใช้ที่เข้าสู่ระบบ
ฟังก์ชั่น my_user_like () {
   
   // ไม่มีการตรวจสอบความปลอดภัยอีกชั้นหนึ่ง ฟังก์ชันจะออกหากล้มเหลว
   if ( !wp_verify_nonce( $_REQUEST['nonce'], "my_user_like_nonce")) {
      ทางออก("วูฟ วูฟ วูฟ วูฟ");
   }   
   
   // ดึง like_count สำหรับโพสต์ ตั้งค่าเป็น 0 หากว่างเปล่า เพิ่มขึ้น 1 เมื่อลงทะเบียนการคลิก 
   $like_count = get_post_meta($_REQUEST["post_id"], "ชอบ", จริง);
   $like_count = ($like_count == ') ? 0 : $like_count;
   $new_like_count = $like_count + 1;
   
   // อัพเดตค่า 'likes' คีย์เมตาสำหรับโพสต์ที่ระบุ สร้างข้อมูลเมตาใหม่สำหรับโพสต์หากไม่มีอยู่
   $like = update_post_meta($_REQUEST["post_id"], "ถูกใจ", $new_like_count);
   
   // หากการดำเนินการข้างต้นล้มเหลว ประเภทผลลัพธ์จะถูกตั้งค่าเป็น 'error' และ like_count เป็นค่าเดิม หากสำเร็จ ให้อัปเดตเป็น new_like_count  
   if($ ชอบ === เท็จ) {
      $result['type'] = "ข้อผิดพลาด";
      $result['like_count'] = $like_count;
   }
   อื่น {
      $result['type'] = "สำเร็จ";
      $result['like_count'] = $new_like_count;
   }
   
   // ตรวจสอบว่ามีการดำเนินการผ่านการโทร Ajax หรือไม่ ถ้าใช่ รหัส JS จะถูกเรียกใช้ มิฉะนั้น ผู้ใช้จะถูกเปลี่ยนเส้นทางไปยังหน้าโพสต์
   if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
      $result = json_encode($ผล);
      ก้อง $ผล;
   }
   อื่น {
      header("ตำแหน่ง: ".$_SERVER["HTTP_REFERER"]);
   }

   // อย่าลืมปิดท้ายสคริปต์ด้วยฟังก์ชัน die() - สำคัญมาก
   ตาย();
}

// กำหนดฟังก์ชั่นที่จะเริ่มทำงานสำหรับผู้ใช้ที่ออกจากระบบ
ฟังก์ชัน please_login() {
   echo "คุณต้องเข้าสู่ระบบเพื่อชอบ";
   ตาย();
}

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

เพิ่มการรองรับ JavaScript

การเพิ่มการรองรับ JavaScript สามารถทำให้สิ่งต่างๆ ง่ายขึ้นได้ สำหรับการใช้ AJAX กับ PHP บน WordPress จำเป็นต้องจัดคิวไลบรารี jQuery พร้อมกับไฟล์ JavaScript ที่กำหนดเองของปลั๊กอิน เพื่อจุดประสงค์นี้ ให้เขียนโค้ดต่อไปนี้ในปลั๊กอิน

 admin_url( 'admin-ajax.php' )));        
   
   // เข้าคิวไลบรารี jQuery และสคริปต์ที่คุณลงทะเบียนด้านบน
   wp_enqueue_script( 'jquery' );
   wp_enqueue_script( 'liker_script' );
}

ถัดไป ไฟล์ Javascript 'liker_script.js' จะต้องถูกสร้างขึ้น ซึ่งจะถูกอัปโหลดเพิ่มเติมในโฟลเดอร์รูทของปลั๊กอิน รหัสต่อไปนี้ใช้สำหรับสร้างไฟล์ 'liker_script.js'

jQuery (เอกสาร). พร้อม (ฟังก์ชั่น () {
   jQuery (".user_like") คลิก (ฟังก์ชัน (จ) {
      e.preventDefault(); 
      post_id = jQuery(นี้).attr("data-post_id");
      nonce = jQuery(นี้).attr("data-nonce");
      jQuery.ajax ({
         ประเภท : "โพสต์",
         ประเภทข้อมูล : "json",
         url : myAjax.ajaxurl,
         ข้อมูล : {การกระทำ: "my_user_like", post_id : post_id, nonce: nonce},
         ความสำเร็จ: ฟังก์ชั่น (การตอบสนอง) {
            if(response.type == "สำเร็จ") {
               jQuery("#like_counter").html(response.like_count);
            }
            อื่น {
               alert("ไม่สามารถกดถูกใจได้");
            }
         }
      });
   });
});

วิธีการใช้ AJAX ในธีม WordPress

ขั้นตอนต่อไปนี้จะช่วยในการใช้ AJAX กับ PHP ในธีม WordPress ตัวอย่างเช่น สมมติว่างานของเราคือการแสดงหมวดหมู่ในเมนูแบบเลื่อนลง และเมื่อคลิกที่ 'หมวดหมู่หลัก' หมวดหมู่ย่อยจะปรากฏในช่องดรอปดาวน์อื่น งานนี้จะทำสำเร็จด้วยความช่วยเหลือของขั้นตอนต่อไปนี้

ขั้นตอนที่ 1 : เลือก 'หมวดหมู่' ที่ด้านซ้ายของแดชบอร์ด และใส่ชื่อของหมวดหมู่ในกล่องที่ปรากฏทางด้านขวามือ และแทรกตัวระบุหมวดหมู่ด้านล่าง หากมีการสร้างประเภทหลัก ให้เลือก 'ไม่มี' หรือหากมีการสร้างประเภทย่อย ให้เลือกประเภทหลักจากตัวเลือก

ขั้นตอนที่ 2 : ในขั้นตอนนี้ เทมเพลต WordPress จะถูกสร้างขึ้นเพื่อใช้ฟังก์ชัน AJAX เปิดไฟล์ PHP ใหม่และบันทึก ใส่รหัสต่อไปนี้ในหน้าที่สร้างขึ้น

ในโค้ดด้านบน 'ชื่อเทมเพลต: Implement Ajax' คือชื่อของเทมเพลต WordPress และฟังก์ชัน 'get_header()' และ 'get_footer()' จะใช้เพื่อแสดงเนื้อหาส่วนหัวและส่วนท้ายของหน้า

ประการแรก ไฟล์ไลบรารี jQuery จะต้องรวมอยู่ในเพจซึ่งจะช่วยในการเพิ่มไฟล์ AJAX AJAX กับ PHP สามารถใช้ไลบรารี JavaScript ใดก็ได้หรือสามารถเรียก AJAX ด้วย JavaScript แบบดิบ ในตัวอย่างต่อไปนี้ ไลบรารี jQuery JavaScript ใช้สำหรับการนำ AJAX ไปใช้

ขั้นตอนที่ 3 : เพิ่มไฟล์ jQuery ในเทมเพลตและเรียกใช้ฟังก์ชัน 'wp_dropdown_categories' เพื่อให้สามารถเรียกหมวดหมู่หลักในเมนูแบบเลื่อนลงได้

#เนื้อหา{ความกว้าง:อัตโนมัติ; ความสูง:400px; ระยะขอบ:50px;}

<div>


</div>
&lt;?php

ขั้นตอนที่ 4 : ใส่รหัส jQuery เพื่อรับ ID ของหมวดหมู่หลักที่เลือก ส่งไปที่ไฟล์ 'functions.php' เพื่อรับหมวดหมู่ย่อยภายใต้ ID หมวดหมู่หลักที่เลือกไว้ ผลลัพธ์สามารถส่งกลับไปที่หน้าโดยไม่ต้องรีเฟรช

$(ฟังก์ชัน(){
			$('#main_cat').change(ฟังก์ชัน(){
					var $mainCat=$('#main_cat').val();

					// เรียก ajax
					 $("#sub_cat").empty();
						$.ajax({
							url:"/wp-admin/admin-ajax.php",
							ประเภท: 'POST',
														data:'action=my_special_action&main_catid=' + $mainCat,

							 ความสำเร็จ:ฟังก์ชัน(ผลลัพธ์)
								 {
								// แจ้งเตือน (ผลลัพธ์);
				$("#sub_cat")).removeAttr("ปิดการใช้งาน");
				$("#sub_cat")).append(ผลลัพธ์);
										}
								   });
						  }
									);
});

ในโค้ดด้านบนนี้ โค้ดจะถูกเพิ่มในเหตุการณ์การเปลี่ยนแปลงของหมวดหมู่หลักดรอปดาวน์ด้วย ID '#main_cat'

var $mainCat=$('#main_cat').val();

ฟังก์ชัน .val() ช่วยในการรับค่าตัวเลือกที่เลือกจากเมนูแบบเลื่อนลงและเก็บไว้ในตัวแปร '$mainCat'

$("#sub_cat").empty();

รายการแบบหล่นลงของหมวดย่อย '#sub_cat' จะต้องถูกยกเลิก หากมีค่าก่อนหน้า ก่อนที่จะเรียกใช้ AJAX

บรรทัด jQuery ต่อไปนี้จะช่วยในการเรียกใช้ฟังก์ชัน AJAX jQuery ตรวจสอบพารามิเตอร์ของฟังก์ชัน AJAX ที่ระบุในส่วนด้านล่าง

url:"bloginfo('wpurl'); ?>/wp-admin/admin-ajax.php",
ประเภท: 'POST',

เพื่อให้ AJAX ทำงานใน WordPress จะใช้พารามิเตอร์ 'URL' ดังนั้น คำขอจะถูกส่งไปยังไฟล์ 'admin-ajax.php' ถัดไป hooks ในไฟล์ 'functions.php' จะถูกเรียกเพื่อรับข้อมูลที่โพสต์ซึ่งถูกส่งไปยัง URL: '/wp-admin/admin-ajax.php'

ในการส่งค่าพร้อมกับคำขอ จะใช้พารามิเตอร์ 'data' ในตัวอย่างนี้ สองอาร์กิวเมนต์ที่มีพารามิเตอร์ data ถูกใช้ – action และ main_catid

ขั้นตอนที่ 5 : ในไฟล์ 'functions.php' รหัสต่อไปนี้ใช้เพื่อขอการดำเนินการ

add_action('wp_ajax_my_special_action', 'my_action_callback');

ในการดำเนินการข้างต้นนี้ hook มีสองอาร์กิวเมนต์ ในอาร์กิวเมนต์แรก 'wp_ajax_my_special_action' 'wp_ajax_' คือค่าที่ส่งไปพร้อมกับพารามิเตอร์ข้อมูล 'action' ในอาร์กิวเมนต์ที่สอง 'my_action_callback' ข้อมูลจะได้รับการประมวลผลและผลลัพธ์จะถูกส่งกลับ

ขอดำเนินการข้างต้นนี้สำหรับผู้ใช้ที่เข้าสู่ระบบ สำหรับผู้ใช้ที่ออกจากระบบ สามารถขอการดำเนินการต่อไปนี้ได้

add_action('wp_ajax_nopriv_my_special_action', 'my_action_callback');

โค้ดสุดท้ายหลังจากเพิ่ม hook ให้กับทั้งผู้ใช้และฟังก์ชัน call back มีดังนี้

ฟังก์ชัน Implement_ajax () {
if(isset($_POST['main_catid']))
			{
			$categories= get_categories('child_of='.$_POST['main_catid'].'&hide_empty=0');
			  foreach ($ หมวดหมู่เป็น $cat) {
				$option .= 'term_id.'">';
				$option .= $cat->cat_name;
				$option .= ' ('.$cat->category_count.')';
				$option .= '';
			  }

			  echo 'Scegli...'.$ตัวเลือก;
			ตาย();
			} // จบ if
}
add_action('wp_ajax_my_special_ajax_call', 'implement_ajax');
add_action('wp_ajax_nopriv_my_special_ajax_call', 'implement_ajax');//สำหรับผู้ใช้ที่ไม่ได้เข้าสู่ระบบ

ขั้นตอนที่ 6 : ในขั้นตอนนี้ ให้สร้างหน้าใหม่ในแดชบอร์ดและกำหนดเทมเพลตให้กับหน้านั้น หลังจากที่โหลดหน้าในเบราว์เซอร์แล้ว เมนูแบบเลื่อนลงรายการแรกที่มีหมวดหมู่หลักจะถูกโหลดเข้าไป

เนื่องจากเมนูแบบเลื่อนลงรายการที่สองว่างเปล่า ให้เลือกตัวเลือกในเมนูแบบเลื่อนลงรายการแรกเพื่อตรวจสอบว่าการทำงานเป็นอย่างไร

ดังนั้น AJAX กับ PHP จึงสามารถใช้กับไซต์ WordPress ได้โดยใช้ปลั๊กอินที่สร้างขึ้นใหม่