Tutorial Installing Share Button AddThis With Counter in Blog AMP
Tutorial Installing Share Button AddThis With Counter in Blog AMP - Hello friend sopintar.blogspot.com SCIENCE & NEWS, In the article that you read this time with the title Tutorial Installing Share Button AddThis With Counter in Blog AMP, we have prepared this article well for you to read and retrieve information in it. hopefully fill in the post
Artikel TUTORIAL, what we write can you understand. OK, happy reading.
link : Tutorial Installing Share Button AddThis With Counter in Blog AMP
link : Tutorial Installing Share Button AddThis With Counter in Blog AMP
Tutorial Installing Share Button AddThis With Counter in Blog AMP - AddThis is a service offered for bloggers to spread their content to various social media. This time I will share how to install AddThis share button with Counter on AMP HTML Blog.
This tool or widget you can customize that you want, like color color, size, and layout of the widget. With this button, will add visitors and automatically will increase the income you get from this blog.
This tutorial I got from Magic Company blog, and I have applied directly to this blog, and the results are satisfactory. On my own blog wear one type of share button with the name Inline. The type of share button you want to use the Floating Bar, Image Sharing, Expanding, and Inline.
How to Install Share Button With Counter On AMP Blog
Please follow the tutorial below if this widget wants to work properly, here's the tutorial.
The first step
Please visit AddThis web and you login there, if you do not have the account please you list first.
Step two
Go to the Tool page, and you create the widget with Inline name. How to make it, please click Add New Tool, then select Share Button, then select Inline (alignment sideways).
Third step
If you have settings, and customize the incan, please Save & Continue. And please click the Tool you have created, and you copy url ra-5863290ccdeac772 and iecc
Step four
Now we attach it to the template, please copy the code below </ head> or </ head> <head /> - & gt; & lt;! - <head /> - & gt;
<b:if cond='data:blog.pageType == "item"'>
<script async='async' custom-element='amp-addthis' src='https://cdn.ampproject.org/v0/amp-addthis-0.1.js'/>
</b:if>
Then save the code below above <b: includable id = 'shareButtons' var = 'post'>
<b:includable id='shareAddThis' var='post'>
<div class='shareAddThis'>
<amp-addthis data-pub-id='ra-5863290ccdeac772' data-widget-id='iecc' expr:data-share-media='data:post.firstImageUrl' expr:data-share-title='"Check out this article: " + data:post.title + " - " + data:post.url' height='63' layout='flex-item'>
</amp-addthis>
</div>
</b:includable>
Please replace the text I marked with your pub code and widgetID code like the third step.
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='shareAddThis'/>
</b:if>
Next please copy the code below above or below the post, if I am on top of the post.
.shareAddThis{margin:0;height:53px;overflow:hidden;}
.shareAddThis amp-addthis iframe{margin-top:0;margin-left:-8px;}
@media screen and (max-width:640px){.shareAddThis{height:98px;}}
Please add the following CSS code to make it look neat.
So tutorial that I can give this time, may be useful.
This is the article Tutorial Installing Share Button AddThis With Counter in Blog AMP
So many articles Tutorial Installing Share Button AddThis With Counter in Blog AMP this time, hopefully it can benefit you all. OK, see you in another article.