Google Flair: Google Blog Bar
(Thanks to SEW for reminding me that I meant to write about this.)
Google recently introduced another nice piece of flair: a “Blog Bar” that lets you pick keywords, and then rotates through relevant posts by fading new links in and out. You can see it in action over on this post by Mark Lucovsky. You can also get a News bar, which is kind of fun too.
It’s really easy to get your own:
Step 1. Go to http://code.google.com/apis/ajaxsearch/wizards.html and click the “Blog Bar Wizard”.
Step 2. Choose the topics and formatting you want. When you click on “Generate code”, you’ll get some HTML that you can copy/paste onto your site. I wanted to keep my HTML clean, so I saved it as a separate file, like this file.
Step 3. If you saved the HTML off in a separate file, edit your website template and add this code wherever you want your blog bar to appear:
<iframe style=”border: 0px none ; width: 90%; height: 60px; margin-left: 1em; margin-top: 0.5em;” src=”http://www.mattcutts.com/files/matt-blog-bar.html” title=”Blog Bar” frameborder=”0″></iframe>
(Change the path to point to your file, of course.) That’s pretty much it. I’m going to put a blog bar (or maybe a news bar) on my individual posts above the comments for a little while to see how it looks. If you are looking for a way to spruce up a blog without much work, the blog and news bars are pretty easy.
Related Posts:- Google Flair: Blog Buzz on Google Video
A little while ago, Ionut noticed that Google Video added a "Blog Buzz" section to its front page. The Blog Buzz shows videos that bloggers... - How to dynamically adjust an iframe’s height
Suppose you want to include a child iframe on your page. You'd like to resize the height of the child iframe so that it doesn't... - Yahoo blog search gone?
Some people have noticed that Yahoo!'s news search no longer shows blogsearch results alongside it. Normally I'd assume that if the blog search in News...
TheMadHat Said,
March 23, 2007 @ 11:31 am
Matt,
Neat little widget. While I was implementing on my site, I noticed you need to have the links open in a new window. Kinda hard to read a page in a 60 pixel window
jeremy schoemaker Said,
March 23, 2007 @ 11:36 am
cool stuff!
I am waiting for someone to make a Blogroll widget that displays the latests posts by all your friends instead of just links to the root of there site. (that doesnt scroll)
Throw Pillows Said,
March 23, 2007 @ 12:01 pm
this is cool.
Martial Development Said,
March 23, 2007 @ 12:40 pm
Yes, it’s a cool tool, but there are similar Wordpress widgets that allow greater customization.
Ryan Said,
March 23, 2007 @ 12:47 pm
Umm, when I click a link in it I just get a very tiny scrollable iframe, that makes it essentially impossible to read anything.
Maybe they should make this open in a new window instead of the current iframe?
Andy Beard Said,
March 23, 2007 @ 12:48 pm
Cool stuff Matt, I just gained some traffic from it for my analysis of the Google Blog Search patent.
Tracked links display as http://www.mattcutts.com/files/matt-blog-bar.html
Jeremy you can already have a sidebar containing the latest posts from all your friends, just use RSS
Simon Said,
March 23, 2007 @ 3:58 pm
Let’s be honest, it’s crap.
Like snap, mybloglog, the blog widget thing, it’s free advertising and not really very appealing, especially aesthetically with a scroll bar amongst other things.
Acutally it’s shocking to see something like that with the Google name next to it! It’s that bad!
Flavio Said,
March 23, 2007 @ 4:34 pm
I agree with martial, it requires the possibility of further customization. I experimented a bit and dropped it because some junk-blogs were showing up. You should be able to use filters: words, popularity, country, etc.

Nice though, hope it moves forward from its alpha status.
Jeremy Schoemaker Said,
March 23, 2007 @ 6:16 pm
Andy I am not sure you know what I mean... What I want is the latest post from each friends blog. Sure I can do it with magpie and rss but I want a simple easy to use plugin that has built in caching
Aaron Pratt Said,
March 23, 2007 @ 8:07 pm
Iframes do not pass pagerank.
Doug Karr Said,
March 23, 2007 @ 9:46 pm
Matt,
I was playing with the blogbar tonight and I’ve got some tips on customizing the blogbar to match your site.
Doug
Fargham Said,
March 24, 2007 @ 1:25 am
wow! A kool widget, and Doug thanks for providing link.
House of Politics Said,
March 24, 2007 @ 1:57 am
That’s pretty cool.
I definitely plan on using the news bar.
Bookmarked this page.
Manni Said,
March 24, 2007 @ 6:01 am
Nice Stuff, i was looking for a button or scroll bar to go back if I miss an intersting link. Is there a possiblity to integrated back and for button?
~Manni
Nick Fitzsimons Said,
March 24, 2007 @ 9:26 am
Looks like it needs a target=”_top” attribute on the links to get around the opens-in-the-iframe problem. (I’m assuming it isn’t using a Strict doctype, where the target attribute isn’t allowed.)
M.W.A. - Matt, please don't approve this Said,
March 24, 2007 @ 9:42 am
Hi Matt,
I don’t know if you knew this, but the code sample you provided won’t work in XHTML strict (iframes are limited in what they can do there).
If you want the XHTML-Strict compliant code, I whipped up a quick sample here. I didn’t want to publicize the link because I didn’t want to hijack your blog with a link drop for something like this (that, and if I post a sample like this it looks like I’m trying to show you up and be arrogant which isn’t the intention at all):
http://www.searchenginefriendlylayouts.com/blogbar-xhtml-strict-code.html
Note: In IE (6 and 7), you’ll have to make sure mattcutts.com is a Trusted Site for it to work because of the cross-site data retrieval. For some reason, in Firefox it’s fine.
Cool tip, though. Thanks.
Harith Said,
March 24, 2007 @ 9:49 am
Matt
Thats a nice Gadget indeed. It will be great if Google blog bar be included in AdSense inventory. I can imagine publishers choosing topics for their blog bars, the rest AdSense take care of!!!!
Anybody else seeing $$$$ in the blog bar
M.W.A. - Matt, please don't approve this Said,
March 24, 2007 @ 9:57 am
Sorry, Matt...if you saw it before, I fixed a bug within IE (and used the default feed just for the sake of getting this done quickly for you).
The blog-bar.html file contains a conditional comment so that the inset border doesn’t show around it when loaded. So you’ll need it too if you want to use it.
Thanks.
Mark Lucovsky Said,
March 24, 2007 @ 11:17 pm
Matt,
If you are going to iframe the blogbar or newsbar, make sure to over-ride the default link target. Just add this option:
linkTarget : GSearch.LINK_TARGET_PARENT
Your net options should be:
var options = {
largeResultSet : false,
title : “The blogsphere”,
horizontal : true,
linkTarget : GSearch.LINK_TARGET_PARENT,
orderBy : GSearch.ORDER_BY_DATE,
autoExecuteList : {
executeList : ["Matt Cutts", "Google", "SEO"]
}
}
Matt G. Said,
March 25, 2007 @ 10:59 am
Not sure if your aware of your plug-in doing this Matt, but in Thunderbird, I get multiple copies of your last 10 blog posts, This time around it has been 50 extra messages in my listings in the past week.
I know there are probably better readers out there than Thunderbird, but I don’t really want a separate reader, and I’m pretty sure I’m not alone. Anyway, if you can fix that issue, I’m sure there is at least one person who would appreciate it.
Harith Said,
March 25, 2007 @ 3:10 pm
Matt
I know it isn’t a big issue for the friends at the plex. However I wish to ask whether we should expect and update of GTBPR soon?
Also.. is it still the case that PR wouldn’t be updated on these two DCs
72.14.207.99
72.14.207.104
Thanks.
Ash Said,
March 25, 2007 @ 7:35 pm
By the way, clicking the Matt Cutts link in it (on the left) opens a Google page in that tiny frame...
Multi-Worded Adam Said,
March 25, 2007 @ 9:24 pm
keniki, you got my curiosity piqued with that last post.
Don’t suppose you could share the thought with the class, could you?
dockarl Said,
March 25, 2007 @ 9:41 pm
Matt - you may want to check this link - http://www.labs.darkseoteam.com/noarchive/not-trapping-users-data-good/
M
Hiren Modi Said,
March 26, 2007 @ 1:52 am
This is greatooo!!!
York Pubs Said,
March 26, 2007 @ 2:23 am
Matt these changing link change to fast. I cant see the link long enough to click on the one i am interested in
Slow it down imo ... information is good but .. not everyone one has black belt reaction speed on the mouse button. Also, do remember the average reading age of a internet user is something like 16 years of age. Lastly, how will screen reader technology be able to cope with this? Will the blind and partially sighted miss out on his stuff?
Mr.pH Said,
March 26, 2007 @ 2:28 am
Isn’t the story 1.5 years old? Post dockarl pointed to is from October 2005.
Amar Said,
March 26, 2007 @ 3:22 am
This is really cool. I placed the same in my blog :).
Noneq Said,
March 26, 2007 @ 6:23 pm
It would be a better tool if it were a little bit slower, more web 2.0 and opening links in a new window.
But I support bringing different content idea. Useful tool, but needs some make-up.
Multi-Worded Adam Said,
March 26, 2007 @ 11:38 pm
I’m confused by one thing: could you not just block the proxy server itself by IP? Chances are that not too many people would be using screen readers and proxies anyway.
Or am I missing something because it’s 2:30 and I can’t sleep?
Deb Said,
March 27, 2007 @ 7:00 am
Thanks Matt I added it my site but there are two issues
1.when user click on it it doesn’t open in new window - the issue must be solved otherwise the user go from my site.
2.I can’t use your code - XHTML doesn’t support it, and sorry I can’t use ifram in my site.
please advice.
thanks
Deb
Multi-Worded Adam Said,
March 27, 2007 @ 7:41 am
Deb: http://www.searchenginefriendlylayouts.com/blogbar-xhtml-strict-code.html .
Matt, I’m not trying to be a smartass when I ask this, but how come you didn’t just take the code and edit the original post with it? It wouldn’t have bothered me any if you did; that’s why I passed it privately. Guess I didn’t make it overly clear though. My bad. Sorry about that.
darkblack Said,
March 30, 2007 @ 3:48 am
what is the use of the text which we enter in “title” ?? i dont get it in the blog bar anwhere. instead i see the keywords in the blog bar (left of the links)
Charles Said,
April 3, 2007 @ 1:13 pm
Very cool little gadget.
Seferm Said,
April 20, 2007 @ 2:41 pm
The Google Blog bar is cool. I have a website and looking at having a blog that will feature the bar.
Felsefe Said,
July 12, 2007 @ 2:18 pm
The new Google Blog Bar is a Google AJAX Search API application that lets you easily add application and page-controled blog search results to your web pages or blog. It provides search-driven bars of blog search results, and is highly customizable too.
Caglar kaya Said,
January 2, 2008 @ 12:55 pm
I am waiting for someone to make a Blogroll widget that displays the latests posts by all your friends instead of just links to the root of there site.