How To Create Your Own Like Button System for WordPress

This code creates a like style button shortcode you can use on any single post type including posts, products and pages. The button includes a counter which saves the count for each post id.

Styling

The button is styled using 3 CSS rules which also add the icon using Dashicons. This enables you to easily change the button colors and icon.

Settings

The settings appear as a top level menu item in your WordPress Dashboard. The settings enable you to :

  • Enable One-Time Likes so users can only like each post, product or page once after which a modal appears with a notice “You have already liked this post.” You can modify this text on line 34 in the love.js file.
  • Change the button text. default is Like.

Installation

There’s 3 steps :

  1. Upload the file named love.js to your child theme folder
  2. Copy and paste the PHP code to the end of your child themes functions.php file
  3. Copy and paste the CSS to the end of your child themes style.css file.

Usage

You can use the shortcode [like] in your WordPress editor or shortcode block as well as in any type of single .php template file or custom function with hook like this :

echo do_shortcode('[like]');

Was This Tutorial Helpful?

Free

$0

Access only to all free tutorials per month.



Monthly

$75

Access to 10 premium tutorials per month.


Tutorial Request


Includes code guarantee and coding support.

Yearly

$500

Access to 15 premium tutorials per month.


Monthly Tutorial Request


Includes code guarantee and priority coding support.