Trong b\u00e0i h\u01b0\u1edbng d\u1eabn n\u00e0y ch\u00fang t\u00f4i s\u1ebd h\u01b0\u1edbng d\u1eabn c\u00e1c b\u1ea1n t\u1ea1o n\u00fat Load more s\u1eed d\u1ee5ng Ajax trong WordPress.<\/p>\n\n\n\n
1. Tr\u01b0\u1edbc ti\u00ean c\u00e1c b\u1ea1n th\u00eam n\u00fat load more v\u00e0o trang c\u1ee7a b\u1ea1n:<\/strong><\/p>\n\n\n 2. T\u1ea1o file JavaScript \u0111\u1ec3 x\u1eed l\u00fd y\u00eau c\u1ea7u AJAX.<\/strong><\/p>\n\n\n 3. T\u1ea1o file PHP \u0111\u1ec3 x\u1eed l\u00fd y\u00eau c\u1ea7u AJAX.<\/strong><\/p>\n\n\n\n Th\u00eam function 4. \u0110\u0103ng k\u00fd h\u00e0m x\u1eed l\u00fd AJAX.<\/strong><\/p>\n\n\n\n Th\u00eam m\u00e3 sau v\u00e0o file B\u1ea1n h\u00e3y ki\u1ec3m tra c\u00e0i \u0111\u1eb7t c\u1ee7a b\u1ea1n b\u1eb1ng c\u00e1ch t\u1ea3i trang c\u1ee7a b\u1ea1n v\u00e0 nh\u1ea5p v\u00e0o n\u00fat load more.<\/p>\n\n\n\n N\u1ebfu m\u1ecdi th\u1ee9 di\u1ec5n ra su\u00f4n s\u1ebb, b\u1ea1n s\u1ebd th\u1ea5y c\u00e1c b\u00e0i \u0111\u0103ng m\u1edbi \u0111\u01b0\u1ee3c th\u00eam v\u00e0o trang c\u1ee7a m\u00ecnh.<\/p>\n\n\n\n Ch\u00fac c\u00e1c b\u1ea1n th\u00e0nh c\u00f4ng!<\/p>\n","protected":false},"excerpt":{"rendered":" Trong b\u00e0i h\u01b0\u1edbng d\u1eabn n\u00e0y ch\u00fang t\u00f4i s\u1ebd h\u01b0\u1edbng d\u1eabn c\u00e1c b\u1ea1n t\u1ea1o n\u00fat Load more s\u1eed d\u1ee5ng Ajax trong […]<\/p>\n","protected":false},"author":6,"featured_media":7786,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[143],"tags":[],"class_list":["post-7434","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-thu-thuat-wordpress"],"views":687,"_links":{"self":[{"href":"https:\/\/tapchicntt.com\/rest-api\/wp\/v2\/posts\/7434","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tapchicntt.com\/rest-api\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tapchicntt.com\/rest-api\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tapchicntt.com\/rest-api\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/tapchicntt.com\/rest-api\/wp\/v2\/comments?post=7434"}],"version-history":[{"count":10,"href":"https:\/\/tapchicntt.com\/rest-api\/wp\/v2\/posts\/7434\/revisions"}],"predecessor-version":[{"id":7847,"href":"https:\/\/tapchicntt.com\/rest-api\/wp\/v2\/posts\/7434\/revisions\/7847"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tapchicntt.com\/rest-api\/wp\/v2\/media\/7786"}],"wp:attachment":[{"href":"https:\/\/tapchicntt.com\/rest-api\/wp\/v2\/media?parent=7434"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tapchicntt.com\/rest-api\/wp\/v2\/categories?post=7434"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tapchicntt.com\/rest-api\/wp\/v2\/tags?post=7434"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}\n<button id="load-more">Load more posts<\/button>\n<\/pre><\/div>\n\n\n
\njQuery(document).ready(function($) {\n var page = 1;\n \/\/ Bind the load more button click event.\n $("#load-more").on("click", function() {\n \/\/ Send an AJAX request to the `wp-admin\/admin-ajax.php` file.\n $.ajax({\n url: ajaxurl,\n type: "POST",\n data: {\n action: "load_more_posts",\n page: page++,\n },\n success: function(response) {\n \/\/ Append the new posts to the DOM.\n $("#posts").append(response);\n }\n });\n });\n});\n<\/pre><\/div>\n\n\nload_more_posts<\/code> v\u00e0o file functions.php<\/code>:<\/p>\n\n\n\nfunction load_more_posts() {\n \/\/ Get the current page number.\n $paged = ($_POST['page'] ?? 1);\n $post_type = isset($_POST["post_type"]) ? sanitize_key($_POST["post_type"]) : 'post';\n\n \/\/ Get the posts for the current page.\n $args = [\n 'post_status' => 'publish',\n 'post_type' => $post_type,\n 'paged' => $paged,\n ];\n $query = new WP_Query($args);\n \/\/ Loop through the posts and echo them.\n if ($query->have_posts()) {\n while ($query->have_posts()) {\n $query->the_post();\n \/\/ Add the post HTML to the $posts_html variable.\n $posts_html .= '<h2>' . the_title() . '<\/h2>';\n $posts_html .= the_content();\n }\n }\n \/\/ Set the post offset.\n wp_reset_postdata();\n \/\/ Return the posts HTML.\n return $posts_html;\n}\n<\/pre><\/div>\n\n\nfunctions.php<\/code> c\u1ee7a b\u1ea1n \u0111\u1ec3 \u0111\u0103ng k\u00fd h\u00e0m x\u1eed l\u00fd AJAX:<\/p>\n\n\n\nadd_action('wp_ajax_load_more_posts', 'load_more_posts');\nadd_action('wp_ajax_nopriv_load_more_posts', 'load_more_posts');\n<\/pre><\/div>\n\n\n