Learn Flutter Framework by Google to Build Beautiful Apps. Learn App Development on FlutterCampus

Ask Question or Answer

You can ask your question or answer the question you know.

How can I use Facebook share plugin in my news portal Site?

Posted on 2019 March 10 at 8:24:32 PM
Actually I am new in programming. I am still on learning phase in web development field. I am still working in some projects. During my work I get many problems. Beside that I am developing a news portal site, I got some problem there and the problem is I am unable to integrate the Facebook share plugin in my website. I am unable to make share of specific news in Facebook. Any way I prefer using PHP #Yii framework. In case you want I will share my project to you bro in gitlab. Inbox me your gitlab account. Hope you will help me bro to sort out this problem.
Keshav chaudhary

1 Answer on this Question

Answered on 2019 March 10 at 9:01:21 PM

There are lots of ways to make share button of Facebook on your website, before doing that I suggest you to set the following meta tags to give meta info to Facebook crawlers. Facebook will show its thumbnail image and its title info on news feed. 

<meta property="og:url" content="url"/>
<meta property="og:type" content="website"/>
<meta property="og:title"  content="page title" />
<meta property="og:description"  content="page brief description" />
<meta property="og:image" content="thumbnail image url"/>

And after that go to https://developers.facebook.com/docs/plugins/share-button/ and generate the code for your share button and place it to your website. It will looks like below. 

<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>

  <!-- Your share button code -->
  <div class="fb-share-button" 
    data-href="https://www.your-domain.com/your-page.html" 
    data-layout="button_count">
  </div>

Here, its a static for specific URL, to make it dynamic, change the data-href value accordingly to your page URL. Or there is an alternative way. Keep a share button link in your website and keep its link like below.   

<?php 
$url = "https://www.merospark.com"; //url of the page.
?>
<a href="https://www.facebook.com/sharer.php?u=<?php echo urlencode($url); ?>" 
rel="nofollow" target="_blank" class='btn btn-lg btn-primary'>Share Button</a>

In this way you can make a dynamic share button without using any SDK

Do you know the answer of this Question ?

Join with us on social media to see our updates on your feed.