Lucky Boost

Boost Traffic & Conversions

Short Cutts Widget

| 1 Comment

Check out the short cutts widget, with all questions and answers given by Matt Cutts on the webmaster youtube channel. The widget will be update with new questions (now it is done manually but I hope to automate it in the future) as they come out.
If you are into SEO I’m shure you heard about the short cutts. Short cutts was created by Click Consult and gathers all the Matt Cutts videos from the Google Webmaster Help channel on YouTbue. Doesn’t sound like a big deal but the pearl of the site is that they summaries (almost – check out the answer to video # 42 or #146) all the answers given by Matt Cutts. This is so you don’t need to go throw about 2-3 painful boring minutes that are usually (very) basic explanations about the topic before getting to the answer. Unless you are a newbie- then go watch them all. There is a ton of good info there.

Webmaster tools logoI got some complaints about the color of the widget (reasons for colors explained later on) so I updated the colors of the widget based on the logo of webmaster tools. I also changed the size for two reasons:

1. With the long answers for some of the videos it was hard to read the answers.
2. I thought this would be a better size for embedding on websites.

Embed code for new widget

So now we have a new widget with a better size and color that also works well with newer versions of IE. I went one step further and added the option to change the colors to the old widget by adding parameters to the url, so any webmaster can customize it to their website and/or liking.

Old version:
The running numbers on the side don’t always show in the center when on IE. But who cares about IE users?! IE users go get a life! IE users go get a browser! tweet this

Put the widget on your site! and update all your readers with the latest Q&A from Matt Cutts.
Embed code:

Matt Cutts Colors
Because this is a widget based on Matt Cutts I had him pick the colors for the widget. Well not really. I took his image from his Google+ profile and used shades of colors from the image.matt cutts colors

The widget comes as small as 330px by 106px. You can make it wider, the text will adjust itself to the size chosen, but you can’t change the height.

To enlarge the widget all you need to do is change the width=”330px” to the size you are interested in.

Customizing colors of the short cuts widget

The parameter you can add on to the url can be 3 or 6 characters and of hex color codes (without the #). a regex checks if the parameters match the hex color code if not  default color will appear.

The parameters are:

a – text color of the answer
d – text color of the date
bp – background color of left side
s – text color of counter and question title
sb – background color of right side

An example for adding parameter would be ?a= f00&d=409000&sb=f0f add this to the url in the embed code right after html (no space in between). It will look like this http://s.luckyboost.com/short-cutts.html?a= f00&d=409000&sb=f0f now you are ready to go.

Widget was created using the presenteer.js a HTML5 library created by Willem Mulder. So thank you Willem!

One Comment

  1. I follow Matt Cutts and his answers and such a widget is extremely useful. It saves a lot of time, it helps you find all the interesting thinks much faster. I will recommended also to my friends. Thank you!

Leave a Reply

Required fields are marked *.