WordPress’s Method of Implementing Articles’Support and Opposition Functions

Time:2019-5-29

This paper illustrates how WordPress implements the support and opposition functions of the article. Share for your reference. Specific analysis is as follows:

If you can see that there are many kinds of support and opposition functions in the article page on the Internet Easy or QQ website, we can express our opinions, then how to realize the support and opposition function of the article, let me introduce the quick implementation using ajax.

I use WP for secondary development, of course you can also install plug-ins, but I customized the implementation code:

First, add two fields like and unlike to the database table wp_posts

The PHP example code is as follows:

Copy code

The code is as follows:

public function dolike_unlike(){
$b = M();
$input = new input();
$id = $input – > post (‘id’); and // filter the submitted information. To prevent SQL injection, I have filled in the code I sent before.
//$id = 5524;
$val = $_POST[‘data’];
if($val==1){
$b – > query (“update `wp_posts` set `like `= `like `+1 WHERE id = $id’); and // click on like update
}else if($val==0){
$b – > query (“update `wp_posts` set `unlike `= `unlike `+1 WHERE id = $id’);//dislike update)
}else{
$this->error(‘error’);
}
$list = $b – > query (“SELECT `like’, `unlike `FROM `wp_posts `WHERE id = $id”); //Get data
$like = $list[0][‘like’];
$dislike = $list[0][‘unlike’];
If ($like!= 0 | | $dislike!= 0) {// calculation
$elike = $like/($like+$dislike);
$elike = substr($elike*100,0,4);
$edislike = $dislike/($like+$dislike);
$edislike = substr($edislike*100,0,4);
}
//echo $elike;
$output = array (// combination function to be output
likenum=>$like,
dislikenum=>$dislike,
like=>$elike,
dislike=>$edislike
);
//echo $list;
//dump($output);
$this – > ajaxReturn ($output,’success’, 1); //output
//echo ‘ok’;
//$this->display(”);
}

The HTML example code is as follows:

Copy code

The code is as follows:

<div></div>
<style>
.recomm{ border-bottom:4px solid #FF7523; color:#FF7523}
.single_share_class{ position:absolute; left:-95px; top:80px; width:75px; height:328px; text-align:center; background:url(/img/single_page_share.png) no-repeat;}
.single_share_class .comm_num{ padding:12px 0 48px 0px}
.single_share_class .comm_num span{ font-size:10px; line-height:11px; color:#ff9853; display:block}
.single_share_class >span >span >span{ margin-bottom:7px !important;}
.single_share_class .copylink{ padding:28px 0 0 0; cursor:pointer}
.single_share_class .st_sharethis_large >span >span{ background:none !important}
.dingandcai{ width:526px; height:62px; background:url(/img/likeandunlike.jpg) no-repeat; margin:20px 0;line-height:62px; text-align:center; font-size:24px; text-shadow:1px 1px 1px #000; }
.dingandcai .left_like{ width:224px; float:left;height:62px; position:relative}
.dingandcai .left_like span,.dingandcai .right_unlike span{ position:relative; z-index:2}
.dingandcai .dingload{ width:78px; float:left; }
.dingandcai .right_unlike{ width:224px; float:left; height:62px;position:relative }
.dingandcai .left_like .left_con{ background:url(/img/likeandunlike.jpg) 0px -63px no-repeat; width:50%; height:62px;position:absolute;top:0;left:0; z-index:1}
.dingandcai .right_unlike .right_con{ background:url(/img/likeandunlike.jpg) -302px -63px no-repeat; width:50%; height:62px;position:absolute;top:0;left:0; z-index:1}
.allow_click,.disallow_click{cursor:pointer}
</style>
<div>
<div val=”1″ postid=”<?php the_ID(); ?>”>
<div></div><span>Like</span>
</div>
<div>
<img src=”/img/loading_sm.gif” />&nbsp;
</div>
<div val=”0″ postid=”<?php the_ID(); ?>”>
<div></div>
<span>Dislike</span>
</div>
</div>
<div></div>

The JS instance code is as follows:

Copy code

The code is as follows:

JQuery (“. dingload img”). ajaxStart (function (){//ajax prompt
jQuery(this).show();
});
jQuery(“.dingload img”).ajaxStop(function(){
jQuery(this).hide();
});
var pid = jQuery(“.left_like”).attr(“postid”);
var likecookie = jQuery.cookie(“like”+pid);
If (like cookie!= pid) {// Judge whether clicked, if not
jQuery(“.left_like,.right_unlike”).addClass(“allow_click”);
jQuery.get(‘/cityosweb/default.php/Shanmao/wplike_unlike’,{id:pid},function(data){
If (data. status== 1) {// Display background percentage and like dislike
jQuery(“.left_like .left_con”).css(“width”,data.data.like+”%”);
jQuery(“.right_unlike .right_con”).css(“width”,data.data.dislike+”%”);
}
},”json”);
} else {// If you have already voted
jQuery(“.left_like,.right_unlike”).addClass(“disallow_click”);
jQuery.get(‘/cityosweb/default.php/Shanmao/wplike_unlike’,{id:pid},function(data){
If (data. status=== 1) {// Display background percentage and number of votes
//alert(data.likenum);
jQuery(“#like”).html(data.data.likenum);
jQuery(“#dislike”).html(data.data.dislikenum);
jQuery(“.left_like .left_con”).css(“width”,data.data.like+”%”);
jQuery(“.right_unlike .right_con”).css(“width”,data.data.dislike+”%”);
}
},”json”);
}
jQuery(“.left_like,.right_unlike”).click(function(){
If (jQuery (this). hasClass (“allow_click”) {// If there is such a class, it will be submitted
var val = jQuery(this).attr(“val”);
var postid = jQuery(this).attr(“postid”);
JQuery. post (‘/cityosweb/default.php/Shanmao/dolike_unlike’, {data: val, id: postid}, function (data) {// click time)
If (data. status = = 1) {// successful return processing
jQuery(“#like”).html(data.data.likenum);
jQuery(“#dislike”).html(data.data.dislikenum);
jQuery(“.left_like .left_con”).css(“width”,data.data.like+”%”);
jQuery(“.right_unlike .right_con”).css(“width”,data.data.dislike+”%”);
jQuery(“.left_like,.right_unlike”).removeClass(“allow_click”).addClass(“disallow_click”);
JQuery. cookie (‘like’+postid, postid, {expires: 1}); write cookie after submission, using the juqery. cookie plug-in. Save one day, each article saves a different ID. The value is arbitrary, as long as you can make a good judgement on it.
}else{
alert(data.info);
}
},”json”);
}
});
JQuery (“. disallow_click”). live (“click”, function () {// pop-up when submission is not allowed
alert(“Your vote has already been submitted!”);
});

I hope this article will be helpful to the construction of WordPress.