How to Add Social Share Buttons to Your Blog

February 4th, 2014 Tech Tips 1 Comment

So you’ve created a blog, got some post ideas, found some good images, and you’re ready to go viral. Great! Now that you’re done, sit back and get ready to get those free products to review. Just kidding, there is still a lot of (fun) time and work that goes into getting your blog known after pressing the publish button on a post. The first thing to remember is that people online can be lazy, so you want to make it easy for people to share your post if they really like it. That’s why you need good social share buttons. In this post, I’m going to talk about how to add them to your blog (whether that’s WordPress, Blogger, or Tumblr).

Tumblr

The social media app I recommend and am going to use for these examples is ShareThis. I like ShareThis because it’s easy to use and implement across various blog platforms.

Step 1

You need to set up a ShareThis account to get started.

Step 2 – Pick your platform

Click the Get Sharing button and pick the blogging platform you want to use.

share-this-step1

 

Step 3 – The Button Look

Pick the buttons that you like. I am going to go with the ones that show the amount of shares, this usually encourages more people to share.

 step_2

Step 4 – Customize

 

share-this-step-3

 

Now pick the social buttons that you want to use.

I am picking the most common ones, Facebook, Twitter, LinkedIn and email, but you can find any pretty much any social network on there. Pick the ones that will fit for your content and audience. (Hint: it might not be the obvious ones!)

Step 5 – the code

Now you are left with 2 code blocks. The code is labeled Code section 1 which starts as <span and Code section 2 which starts with <script type=

share-this-code

Step 6 – Placing the code

This is where it can get a little tricky. You need to customize the template you are using in Tumblr and add that code. Go to http://www.tumblr.com/customize then click to update HTML. When the side pane opens and shows you all the cool HTML guts of your site, look for (it should be on it’s own line) and add everything from Code selection 2 right before it.

Next, you can go two options depending on where you want your social icons to show up. If you want it at the top of the post, look for {/block:Title} and paste the Code selection 1 right after it OR if you want it at the bottom, find {block:Posts} and paste it right before that.

 

Step 7 – Check it out!

step_7

Hit Update Preview and see how your new social buttons look on your tumblr, now all you have to do is upload a ton of cat pics and get ready to go viral.

Social Sharing Buttons Example

Sign up for the AmpliFound Newsletter!

Most Popular Posts

What's New

We Want to Hear from You!

Sweet! You're Almost Done!