37

I have a blog hosted by blogger, and I'd like to add StackOverflow's "user flair" to the sidebar or something. How do I do that?

6
  • 3
    go to your flair page: "/users/USER-ID/flair" and read the instructions.
    – mmx
    Commented Jun 8, 2009 at 16:49
  • I did that, and it would be fine if I was editting the full HTML of my blog, instead of using blogger and needing to place something there. Commented Jun 8, 2009 at 16:59
  • @Mehrdad:this would be the best answer if it were not be comment
    – Tofeeq
    Commented Apr 17, 2012 at 16:16
  • This question appears to be off-topic because it is about a third party service not related to Stack Exchange.
    – asheeshr
    Commented Oct 6, 2013 at 10:09
  • 1
    @AsheeshR it's about the user flair which is totally on topic. Commented Oct 6, 2013 at 11:06
  • 2
    Since flair is a plain image nowadays, the answers to this question are pretty much obsolete now. Commented Oct 6, 2013 at 11:41

5 Answers 5

17

In Blogger, go to Layout -> Add Gadget

Select HTML/JavaScript gadget from the list.

enter image description here

Now go to flair tab in your SO profile page. Copy paste that code in this gadget content part(You can leave title part empty if you wish).

To change the theme add ?theme=clean or ?theme=dark to the end of the image URL and you are done!

You can view my Flair : blog

1
  • 1
    The one caveat is that the flair does not work (or at least I was not able to make it work), if you set you blog theme to Dynamic Views.
    – Hossein A
    Commented Jan 14, 2014 at 18:29
29

EDIT: This is a deprecated method and eventually it won't work.

First you need to go to the settings menu, and then click on the Layout tab.

What I did was that I added a "Gadget" to the right column, of type Text.

Then, once the Text editing dialog was shown, click on the HTML view, and then paste in the code necessary.

What I have on my blog is this:

<iframe scrolling="no" frameborder="0" width="210px"
    src="http://stackoverflow.com/users/flair/267.html?theme=clean" marginheight="0"
    height="60px" marginwidth="0"></iframe>
<iframe scrolling="no" frameborder="0" width="210px"
    src="http://serverfault.com/users/flair/345.html?theme=clean" marginheight="0"
    height="60px" marginwidth="0"></iframe>

I found that using the javascript version didn't fit well, so you might want to experiment, but the above works for me. Note that I didn't bother with the CSS changes, so my flair is shown with a white background even though my blog uses a green background.

12
  • +1 - Not sure why this was voted down - you answered the question really well...
    – Shane C. Mason
    Commented Jun 8, 2009 at 16:56
  • Made it CW since this is basically off-topic. Commented Jun 8, 2009 at 16:56
  • I didn't answer it to begin with, I just posted "I'll dig up the details", so I understand the downvote, but people should perhaps read the answers and understand them before they downvote. My original 1-liner answer just said "Hang on, let me find the details and edit my answer". Commented Jun 8, 2009 at 16:57
  • 3
    and why on earth did you think it was necessary? Commented Jun 8, 2009 at 16:58
  • 2
    +1 for the nice answer. (Although I do believe the downvote for a non-answer was well-deserved (it wasn't from me)) Commented Jun 8, 2009 at 17:01
  • 1
    I've found that some off-topic questions are best served by a "Hang on, let me work out the real answer for you", both to give the person asking a hope of getting an answer (because you can't add an answer once the question is closed), and perhaps let the people closing it a sense of "ok, let's wait until this person has answered it". Commented Jun 8, 2009 at 17:09
  • 3
    Actually, Lasse, your "hang on" answer is just insurance that your answer is posted first.
    – Robert S.
    Commented Jun 8, 2009 at 17:33
  • "posted first" doesn't count. Voted up the most counts more. I use these "hang on" type of answers sparingly, and only when I assume the question will be closed pretty quick and I actually have an answer that I'd like to post. So if by "first", you mean "only answer before it was closed", then yes, I'd like to ensure that if I can. Are you saying that's wrong? Commented Jun 8, 2009 at 17:43
  • And just to make the point: I'm not going to change my behavior due to these comments. If I see a similar situation in the future, being a question which is probably going to be closed soon and I actually have an answer that would help, then I will do the same again. Downvote me if you disagree. Rep doesn't matter the slightest at this point anyway. Commented Jun 8, 2009 at 17:47
  • Nope, it's not wrong. See the "fastest gun in the west" post that was made back around August or September. 'Posted first' does count. It gives you the spot to fill in later. It's even suggested as a technique to get more rep in the 'how do I get 200 rep a day' question.
    – Robert S.
    Commented Jun 10, 2009 at 14:58
  • Well, Lasse, your answer sure did help me, and there was no where else I could have made it at the time. Nowadays we have the meta stack overflow, which would do fine for this. Commented Jul 14, 2009 at 13:26
  • This is not working anymore or it's just me?
    – Macarse
    Commented Sep 9, 2010 at 13:17
5

Maybe Blogger has evolved since this was originally answered, but I just started my blog on blogger.com and wanted to add my flair. Following the answer from @Lasse, I did add a Gadget. However, now, it seems that there is a HTML/Javascript gadget.

Once the gadget is added, simply past your flair code inside the text box and voila!. You can check out the result on my blog

1
  • This one works. Just tried it :-) Commented Feb 19, 2013 at 18:53
3

If your using the Dynamic Views, you can add the text gadget as the HTML/Javascript gadget doesn't seem to work. This also applies if you're using classic themes. I made a blog post of how to do it here.

2
  • its working man Commented May 2, 2013 at 7:31
  • Its work. Thankyou for your post & simply way to add the flair through pictures.
    – Hdhams
    Commented Aug 28, 2013 at 10:48
2

You maybe find solution for you at this SO question - What Third Party Tools Exist To Use With Stackoverflow?


StackOverflow.com Badge to display in your Blog

This is a user control written in ASP.NET, but could be easily converted for other server-side platforms, or even converted to JavaScript with the help of a JSON service.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .