Facebook Share Button Code with PHP

PHP
f t g+ in

You can create your own custom Facebook share buttons which use dynamic URLs of your web pages with the help of a server side programming language. In this tutorial, I will show you how to create a share button for non-static URLs using PHP.

Imagine that you have a website which uses a CMS (Content Management System) such as WordPress for its backend or a custom built website which uses a server-side programming language such as PHP to generate dynamic pages. Most static websites with only a couple of pages don't need such a structure; however, websites with lots of pages, online stores with thousands of products, blogs with many posts, forums with a lot of threads etc., especially if they are frequently updated and new pages are added, certainly need a dynamic structure for easier maintenance and updates.

Such a dynamic website uses specific files (PHP files in this case) to establish and display the structure of the site, while storing the content -usually- in a database. In some cases, many of the same type of pages (e.g. blog posts, product pages, news articles) are controlled via a single PHP file such as page.php, post.php, product.php or something similar. Each page on such a dynamic site is controlled with the same file, but the URLs (permalink) of those pages are still different, due to the use of certain scripts and server rewrite rules.

TIP: On a website, no two pages can have the exact same URL, since otherwise the server will not be able to locate the correct page to display.

In some other tutorials, I showed adding Facebook like and share buttons, as well as adding a share button with no script and multiple share buttons on the same page. In this tutorial, I will focus on how to use PHP for generating the correct dynamic URLs to use in the custom share buttons. You may want to refresh your PHP knowledge by checking the PHP syntax and how PHP works, before we start.

Custom Facebook Share Button for Dynamic Pages with PHP

If we were to put the share button on a static page, or if we were to use the default share button Facebook provides on its Share Button Configurator we would simply insert the code it generates into the page and it would handle the URLs for both static and dynamic pages correctly. What we are doing here is slightly different as we are building our own custom Facebook share button using our own style.

Now, let's see how to do it.

STEP 1: Get the URL of the Current Page

The first step is to get the URL of the current page, the page the visitor has open in her browser, and store it in a PHP variable with the following code:

$url = 'http://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];

You can put this code to the top of your PHP page file inside PHP tags:

<?php
$url = 'http://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];
?>

I named the variable as $url for simplicity, you can name it as you wish. If you have SSL on your website, use https instead of http or if you prefer you can also use a simple script to identify your connection type. The $_SERVER['HTTP_HOST'] global server variable gives the domain (or subdomain) your website is located at and the $_SERVER['REQUEST_URI'] variable gives the URI of the current page. For this site, these variables give the following values:

$_SERVER['HTTP_HOST'] = www.tutsandtips.com
$_SERVER['REQUEST_URI'] = /php/facebook-share-button-code-with-php/

So, the $url variable, in this case will give the full URL of the current page like the following:

http://www.tutsandtips.com/php/facebook-share-button-code-with-php/

Since the URL is generated dynamically, we can now use this variable in our custom share button.

STEP 2: Insert the Dynamic URL in Custom Share Button

The next step is to put the $url variable into the custom share button link. The URL Facebook uses for sharing web pages is:

https://www.facebook.com/sharer/sharer.php?u=DYNAMIC_URL_GOES_HERE

If we put this URL in our link and insert the $url variable, we will have the following:

<a href="https://www.facebook.com/sharer/sharer.php?u=<?php echo $url ?>">Share on Facebook</a>

You can insert the above link on your page at a position where you want to display the share button. For example, on this site, I have used the same code for the Share buttons that you see at the top and bottom of this post. If you hover your mouse over those buttons or click on them, you can see the link in action.

You can add styles to the link by assigning it an id or class, and make the link open in a new tab by adding target attribute:

<a class="facebook-share" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=<?php echo $url ?>">Share on Facebook</a>

To conclude our tutorial, we can say that this is a great way to create custom Facebook share buttons with PHP as it gives you control over the style. I hope that you will find this tutorial helpful and share it with other developers.

Was this post helpful?

If you found this post to be helpful, please share it! Thank you :)

f t g+ in