Skip to main content
FANCYBLOGGERTRICKS

follow us

How Add Telegram Share Button For Blogger Blogs


Over the years,  the fact cannot be denied that Telegram has became one of the best messaging platform and even completing with Whatsapp who doesn't seems to stop adding more incredible features. There has been tremendous increase in Telegram users which is certainly a good opportunity to spread your blog content.

Telegram share buttons
or share to telegram button had been in existence all this while but mostly on WordPress site or through the help of a third party service like addthis. Implementing share to telegram button will greatly facilitate the blog visitors to share post content to friends or groups on Telegram with ease.
Today, I share how to make Telegram share button for blogger blogs and how to install it.  After setting up telegram share button, you can later combine it with other share buttons as well to make them complete as well.

Also, Telegram Share Button is not using javascript and it's icons uses SVG, so it can be used on both AMP and Non AMP blog without affecting your blog loading speed
Open the below fiddle to see the demo


To Add telegram button to a blogger blog follow the below steps

1. Login to your blogger dashboard
2. Goto Template>> Edit html
3. Now locate where your share buttons are and add the following codes to join telegram button with them.

<a expr:href='&quot;https://telegram.me/share/url?url=&quot; + data:post.url + &quot;&amp;text=Latest%20Post20By%20Fancybloggertricks:&quot;' target="_blank" rel="nofollow noopener" title="Share to Telegram">
<svg class="telegram-icon" width="24px" height="24px"><path fill="#32afed" d="M12,0c-6.626,0 -12,5.372 -12,12c0,6.627 5.374,12 12,12c6.627,0 12,-5.373 12,-12c0,-6.628 -5.373,-12 -12,-12Zm3.224,17.871c0.188,0.133 0.43,0.166 0.646,0.085c0.215,-0.082 0.374,-0.267 0.422,-0.491c0.507,-2.382 1.737,-8.412 2.198,-10.578c0.035,-0.164 -0.023,-0.334 -0.151,-0.443c-0.129,-0.109 -0.307,-0.14 -0.465,-0.082c-2.446,0.906 -9.979,3.732 -13.058,4.871c-0.195,0.073 -0.322,0.26 -0.316,0.467c0.007,0.206 0.146,0.385 0.346,0.445c1.381,0.413 3.193,0.988 3.193,0.988c0,0 0.847,2.558 1.288,3.858c0.056,0.164 0.184,0.292 0.352,0.336c0.169,0.044 0.348,-0.002 0.474,-0.121c0.709,-0.669 1.805,-1.704 1.805,-1.704c0,0 2.084,1.527 3.266,2.369Zm-6.423,-5.062l0.98,3.231l0.218,-2.046c0,0 3.783,-3.413 5.941,-5.358c0.063,-0.057 0.071,-0.153 0.019,-0.22c-0.052,-0.067 -0.148,-0.083 -0.219,-0.037c-2.5,1.596 -6.939,4.43 -6.939,4.43Z"/></svg> <span>Telegram</span>
</a>

4. Now add the below css above </style> , to make the telegram svg icon display

.telegram-icon{fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;vertical-align:middle}

5. Now click Save template and check your blog post to see telegram share button running live on your blogger blog.

Sharing your blog contents on social media networks still remains one of the best ways to publicize your blog. Today we have successfully learnt how to add telegram share button to blogger blog. If you encountered any problems adding this button do let us know through the comment section

You Might Also Like:

Comment Policy: Please write your comments in accordance with the topic of this page post. Comments that contain links will not show up before they are approved
Open Comment