0

I want to add Like & Dislike functionality into my custom post type, called game.

I have placed like and dislike icon links in my post footer.

Desired Behaviour:

When a user clicks the like icon, I want to check if (s)he already voted for it and if not then create or update post like count meta key inside the post meta and same goes for the user meta.

Problem:

The problem is when a user clicks the like button, I have to handle it inside the JavaScript but I am not sure how to call

set_post_meta($post->ID)

or

update_post_meta($post->ID)

from JavaScript.

Loop:

<?php while ( $r->have_posts() ) : $r->the_post();?>
    <?php if (has_post_thumbnail()): ?>
        <?php the_post_thumbnail('small'); ?>
    <?php endif;?>
    <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
    <div class="game-footer">
        <div class="like-dislike-btn-div">
            <i class="game-footer-like-btn fa fa-thumbs-o-up">0</i>
            <i class="game-footer-dislike-btn fa  fa-thumbs-o-down">0</i>
        </div>
    </div>
<?php  endwhile; ?>
2
  • all this will happen for a logged in user. right?? – BlueSuiter Mar 27 '20 at 9:24
  • @BlueSuiter Yes! It will happen for logged in users. – Prisma Mar 27 '20 at 9:48
1

I hope you are doing well. Here, I am sharing code for recording likes. The code for single.php have the javascript code for making an ajax call to a wp function. This wp function have the code to store like expressions and it will return you the total number of like expressions recorded on post.

I have curated it for only the Logged in users.

Place this code in your functions.php

/* Ajax call */
add_action('wp_ajax_likeExpression', 'likeExpression');
function likeExpression() {
    if(is_user_logged_in()){
        $post_id = $_GET['post_id'];
        $userId = get_current_user_id();
        $metaKey = '_like_on_game_post_';
        $userLikes = get_user_meta($userId, $metaKey, true);

        if(empty($userLikes)){
            update_user_meta($userId, $metaKey, wp_json_encode([$post_id]));
        }else{
            $userLikes = json_decode($userLikes);
            if(!in_array($post_id, $userLikes)){
                array_push($userLikes, $post_id);
                update_user_meta($userId, $metaKey, wp_json_encode($userLikes));
            }
        }

        $postLikeCount = get_post_meta($post_id, '_like_count_on_post_', true);
        update_post_meta($post_id, '_like_count_on_post_', ++$postLikeCount);
        exit($postLikeCount);
    }
}

Place this in single.php, (before footer ends)

<?php if(is_user_logged_in()): ?>
    <script>
    jQuery(function($){
        $('.game-footer-like-btn').on('click', function(){
            $.ajax({
                url: '<?php echo admin_url('admin-ajax.php?action=likeExpression&post_id='.get_the_ID()) ?>',
                method: 'get',
            }).done(function(res){
                console.log(res)
                //if its done
            });
        });
    });
    </script>
<?php endif; ?>

Please, feel free to contact if you any query. Thank You :)

1

I don't understand how u can count like in javascript only. Use wp_ajax_ACTION Hook to call your PHP functions, in your functions.php or in a plugin.

https://developer.wordpress.org/reference/files/wp-admin/admin-ajax.php/

add_action("wp_ajax_my_function", "my_function");

function my_function() {
 // Get parameters send by javascript xhr method

 // Do some stuff
}

add_action("wp_ajax_nopriv_my_function") for no user logged in.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.