PHP Click Counter

Like it or Love it

Usually people rely on social media for like buttons, but you can do a lot more by coding them internally on your website including controlling their look and feel. You can match the language and tone for your audience as well, and be less generic. You can even have an unlike/hate button.

Instagram 2011 Icon

Old Instagram

Instagram 2022 Icon

New Instagram

Use your imagination. For example, you can have an image gallery and each image can have its own like button. Find out what your visitors like best.

The count could be hidden until you click. This could be used for voting between selections, and you can limit votes or keep them unlimited.

The unlove button, which is optional, removes a count of 1 from the love button counter. This feature was confusing so it has been removed.

You can have the PHP script collect different like counts for each page or point the script to the same counter. You do this by adding a variable from the page in the counter filename. So like.txt would be about-us-like.txt, for example.

I have made some PHP additions not public. The numbers now format in English formatting. This adds a comma separator over for the thousands placement. So 1000000 would be 1,000,000. I have also added the ability to detect a second click on the same button in a row, and by using conditional statements the output is based on that scenario.

April 7, 2024 Update: Changes in features and code cleanup.

April 5, 2024 Update: The like and love buttons have been progressively enhanced with JavaScript to avoid a page reload.

April 3, 2024 Update: I have made some CSS enhancements. The most obvious is that the icons light up after clicking. In the backend, using a cookie I have disabled the ability to unlove more than twice (for 5 minutes 30 seconds until reload) or twice in a row with JavaScript disabled. JavaScript was added to prevent form resubmission. If this JavaScript is disabled it is possible to continue to resubmit the form on refresh to add more unloves. Same with abusing the browser resource inspector. More backend was added so that more unloves are not possible with that hack until the cookie has expired.

The PHP Code

<?php
if( isset($_POST['like']) && $_POST['like'] == "yes" ) {
incrementLike();
$notice = 'like';
$tellem = 'You like it!';
}

elseif( isset($_POST['love']) && $_POST['love'] == "yes" ) {
incrementLove();
$notice = 'love';
$tellem = 'You love it!';
}

elseif( isset($_POST['love']) && $_POST['love'] == "no" ) {
deincrementLove();
$notice = 'unlove';
$tellem = 'You unlove it!';
}

else {
$notice = 'notclicked';
$tellem = 'Rate it';
;}

function getLike()
{
return (int)file_get_contents("like.txt");
}

function getLove()
{
return (int)file_get_contents("love.txt");
}

function getHate()
{
return (int)file_get_contents("hate.txt");
}

function incrementLike()
{
$count = getLove() + 1;
file_put_contents("like.txt", $count);
}

function incrementLove()
{
$count = getLove() + 1;
file_put_contents("love.txt", $count);
}

function deincrementLove()
{
// $count = getLove() - 1;
// file_put_contents("love.txt", $count);

$count = getHate() + 1;
file_put_contents("hate.txt", $count);
}

?>

The HTML Code (with PHP)

<form action="" method="post">
<input type="hidden" value="yes" name="like">
<button type="submit">
Like <?php echo getLike(); ?>
</button>
</form>

<form action="" method="post">
<input type="hidden" value="yes" name="love">
<button type="submit">
Love <?php echo getLove(); ?>
</button>
</form>

<form action="" method="post">
<input type="hidden" value="no" name="love">
<button type="submit">
Unlove <?php echo getHate(); ?>
</button>
</form>

<?php echo "$tellem"; ?>