WordPress如何实现文章收藏功能?

无评论

作者照片

By 霜天

很多WordPress需要用到文章收藏的功能,又有用户不想使用WordPress插件,这时候就需要用到纯代码实现,那么WordPress如何实现文章收藏功能?首先将下面的代码放到您的functions.php文件中。

function post_shoucang(){

if(!get_current_user_id()){

exit(json_encode([\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’msg\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’=>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’请先登录才能收藏哦!\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’]));

}

$id = $_POST[\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”id\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”];

$meta = get_post_meta($id,\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,true);

$shoucang1 = explode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,get_post_meta($id,\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,true));

$shoucang = array_filter($shoucang1);

$user = get_current_user_id();

if(in_array($user,$shoucang)){

foreach($shoucang as $k=>$v){

if($v==$user){

unset($shoucang[$k]);

}

}

update_post_meta($id, \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’, implode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”,\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”,$shoucang));

exit(json_encode([\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’msg\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’=>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’已取消收藏\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’]));

}else{

array_push($shoucang,$user);

update_post_meta($id, \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’, implode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”,\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”,$shoucang));

exit(json_encode([\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’msg\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’=>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’收藏成功\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’]));

}

}

add_action(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’wp_ajax_post_shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’post_shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’);

add_action(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’wp_ajax_nopriv_post_shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’post_shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’);

其次,是在文章页中放入下面的html代码(收藏按钮):

<?php

$shoucang1 = explode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,get_post_meta(get_the_ID(),\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,true));

$shoucang = array_filter($shoucang1);

$user = get_current_user_id();

?>

<a class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”shoucang <?php if(in_array($user,$shoucang)){ foreach($shoucang as $k=>$v){if($v==$user){echo \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”on\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”;}}} ;?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” data-id=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”<?php the_ID();?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” href=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”javascript:;\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”>

<span>收藏</span>

</a>

样式方面就自己定义吧,其中,如果文章已经收藏过了,会在收藏按钮的a标签上多一个on的类,你可以使用这个类定义收藏过的样式。最后,还需要有一段JS文件,你可以放到您的footer.php中。

<script> $(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’a.shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’).click(function(){

var id = $(this).data(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”id\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”);

$.ajax({

url: \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”/wp-admin/admin-ajax.php\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”,

type:\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’post\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,

dataType:\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’json\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,

data:{action:\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’post_shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,id:id},

success: function(data){

layer.alert(data.msg, function(){

location.reload();

});

}

});

});</script>

为了更好的体验效果,收藏成功以及取消成功的消息提示使用了layer这个jQuery弹出层插件,所以,您还需要在主题中引入这个框架的文件(下载地址),下载后把整个文件夹放到您的主题目录中,然后在主题头部引入layer.js

通过以上方法已经完成了对文章的收藏及取消收藏功能(只有登录用户才能收藏)。收藏后大家肯定还需要获取出来每个用户自己收藏的文章的列表,以往使用插件获取收藏列表的时候样式都是固定的,自定义起来就要改插件,但是使用上面的方法,获取收藏列表的时候你想展示什么样的列表就看你自己了。获取方法如下:

<?php

$paged = (get_query_var(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’paged\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’)) ? get_query_var(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’paged\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’) : 1;

$args=array(

\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’cat\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’ => 5, // 分类ID,如果不需要限定是哪个分类,可以不写这个条件

\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’showposts\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’ => 16,

\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’paged\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’ => $paged,

);

query_posts($args);

if(have_posts()) : while (have_posts()) : the_post();

?>

<?php

$shoucangmeta1 = explode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,get_post_meta($id,\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’,true));

$shoucangmeta = array_filter($shoucangmeta1);

?>

<?php if(in_array(get_current_user_id(),$shoucangmeta)){ ?>

<li>

<a class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”videolistbox\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” href=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”https://www.wpzt.net/<?php%20the_permalink();?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” title=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”<?php the_title();?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”>

<div class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”thumbbox\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”>

<?php $thumburl = wp_get_attachment_image_src( get_post_thumbnail_id(get_the_ID()), array(400,270));?>

<img class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”defaultthumb\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” src=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”https://www.wpzt.net/<?php%20echo%20$thumburl[0];?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” alt=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”<?php the_title();?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” title=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”<?php the_title();?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”>

<i class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”videobutton fa fa-caret-square-o-right\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”></i>

</div>

<h3><?php the_title();?></h3>

<div class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”videolisttag\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”>

<span>

<i class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”fa fa-calendar\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” aria-hidden=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”true\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”></i>

<?php the_time(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’m,d\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’);?>

</span>

<span>

<i class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”fa fa-eye\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” aria-hidden=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”true\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”></i>

<?php post_views(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’ \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’, \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’ 次\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’); ?>

</span>

<div class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”clearfix\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”></div>

</div>

</a>

<a class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”posteditbutton shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” data-id=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”<?php the_ID();?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” href=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”javascript:;\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”>取消收藏</a>

</li>

<?php } ?>

<?php endwhile; else : ?>

<div class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”sp-mod-empty\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”>

<img src=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”https://www.wpzt.net/<?php%20bloginfo(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’template_directory\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\’);%20?>/images/empty.jpg\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\” class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”empty-images\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”>

<p class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”empty-txt\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”>您还没有收藏任何弹唱视频哦~</p>

</div>

<?php endif;?>

<div class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”clearfix\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”></div>

<div class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”page_navi text-center\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”>

<?php par_pagenavi(9); ?>

</div>

<?php wp_reset_query(); ?>

仔细看上面的代码,其实就是普通的循环获取文章,只不过在循环中多了个判断,判断当前用户的id是否在获取到的文章的\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”shoucang\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\”这个字段里,如果在则显示出来。

发表评论