Peter Weston

How To: Install ThumbsUp in wordpress

Installing ThumbsUp into wordpress only takes a few minutes and generally follows the same instructions given by the author.

ThumbsUp is a PHP voting script which allows visitors to vote for anything you want on your website.

Installing ThumbsUp into wordpress only takes a few minutes and generally follows the same instructions given by the author. I’ve made a small demo to show potential areas you can rate.

For the sake of simplicity this tutorial assumes you are up to the Uploading ThumbsUp step.

Uploading ThumbsUp

Use your favorite FTP application to upload the whole “thumbsup” folder to your wordpress directory

Including ThumbsUp in wordpress

Add the following function into your wordpress themes function.php file.

function add_thumbsup(){
      include './thumbsup/init.php';
      echo ThumbsUp::css();
      echo '<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>';
      echo ThumbsUp::javascript();
}
add_action('wp_head', 'add_thumbsup');

Note: If you are getting init.php errors try replacing the relative path used above ./thumbsup/init.php with your full server path.

Whats it do you ask? This function hooks into wp_head adding the required css and jquery into our themes header.

Now we can add create ThumbsUp items on anything in wordpress with a unique identifier such as wordpress posts, comments, pages and taxonomies.

Creating ThumbsUp Items

In your themes single.php you can add the thumb anywhere in the post loop using a rating describer (I used post_) and your posts id as the item name.

<?php $ThumbUpID = 'post_'.get_the_ID(); echo ThumbsUp::item($ThumbUpID)->template('thumbs_up_down')->options('align=left'); ?>

Note: I’ve used post_ with post id as an item name to further identify what is being rated. You will want to do this especially if you want to use ThumbsUp with other items otherwise you take the risk of having conflicting item names.

Get posts by rating

Add the following function into your themes function.php file. The function returns results based on parameters given which you will need to loop through to display in wordpress.

function get_thumbs_posts($orderby='votes_balance', $limit='10', $sort='DESC', $type='post') {
	global $wpdb;
	$limit = $limit;
	if(!empty($limit)){
		$limit = 'LIMIT '.$limit;
	}
	$results = $wpdb->get_results("SELECT DISTINCT * FROM $wpdb->posts INNER JOIN (SELECT *, SUBSTRING(name, 6) as 'post_ID', votes_up - votes_down AS votes_balance, votes_up + votes_down AS votes_total FROM thumbsup_items) AS thumbsup ON $wpdb->posts.ID = thumbsup.post_ID WHERE $wpdb->posts.post_status = 'publish' AND $wpdb->posts.post_type = '$type' AND $wpdb->posts.post_password = '' ORDER BY $orderby $sort $limit");
	return $results;
}

Note the function parameters

  • orderby – votes_total, votes_balance [default]
  • sort – ASC, DESC [default]
  • limit – use to limit results by a number, 10 [default]
  • type – page, post [default]

Important: This function will only work correctly if your rating describer is a 5 letter string, in this tutorials case post_ is so it will work fine.

Loop Example

The example demo loops through the results to show the top 3 posts in the sidebar. This is done by calling our function to get the result and looping through it.

<?php
   $thumblist = get_thumbs_posts('votes_balance', '3');
   foreach ($thumblist as $post) :
   $url = get_permalink( $post->ID );
?>
<li><a href="<?php echo $url ?>"><?php echo $post->post_title ?></a></li>;
<?php endforeach; ?>

If you have a better way of doing this or have a suggestion feel free to post a comment below.

Retrieving Users WordPress ID

Note: I am no php expert however I found this works for me.

In your config.php file add the following above the array:

function get_userid(){
  global $user_ID;
  return $user_ID;
}

Then make sure you set your user_id_callback in your config.php to:

'user_id_callback' => 'get_userid',

You may also want to set ‘user_id_check’ to TRUE.

Now go into classes/thumbsup.php and add before the class declaration:

require_once('/yourwordpresspath/wp-load.php');

Note: Replace the path with your own.

Now you should notice that when wordpress registered users vote their ID will be recorded in the thumbsup_votes table. Which you can use [with a sql query and loop] to show posts users have voted on.

66 Responses

Page 1 of 1
  1. Jeremy
    Jeremy December 8, 2010 at 5:47 AM |

    Thanks for the guide. I was looking for a better tutorial then the one provided for this on code canyon. Thanks!!!!

    Reply
  2. Ben Cope
    Ben Cope December 13, 2010 at 4:39 AM |

    I’ve added the necessary code to my functions.php file, and I am able to get the individual posts to display the ThumbsUp, but I am not able to display the top rated posts on my homepage or in my sidebar … I have copied your get_thumbs_posts function exactly as you have it here and I even have the rating describer set to post_ as you have in your example. Any ideas on what I may be doing wrong?

    Reply
  3. chris
    chris December 17, 2010 at 3:04 AM |

    I’m wondering if anyones been able to do the following;

    Retrieve popular posts within the last (24hours / 7 days / month / all time) – Published within x amount of time.

    And;

    Linking the voting to the wordpress memberbase so you can put on user profile, User x voted on ‘post titile’.

    Would this be possible with the script?

    Reply
  4. Chris
    Chris December 19, 2010 at 4:31 AM |

    Wow thanks Peter for the great start in helping. I see that i just need to play around with the code, I’m no expert at php either but i can make sense of it usually so your updates are a great help.

    much appreciated.

    Reply
  5. cobydick
    cobydick December 21, 2010 at 5:37 PM |

    Hello! Thank you for this guide! Ia followed your instructions, but after I added the code into functions.php, I get this warnings on my page:

    Warning: include(./thumbsup/init.php) [function.include]: failed to open stream: No such file or directory in /home/lowdowno/public_html/wp-content/themes/anarchy-wall-10/functions.php on line 6

    Warning: include(./thumbsup/init.php) [function.include]: failed to open stream: No such file or directory in /home/lowdowno/public_html/wp-content/themes/anarchy-wall-10/functions.php on line 6

    Warning: include() [function.include]: Failed opening ‘./thumbsup/init.php’ for inclusion (include_path=’.:/usr/lib/php:/usr/local/lib/php’) in /home/lowdowno/public_html/wp-content/themes/anarchy-wall-10/functions.php on line 6

    Fatal error: Class ‘ThumbsUp’ not found in /home/lowdowno/public_html/wp-content/themes/anarchy-wall-10/functions.php on line 7

    Could you maybe help me? Thank you!

    Reply
  6. Jeremy
    Jeremy January 5, 2011 at 6:31 AM |

    Is this tutorial for version 1.1.0? Thanks. I do not see a init.php file.

    Reply
  7. Dan
    Dan January 6, 2011 at 5:09 PM |

    Hi Peter,
    I am also getting the same errors as cobydick.

    I have wordpress in my root directory and I have have thumbsup in the root as well.

    It’s this part: include ‘./thumbsup/init.php’;
    thats messing it up I think because ./ is relative to the current directory which for me is

    wp-content/themes/my theme/functions.php thats where I am entering the code, correct?

    I’m new to all of this so sorry if I’m being stupid…

    So do I have to put the thumbsup folder in my theme directory or what do I change the structure to?

    I anxiously await your reply :)

    Thanks

    Reply
  8. Dan
    Dan January 6, 2011 at 5:17 PM |

    Oh, another thing….

    Is it possible to display thumbsup in pages as well?

    Thanks in advance

    Reply
  9. Dan
    Dan January 7, 2011 at 7:08 AM |

    Sorry for being such a pain but could you also confirm something for me.

    To get the minithumbs beside comments do you add the code to comments.php? and is their any extra code needed?

    Once again, thanks for the help and tutorial as thier is no official support for intergrating with wordpress.

    Reply
  10. Dan
    Dan January 7, 2011 at 10:50 AM |

    Sorry for double posting.

    Here is the code I found

    <input type="text" name="author" id="author" value="" size="32" tabindex="1" />Name
    I tried adding the thumbsup code here but no thumbs showed up in comments.

    <input type="text" name="email" id="email" value="" size="32" tabindex="2" />E-Mail

    <input type="text" name="url" id="url" value="" size="32" tabindex="3" />Website

    Does it only show thumbsup on comments that get posted after I have inserted the code? If so, I might have put the code in right place? It just needs new comments?

    Thanks

    Reply
  11. dan
    dan January 7, 2011 at 11:00 AM |

    The above is not the correct code. For some reason the code has been cut off… I used the tag as well, weird…

    Basically this is the main part: php echo $comment_author;

    I removed the php tags.

    Reply
  12. Anssi Eriksson
    Anssi Eriksson January 30, 2011 at 2:28 AM |

    Great tutorial, I am sure everyone appreciates your efforts, I know they’ve helped me very much.

    How would you display the most voted posts from a certain time period?
    The following snippet should set the time:

    <?php $mylimit=30 * 86400; //days * seconds per day
    $post_age = date('U') - get_post_time('U');
    if ($post_age

    the problem is, how should I integrate with Thumbsup so it shows most voted from that time period? Also, is the post limit mandatory?

    Thanks.

    Reply
  13. Brian
    Brian February 13, 2011 at 7:50 AM |

    I ran this code and it’s not displaying the “Top Articles” at all. Any idea?

    Reply
  14. jpx3m
    jpx3m March 23, 2011 at 6:45 PM |

    thanks for this tutorial…
    i am however having some strange problem…
    i placed this:

    include (‘/home/useraccount/public_html/photography/thumbsup/init.php’);

    in my functions.php and it includes just fine..

    however i get this in my source:

    and inside that is the 4040 page of wordpress saying it cannot find init.min.js.php

    what could be going wrong? thanks…

    Reply
    1. jpx3m
      jpx3m March 23, 2011 at 11:19 PM |

      sorry my bad… got it working now.. thanks… :)

      Reply
  15. polz79
    polz79 March 24, 2011 at 6:27 AM |

    Hi Peter,
    thanks for this guide!

    I have a problem when i try to create a thumbsup item. I don’t understand the “post_” and where i have to put the post id and item name in this code, template(‘thumbs_up_down’)->options(‘align=left’); ?>

    Could you make an example? I’m not a programmer and i’m gonna be crazy!

    Please, can you help me?

    Thank you very much for your patience

    Reply
  16. polz79
    polz79 March 24, 2011 at 6:29 AM |

    sorry I leaved some code on my textedit :)
    i’m talking about this code: template(‘thumbs_up_down’)->options(‘align=left’); ?>

    Reply
  17. Robert
    Robert March 29, 2011 at 12:09 PM |

    I’ve added everything as per instructions – but I get the following error:

    PHP Fatal error – when I load the page – class thumbsup not found on line 11.

    I’ve tested everything I know, but can’t figure this out

    if you visit my site > http://socialmediaseo.net and open any article, you’ll see the content missing below the title.

    that’s where my error is

    any thoughts?

    Reply
  18. Ignacio
    Ignacio April 17, 2011 at 6:09 PM |

    Fatal error: Class ‘PDO’ not found in …/public_html/wordpress/thumbsup/classes/thumbsup.php on line 65

    Reply
  19. Ryan
    Ryan July 14, 2011 at 1:31 AM |

    Thanks for this awesome guide!

    Question: All I’m trying to do is place a Thumbs Up icon next to pieces of text on a WP page on my site (just allowing users to vote on each line of text). Would I be able to do this using this script, or does it only work with use in posts/comments/etc.?

    Reply
  20. drew
    drew July 29, 2011 at 5:55 AM |

    no matter what i try i cannot log in to my admin .
    i use this username :- demo and password:-89e495e7941cf9e40e6980d14a16bf023ccd4c91

    please help

    Reply
    1. Erick
      Erick September 6, 2011 at 4:17 AM |

      Drew, I believe the “89e495e7941cf9e40e6980d14a16bf023ccd4c91″ is actually “demo”, it was just encoded using SHA1 HASH, go here to encode your own password , simply put your password in the box and submit.

      Reply
  21. Pblqnoxn
    Pblqnoxn August 30, 2011 at 7:50 AM |

    I can’t hear you very well black loli naked pic 611

    Reply
  22. Erick
    Erick September 6, 2011 at 4:13 AM |

    Hello Peter, quick question, how would I go about creating the TumbsUp items without just using the Post ID, but rather the post name, custom post type and custom post type category?

    Reply
    1. Erick
      Erick September 6, 2011 at 4:38 AM |

      I was able to add the post title and custom post type, however, I’m having trouble adding the category. Here’s the code I’ve used: template('thumbs_up')->options('align=left'); ?>

      Reply
    2. Erick
      Erick September 6, 2011 at 4:38 AM |

      template('thumbs_up')->options('align=left'); ?>

      Reply
  23. Erick
    Erick September 6, 2011 at 4:39 AM |

    template('thumbs_up')->options('align=left'); ? >, of course without the php open and closing spaces.

    Reply
  24. Erick
    Erick September 6, 2011 at 4:42 AM |

    Sorry for all the posts, the code is not displaying, I’ll just post the part I changed:
    'post_'.get_the_ID().'_'.get_the_title().'_'.get_post_type();

    Reply
  25. Erick
    Erick September 7, 2011 at 1:40 PM |

    I was able to figure it out, solution: here.

    Reply
  26. stanley
    stanley September 7, 2011 at 10:55 PM |

    How do you enable only registered users to vote. Please kindly share

    Reply
  27. in stereo
    in stereo September 23, 2011 at 7:44 AM |

    Hi Peter!

    Is it possible to replace the usual wp posts query with you solution to get all of the posts ordered by votes? With paged support etc

    Regards Roman

    Reply
  28. maroso
    maroso October 18, 2011 at 11:22 PM |

    How can I create a voting list? A wordpress page/post where people can vote items like ” top 100 …..” and the items can go up/down based on the number of votes.

    PLEASE HELP.

    I do NOT want to vote posts and create a list of top post. I need to vote items ( a list of items) on a post/page.

    Thanks

    Reply
  29. David
    David October 25, 2011 at 1:29 AM |

    Excellent tutorial. Can you post a guide as well for working this out on simple dv boxes with different contents retrieved from mysql? Thanks!

    Reply
  30. Mark
    Mark January 22, 2012 at 2:11 AM |

    Hi Peter, very nice tutorial!

    I’ve downloaded: 1.3.8 – 2011-12-16
    But there is no ./thumbsup/init.php
    file in that version.

    Any suggestions?

    Thanks in advance!

    Reply
    1. Mark
      Mark January 22, 2012 at 3:47 AM |

      Hi again,

      Forgot my first question, solved that one myself.

      Now issue nr. 2:

      I want to place the votebar right under every post, so i think i have to add the ‘thumbsup’ code to my single.php theme file right?

      When i add this line:

      template(‘thumbs_up_down’)->options(‘align=left’); ?>

      to single.php i got this error when entering a page:

      Fatal error: Class “ThumbsUp not found in /home/website/domains/website.com/public_html/wp-content/themes/theme/single.php on line 28

      How to solve this one?

      thanks again!

      Reply
  31. developing
    developing February 9, 2012 at 11:57 AM |

    Great function, i was wondering how could i add the votes total to each post returened?

    Example:
    title one(12)
    title two(11)
    title three(5)

    The number in the brackets being the amount off votes. I managed to edit a template but it only returns the same value for all posts.

    Reply
  32. CodeCanyon - ThumbsUp V2 | Terranbytes
    CodeCanyon - ThumbsUp V2 | Terranbytes February 27, 2012 at 10:25 AM |

    [...] Third party tutorial on how to install ThumbsUp in WordPress. [...]

  33. Mr H
    Mr H June 15, 2012 at 1:34 AM |

    Hi Peter! I am using Headway Themes 3.1.2 and I made my own custom theme. Right now all it has is a functions.php and no single.php in my child theme folder. Do I simply add a file named “single.php” and then add in the code?

    Reply
  34. sundance
    sundance October 7, 2012 at 3:59 PM |

    Great tutorial,
    I used it to show thumbs in comments , but I have problem to filter and display top voted comments , tried to modify your code that display the top rated post in the side bar but no success, if you still checking this post please help
    thanks

    Reply
  35. Dwayne
    Dwayne November 17, 2012 at 2:03 PM |

    Hi Peter,
    I think I did everything correctly, but when I try to add a item I get the following error,

    Fatal error: Uncaught exception ‘PDOException’ with message ‘SQLSTATE[HY000] [2013] Lost connection to MySQL server at ‘reading initial communication packet’, system error: 111′ in /nfs/c08/h02/mnt/121936/domains/fear-monger.com/html/thumbsup/classes/thumbsup.php:70 Stack trace: #0 /nfs/c08/h02/mnt/121936/domains/fear-monger.com/html/thumbsup/classes/thumbsup.php(70): PDO->__construct(‘mysql:dbname=db…’, ‘db121936_fear’, ‘marley0841′, Array) #1 /nfs/c08/h02/mnt/121936/domains/fear-monger.com/html/thumbsup/classes/thumbsup_item.php(121): ThumbsUp::db() #2 /nfs/c08/h02/mnt/121936/domains/fear-monger.com/html/thumbsup/classes/thumbsup.php(214): ThumbsUp_Item::load(‘standup’) #3 /nfs/c08/h02/mnt/121936/domains/fear-monger.com/html/wp-content/themes/reverie/main-page.php(244): ThumbsUp::item(‘standup’) #4 /nfs/c08/h02/mnt/121936/domains/fear-monger.com/html/wp-includes/template-loader.php(43): include(‘/nfs/c08/h02/mn…’) #5 /nfs/c08/h02/mnt/121936/domains/fear-monger.com/html/wp-blog-header.php(16): require_once(‘/nfs/c08/ in /nfs/c08/h02/mnt/121936/domains/fear-monger.com/html/thumbsup/classes/thumbsup.php on line 70

    Any idea what’s going on here?

    Reply
  36. Prakash K V
    Prakash K V December 11, 2012 at 12:24 AM |

    Hi,

    I just downloaded ThumbsUp and installed it on WordPress as per the instructions above (thanks a ton for taking the trouble to help by the way!).

    I have the plugin installed and the thumbs up and down icons are appearing correctly.

    When I click on either button, it even adds a new row correctly in the thumbsup_items table in my DB.

    However after clicking either of the buttons, the count for both Vote Ups and Vote Downs display as “parser error”, and the count is not updated on the database.

    Any idea what could be causing this issue?

    Clearly the DB is connecting correctly, the init.php file is fine too.

    I am at a bit of a loss!

    Would greatly appreciate any help – thanks very much in advance!

    Best regards,

    Prakash

    Reply
  37. ByteMyPixel
    ByteMyPixel February 20, 2013 at 1:06 PM |

    Thanks for the awesome tutorial! What is the best way to get this to work on a custom_post_type?

    I’m using this: template(‘thumbs_up’)->options(‘align=center’); ?>, in my single page view, but it displays both the “thanks for your vote” and “vote” buttons by default, then when clicking on “vote” nothing happens, I just get an eternal spinner. When I refresh, I’m back to square one.

    Am I missing something?

    Thanks so much for any help!

    Reply
  38. Steven
    Steven March 23, 2013 at 5:39 AM |

    Hi Peter

    Great article! I’ve trying to work this out for hours and your article puts it so simply!

    So many people were in need of a simplified WordPress plugin or set of instructions and the author didn’t seem to get onto it.

    I’ve finally got the +1 -1 buttons working but it doesn’t seem like the CSS is working. I have copied just as above…
    template(‘thumbs_up_down’)->options(‘align=left’); ?>

    Yet the thumbs_up_down just displays as regular buttons :(

    Any help would be hugely appreciated!!

    Reply
  39. Evan Rose
    Evan Rose April 9, 2013 at 9:44 AM |

    Your INNER JOIN should be a LEFT JOIN a la http://stackoverflow.com/questions/7588612/how-to-have-sql-inner-join-accept-null-results

    The rest of the post was really helpful. Thank you.

    Reply
  40. Al
    Al June 1, 2013 at 4:22 AM |

    Great tutorial! Very useful.

    I feel like this should all be wrapped up into a plugin to make it easier to insert for WordPress.

    Hmm… :D

    Reply

Leave a Reply