Как сделать лайки и дизлайки для записей без плагина
-
Простая функция которая позволяет оценивать посты, ставить плюс или минус.
Данный код нужно вставить, там где должны отображаться кнопки(если архивная страница, то размещать в цикле, если отдельная страница поста, то можно в принципе в любом месте разместить.)
|
1 2 3 4 |
<div class="lp-estimate" > <div title="Отзыв полезен" class="lp-like" id="lk<?php echo $post->ID; ?>" data-like="<?php echo $post->ID; ?>"><?php $like = get_post_meta($post->ID, 'likes', true); if($like) { echo $like; } else { echo '0';} ?></div> <div class="lp-dislike" id="dlk<?php echo $post->ID; ?>" data-dislike="<?php echo $post->ID; ?>"><?php $dislike = get_post_meta($post->ID, 'dislikes', true); if($dislike) { echo $dislike; } else { echo '0';} ?></div> </div> |
Этот код можно поместить в футер
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
<script> jQuery(function($){ var date = new Date(); var days = 30; date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); $('.lp-like').click(function(){ var likevalue = $(this).data('like'); $(this).html('<img src="/wp-content/themes/thrmename/images/loader.gif" />'); $.ajax({ url: "/wp-admin/admin-ajax.php", type:'POST', data: {'action': 'lpestimate','likes': likevalue,}, success: function(data){ $('#lk' + likevalue).html(data); var likename = 'likename_' + likevalue; $.cookie(likename, '1', { expires: date, path: '/' }); }, }); }); $('.lp-dislike').click(function(){ var dislikevalue = $(this).data('dislike'); $(this).html('<img src="/wp-content/themes/thrmename/images/loader.gif" />'); $.ajax({ url: "/wp-admin/admin-ajax.php", type:'POST', data: {'action': 'lpestimate','dislikes': dislikevalue,}, success: function(data){ $('#dlk' + dislikevalue).html(data); var likename = 'likename_' + dislikevalue; $.cookie(likename, '1', { expires: date, path: '/' }); }, }); }); }); </script> |
/wp-content/themes/thrmename/images/loader.gif пути к картинке лоадеру
И последний код, его нужно поместить в файл функции темы
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
//лайк дизлайк function true_load_lpestimate(){ $likes = $_POST[likes]; if($likes){ $likesnum = get_post_meta($likes, 'likes', true); if($_COOKIE['likename_'.$likes] == 1) { if($likesnum) { echo '+'.$likesnum; } else { echo '0'; } } else { $likesnumsum = ($likesnum + 1); update_post_meta($likes, 'likes', $likesnumsum); echo '+'.$likesnumsum; } } $dislikes = $_POST[dislikes]; if($dislikes){ $dislikessnum = get_post_meta($dislikes, 'dislikes', true); if($_COOKIE['likename_'.$dislikes] == 1) { if($dislikessnum) { echo $dislikessnum; } else { echo '0'; } } else { $dislikessnumsum = ($dislikessnum - 1); update_post_meta($dislikes, 'dislikes', $dislikessnumsum); echo $dislikessnumsum; } } die(); } add_action('wp_ajax_lpestimate', 'true_load_lpestimate'); add_action('wp_ajax_nopriv_lpestimate', 'true_load_lpestimate'); |
css оформление
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
.lp-estimate { width: 100px; font-size: 12px; clear: both; overflow: hidden } .lp-like { background: url(/wp-content/themes/thrmename/images/like.png) no-repeat scroll 4px 0px transparent; margin: 6px ; padding: 2px 0 2px 23px; float: left; cursor: pointer; color: green; width: 11px; } .lp-dislike { background: url(/wp-content/themes/thrmename/images/dislike.png) no-repeat scroll 4px 3px transparent; margin: 6px; padding: 2px 0 2px 23px; float: left; cursor: pointer; color: red; width: 11px; } |
/wp-content/themes/thrmename/images/*** пути к картинкам лайк дизлайк
На этом все.
Должно получиться примерно так
(картинка)
