Skip to main content

Dynamic Facebook Share Button for Your website and web pages | No configuration is required !!

Dynamic Facebook Share Button for Your website and web pages | No configuration is required! 😮😮😮😮





I was wondering how to let people share my webpage through Facebook. Even though Facebook Developer Tools let you create a Facebook button with ease you have to go to the developer's page and paste your URL into a box generate code, copy it, and paste wherever you want. but it is not the problem, The real problem is you have to repeat this process whenever you write a new blogpost/ post for your website.


Then you have to use this javascript code for your webpage. It gets your web pages' address with javascript code document.location.href;  and passes it to the Facebook share gadget. here is the code and let the hack begin!!

<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>


<script>
    var x = getElementByClassName('fb-share-button');
    x.data-href = document.location.href;
 </script>
<div class="fb-share-button" 
data-href="#" 
data-layout="button_count">
</div>



the first part of javascript code is to load the Facebook SDK for javascript
and the second part is the code written by me.

it gets the element with the class name 'fb-share-button'
the second line sets the value of attribute 'data-href' which holds the URL to share on Facebook to our page's URL.
document.location.href returns the URL of the currently opened window/tab.

that's all you are ready to be shared on Facebook.
Thank You very much for reading.

if you have 99 issues in your life, Don't make it a 100 without sharing this!!







Comments

Trending Now

Let's talk about cryptography.

Have you ever heard of cryptography?  People write their diaries every day. For many of them, their diary is one of their best friends to whom they tell their every secret. What happens when someone else finds such a diary? That would freak out the dairy's owner for sure. Also, it might put their lives in danger. Wise men always hide their diaries so no one else finds it.  But legends hide their message so that only they can read what they wrote. So even if the diary is found by someone else, they cannot know the secrets. for example, I wrote this in my diary today.   P dyval h isvn wvza hivba jyfwavnyhwof avkhf Can you understand it? This is just a very primitive level of cryptography yet powerful enough to hide what I wrote from 90% of people. I will discuss this type of cryptography in the next blog post. The human used cryptography from the very beginning to share their messages in secret and conceal their inventions. As you may know, many people tried to find a recip...

How to install PIP on Windows easily.

How to install PIP on your Windows PC easily. It is really easy to install pip on your Windows computer. If you have an Ubuntu, then follow this video  :    Now follow these easy steps.... DOWNLOAD GET-PIP.PY Go to  https://bootstrap.pypa.io/get-pip.py  . Right click and select   Save as Then the script will be downloaded. RUN THE GET-PIP.PY  All you have to do is to run the script you downloaded. To do that you have to install Python on your computer and if you have not installed python on your computer please install Python First. To Install Python on your computer, please go to  https://www.python.org/downloads / and download the appropriate setup file and run it on your computer. The open command prompt and navigate to directory which contains the cript you downloaded and run the following command.                  python get-pip.py That's all and make sure you have a better internet c...