How do I put the "enjoy" and "share" button for each blog post?

Question

How do I put the "enjoy" and "share" button for each blog post?

Navigation

#1 by (3 votes)
#2 by (2 votes)

2

I've added a Like and share button to the posts footer from my Blog, so that the reader has the option to choose Like or not, only that post . But clicking on Like, I noticed that the button did not share the post , but rather the blog.

Could anyone help me solve this problem? I would like to know how to put a Like and share button that allows the reader to short only that post What are you reading?

The platform used is Blogger. I have some static pages and for these, yes, I would like the option to like these pages. I used code generated from Facebook Developers in Social Pluggins:

 <!-- Insere "curtir" e "compartilhar" do facebook -->
<div id='fb-root'/>
<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 = "//connect.facebook.net/pt_BR/sdk.js#xfbml=1&amp;version=v2.5";
  fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script>

Código HTML:
<!-- insere o botão "curtir" e o "compartilhar" do facebook -->
<div class="fb-like" data-href="http://enchendoacaixa.blogspot.com.br/" data-layout="button_count" data-action="like" data-show-faces="true" data-share="true"></div>

Thanks in advance!

html facebook blogger

asked by anonymous 06.02.2016 / 00:18

2 answers

2

For the share button, go to the Edit HTML of your blog and search for

<div class='post-header-line-1'/>

Underneath that, put this:

<div style="float:left;padding:4px;">
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/>
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/></div>

Ihopeyoucan.Hugs.Doubts?Commentonmyanswer.

Iforgottospeak.Aftermakingthechanges,gotoDesign>PageElements

Lookforthesquarefor"Blog Posts" and click edit. Then check the boxes for the share and save.

06.02.2016 / 20:06

Ident and color VB.Net code What is the difference between primary key and index in mysql?

score 3 · Accepted Answer

This happens because you're setting the homepage link on your blog as the link to be tanned / shared in the code that generates this button:

data-href="http://enchendoacaixa.blogspot.com.br/"

In order for it to function as a sharing button for each post, you'll have to modify this code and change it to:

expr:href='data:post.url'

which is the tracking code that takes the URL's of each Blogger publication waived by Google for these and other purposes.

However, in order for it to work and get every correct link for each post, the code needs to be inserted within the loop of each item / publication, ie it should be inserted inside the / container which generates each unique item / publication within your theme. Which will be inside a code similar to this below:

<b:includable id='post' var='post'>
    ....
</b:includable>

After finding this code you already know that you are inside the code that generates each item / publication. Inside this same code excerpt look for the best place where you want to implement the Like button button and paste it into the post in the best place that you think will stay. All together the code will look something like:

<!-- Insere "curtir" e "compartilhar" do facebook -->
<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 = "//connect.facebook.net/pt_BR/sdk.js#xfbml=1&amp;version=v2.5";
  fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));
</script>

<!-- insere o botão "curtir" e o "compartilhar" do facebook -->
<div class='fb-like' data-action='like' data-layout='button_count' data-share='true' data-show-faces='true' expr:href='data:post.url'/>

Note: Do not forget to always change the quotation marks " " to ' ' , I already made this change in the code that generates the buttons.