When we browse articles on some websites online, there will be a "like" button at the end of the article. If you think the content of the article is very good, you can click the "like" button to like the article. In the template theme development of wordpress website, can we also add this "like" function to our articles on wordpress website? The answer is yes. So, How can I add the "like" function to articles on WordPress? See how I achieved it.

Step 1: introduce jquery into the header. php file of the wordpress template.

In order to transfer data to the background when clicking the "Like" button, we need to use the AJAX processing function of jquery here. Therefore, we need to first import the jquery file in the header file of the wordpress template. Here is version 1.7.2 of jquery, and other versions can also be used. The codes are as follows:

<script src="<?php bloginfo("template_url"); ?>/js/jquery-1.7.2.min.js"></script>

Step 2: Add the "Like" button below the wordpress article content. The codes are as follows:

<div class="item single_praise">Like:<span class="dashicons before dashicons heart"></span><span class="praise_num"><? php$praise_num = get_post_meta($post->ID,post_praise)[0]; // Get likes echo $praise_num$ praise_num : 0;?></ span></div>

Step 3: Add the event handling code for clicking "Like".

We need to add an event to the "Like" button. As soon as we click the "Like" button, the corresponding event processing will pop up, and the ID number of the current article will be transferred to the single_praise.php file through AJAX. The codes are as follows:

<script type="text/javascript">$(function()) {var pid=<? Php echo $post ->ID;?>;//Article IDvar user=<? Php echo wp_get_current_user() ->user_login;?>;//The current login user name

$(".single_praise").click(function(){

$. ajax ({type: post, url:<? Php bloginfo ("template_url");?>/include/single_praise.php, data: {pid: pid, user: user}, success: function (e) {console. log (e) var num=e? E: 0; $(". raise_num"). html (num);//Write likes again

}})})})</script>

Step 4: add "like" data to the corresponding article in the wordpress database.

Create a single_praise.php file under the include directory in the wordpress template directory to receive the data transferred from AJAX, and then add or modify data (like data of articles) to the wordpress database. The codes are as follows:

<? phpdefine(BASE_PATH,str_replace( \\ , / , realpath(dirname(__FILE__)./../../../../)));// Get the root directory require (BASE_PATH./wp load. php)$ postid = esc_sql($_POST[pid]);$ user = esc_sql($_POST[user]);$ u_ip = $_SERVER["REMOTE_ADDR"]; If ($postid==0) {//If the article ID=0exit ("illegal operation");}//Add like data to the database $praise_num=get_post_meta ($postid, post_prise) [0]$ user_views = ! empty($praise_num) ? $ praise_num : 0; update_post_meta($postid,post_praise,$user_views+1); print_r($praise_num); exit;

Through the above five steps, we have added the like function to the article on the wordpress website. Every time we click, we will add+1 to the like data of the article. In this way, we have basically completed the operation. However, there is a fly in the ointment. If the same user continuously clicks the "like" button, he will keep increasing the number of likes, which is unfriendly 。 Generally, we only allow one user to like it once in a day. We will introduce this function in the next chapter. Please wait and see you in the next chapter 。