WordPress native Post AJAX thumb ups

How AJAX thumb ups are implemented

You can use custom fields to save the number of likes, and use cookies to disable repeated likes.
WordPress does not use plug-ins to implement the AJAX thumb up process
We directly add the following code to your current topic's functions. php. The content is as follows:

Add_action ('WP _ ajax_nopriv_specs_zan ', 'specs _ zan ');
Add_action ('WP _ ajax_specs_zan ', 'specs _ zan ');
Function specs_zan (){
Global $ wpdb, $ post;
$ Id = $ _ POST ["um_id"];
$ Action = $ _ POST ["um_action"];
If ($ action = 'Ding '){
$ Specs_raters = get_post_meta ($ id, 'specs _ ZA', true );
$ Expire = time () + 99999999;
$ Domain = ($ _ SERVER ['http _ host']! = 'Localhost ')? $ _ SERVER ['http _ host']: false; // make cookies work with localhost
Setcookie ('specs _ zan _ '. $ id, $ id, $ expire,'/', $ domain, false );
If (! $ Specs_raters |! Is_numeric ($ specs_raters )){
Update_post_meta ($ id, 'specs _ zn', 1 );
        }   
Else {
Update_post_meta ($ id, 'specs _ zan ', ($ specs_raters + 1 ));
        }  
Echo get_post_meta ($ id, 'specs _ zan ', true );
    }   
Die;
} 

Add the following code to the footer. Php file of your current topic. Here, the tribe will describe how to add the js code:

$. Fn. postLike = function (){
If ($ (this). hasClass ('done ')){
Alert ('you have liked this article ');
Return false;
} Else {
$ (This). addClass ('done ');
Var id = $ (this). data ("id "),
Action = $ (this). data ('action '),
RateHolder = $ (this). children ('. Count ');
Var ajax_data = {
Action: "specs_zan ",
Um_id: id,
Um_action: action
};
$. Post ("/wp-admin/admin-ajax.php", ajax_data,
Function (data ){
Certificate (rateholder).html (data );
});
Return false;
    }  
};
$ (Document). on ("click", ". specsZan ",
Function (){
$ (This). postLike ();
});

Next, add the following code where you want to display it. We recommend that you add it to the end of the article.

<Div class = "post-like">
<A href = "javascript:;" data-action = "ding" data-id = "<? Php the_ID ();?> "Class =" specsZan <? Php if (isset ($ _ COOKIE ['specs _ zan _ '. $ post-> ID]) echo 'done';?> "> Like <span class =" count ">
<? Php if (get_post_meta ($ post-> ID, 'specs _ zand', true )){
Echo get_post_meta ($ post-> ID, 'specs _ zan ', true );
} Else {
Echo '0 ';
}?> </Span>
</A>
</Div>

Finally, of course it is the CSS style. Here is a simple example:

. Post-like {text-align: center; padding: 10px}
. Post-like a {background-color: # 21759B; border-radius: 3px; color: # FFFFFF; font-size: 12px; padding: 5px 10px; text-decoration: none; outline: none}
. Post-like a. done,. post-like a: hover {background-color: # eee; color: # 21759B ;}
. Post-like a. done {cursor: not-allowed}
Now, after all the processes are completed, let's see the results.