How to add social sharing buttons above or below every post in Blogger

In our last post, we helped you prepare a 9 point checklist to make sure that you are on the right track while early in your blogging career. One of the points was to ensure that it is easy enough for your visitors to share your content on their social accounts. As we promised you there, here we are with a how to guide to help you on how exactly you should proceed to put a tick against this suggestion.Though there are a lot of options in front of you when you decide to add sharing buttons on your website or blog, we shall go with one of the most non-obtrusive ones – placing a horizontal sharing bar that contains all the most popular sharing buttons with counters.
A word of free advice: the following guide will make much more sense to you if you have some HTML and CSS know-how. This is not a requirement, though, in any way. And we shall make sure that you don’t face any problem getting these buttons on your Blogger blog by making this guide as newbie friendly as possible.
This is how the sharing buttons will look like and how they will be placed
  1. Sign in to your Blogger Account and go to Template, then select Edit HTML.
  2. In the HTML Editor that pops up, click anywhere in the code section and then press Ctrl. + F. In the Find box, look for data:post.body
  3. Press Enter repeatedly to cycle through the matches found within your code. In case more than one occurences are found, try the below steps with all of them one by one.
  4. If you want to display the sharing buttons before you post starts, add the code segment given below before <data:post.body> tag.
    If you want to display the sharing buttons after your post ends, add the following code after <data:post.body> tag.
    If you want to display the sharing buttons both before and after your post, add the following code both before and after <data:post.body> tag.