BloggerHero - Blogger Tuts, SEO, Themes, Gadgets
Inspired by Material Design

Add Flare Social Widget to Blogger


Hi guys, Its been a long time I din't post as I was busy with my Exams. But finally my exams are over now so I'm here for posting some awesome Blogger Tricks and Widgets.
Today's our post is "How To Add Flare - A Social Share Widget from Wordpress To Blogger"
You guys might have seen the this widget on mostly wordpress blogs, there is no question about it that its truly awesome, It contains large variety of Social Sharing Buttons including the number of total share or say Flare Score. Its one of the best way of sharing your content nowadays.
Try out the Live Demo ;)
Add Flare Social Widget to Blogger

Why Flare?

This is an Eye Catching Share Bar and I'm damn sure that your content will get shared almost each time the visitor reads your article. The main fact about it that you can customize it totally including the color of every icon, size, shape [round/square] , the position of the widget, you can place it below your post title at left / center or middle, also you can make it floating on left or right side. You can change the module color also. The gradient colors are superb, you should try the Shine ! Well lets see how to install it on blogger.

How To Install Flare on Blogger?

These are some simple steps by which you can add the Flare Widget successfully on your blog.
1. Go to Flare.
2. Click on Install Now at the right sidebar of page.
3. Enter your Email Address and Signup.
4. Now you will get your own custom code snippet there, just copy it and paste it before </head> code it your HTML. After copying Save the Template.
5. Now click I'm Ready and then enter your Blog Home Page link there and hit Check Domain.
6. After successful checking you will get three api apps, select Flare and then you need to do some customizations.
7. Select the Flare from Left Sidebar, Click on Create New, after that let it load the social icons and customization filaments.
8. Select the Social Buttons which you want and then try other options like shape, color gradient, icon color,  icon logo color, selection of position of flare bar etc.
9. After completing all customizations , hit save.
10. Now drag your Flare Bar Box into middle column where you will see All Pages.
That's it, you are done ! Go to Your Blog and Check it. I hope you would like this new Wordpress Widget for Blogger :)
If you have any problem regarding this post simply drop your comment here or feel free to contact with me and your views and opinions are appreciated.


  1. Good widget and nicely explained. keep it up.

  2. Thanks for the tutorial! Worked like a charm. only problem is that all of the flare bars have the same "numbers" when on the main home page of my blog. When you click individual posts, then it gives the correct numbers. not sure if i didn't something wrong.

    1. you did everything perfect, here is the tweak, find the code in your template and put this line of code before your code.

      [b:if cond='data:blog.pageType != "item"']

      your widget code


      replace [] with <>

      Thanks for your feedback, I hope this will work :)
      Stay Connected ;)

    2. Thanks so much for replying to help ! I just did what you wrote... but it ended up taking the flare bar off the individual posts. I'm not sure if I goofed it up. I tried to follow your instruction exactly. Just wanted you to know that it didn't work.

    3. ohh can you give me your blog link?
      I'm glad that you have resposnced me back ^_^
      you can also try out some awesome social share widgets here, just hit the Social Share Widgets from labels or try manually ;-)

  3. "Specify a custom CSS selector to limit where Flare appears. For example, to limit to post pages on many websites use: body.single-post .entry-content."

    Noted above from Flare - what would be the CSS to make these ONLY show on my posts pages, not the main hub? Thanks in Advance!

    1. This comment has been removed by the author.

    2. I have the same question. I put that code into the box in Flare and it removed the social media buttons from my site all together.

  4. thanks such a nice creativity flare social widgets.......

  5. Wow..Awesome widget already working on it for my blog for downloading free movies..Thinking that this will give it a sharing boost.

  6. Great widget! However, why are the buttons always arranged in alphabetical order? Even if I edit and rearrange them, the change is not reflected on my website.

  7. Nicely explained, i made it, but yet not showing on live! Flare page shows me tags, but not visible on my webpage @, kindly do suggest steps to overcome.

  8. I tried installing this yesterday but I can't get it to show up on the side of my post - it only shows up at the top and even then people can't click on most of the buttons. Why is that? Thanks.


Powered by Blogger.