wordpressに“いいね”カウントを追加する(WP ULikeプラグイン)
1、プラグインをインストール。有効化を行う。
2、[WP ULike]のメニューが表示されるのでカスタマイズ設定を行う。
ページの何処にボタンを表示するか設定があるが、自由に位置を設定する場合「有効化」を外しておく。
3、表示の為のコードを記入する
◯function.php
■カウントに付く[+]の表記を削除
add_filter('wp_ulike_format_number','wp_ulike_new_format_number',10,3);
function wp_ulike_new_format_number($value, $num, $plus){
if ($num >= 1000 && get_option('wp_ulike_format_number') == '1'):
$value = round($num/1000, 2) . 'K';
else:
$value = $num;
endif;
return $value;
}
■IDを指定していいねを設置
// Ulike button output;
if( !function_exists('get_the_ulike_btn') ){
function get_the_ulike_btn( $post_id ){
global $wp_ulike_class,$wp_user_IP;
$get_post_meta = get_post_meta($post_id, '_liked', true);
$get_like = $get_post_meta != '' ? $get_post_meta : 0;
$return_userID = $wp_ulike_class->get_reutrn_id();
$theme_class = wp_ulike_get_setting( 'wp_ulike_posts', 'theme');
$data = array(
"id" => $post_id , //Post ID
"user_id" => $return_userID, //User ID (if the user is guest, we save ip as user_id with "ip2long" function)
"user_ip" => $wp_user_IP, //User IP
"get_like" => $get_like, //Number Of Likes
"method" => 'likeThis', //JavaScript method
"setting" => 'wp_ulike_posts', //Setting Key
"type" => 'post', //Function type (post/process)
"table" => 'ulike', //posts table
"column" => 'post_id', //ulike table column name
"key" => '_liked', //meta key
"cookie" => 'liked-' //Cookie Name
);
//call wp_get_ulike function from class-ulike calss
$counter = $wp_ulike_class->wp_get_ulike($data);
$wp_ulike = '<div id="wp-ulike-'.$post_id.'" class="wpulike '.$theme_class.'">';
$wp_ulike .= '<div class="counter">'.$counter.'</div>';
$wp_ulike .= '</div>';
$wp_ulike .= $wp_ulike_class->get_liked_users($post_id,'ulike','post_id','wp_ulike_posts');
echo $wp_ulike;
}
}
◯出力ソース
■ 設定した箇所に読み込み
<!--?php if(function_exists('wp_ulike')) wp_ulike('get'); ?-->
■IDを指定していいねを設置 (上記のfunction.phpへの記述を記入しておく)
<?php get_the_ulike_btn( '$post->ID' ); ?>
——————————————
wp_deregister_script(‘jquery’)でwordpressのjsを制限している場合、WP ULikeのJS出力も制限されてしまい、いいねボタンが動かなかった。
その場合、いいねボタンのカウントに使用するjsの設定表記を、別途テンプレートに書き足すことで動作をさせることが出来る。
◯head内
<!-- いいねプラグイン動作用 -->
<script type='text/javascript'>
/* <![CDATA[ */
var ulike_obj = {"ajaxurl":"<?php echo admin_url(); ?>admin-ajax.php","button_text_u":"Unlike","button_text":"Like","button_type":"image","notifications":"0","like_notice":"Thanks! You Liked This.","unlike_notice":"Sorry! You unliked this."};
/* ]]> */
</script>
◯ページ下部/body前
<!-- いいねプラグイン動作用 --> <script type='text/javascript' src='http://10.0.240.89/motex_motto/system/cms/wp-content/plugins/wp-ulike/assets/js/wp-ulike-plugins.js?ver=1.0.1'></script>
参考サイト
-
前の記事
IE11対応 jsによるIEブラウザとバージョンの判別 2017.06.23
-
次の記事
記事の最初の画像を表示 2017.07.12