Use Google To Embed MP3 Files On Your Blog

If you are running a Music blog or having lots of podcasts, then this tip will be useful for you. You can use Google Audio Player for embedding MP3 files on your website or blog. You can practically embed this anywhere, though sometimes IE won’t be comfortable with this unfortunately. This player has volume controls and surprisingly, no Google branding. People hardly guess that it is powered by Google.

Embedding MP3 Files Using Google

This is the code you should be using,

<embed type=”application/x-shockwave-flash” src=”http://www.google.com/reader/ui/3523697345-audio-player.swf” quality=”best” flashvars=”audioUrl=MP3link” width=”500″ height=”27″></embed>

In the above code, instead of ‘MP3link’ use the Audio file URL. You can change the width as you like, but keeping the height as ’27’ is recommended. You can the demo player below.

Audio : The Rapture / Sister Saviour (Blackstrobe Remix) under CC

This is perhaps one of the easiest ways for adding audio files on websites.

HOW TO: Use Free Google Web Fonts On Your Blog

I have been testing Google Web Fonts on some of my clients’ websites, and thought of making this as a post for others to know about the power of Google Web Fonts. You can easily implement that on your blog by adding few lines of code.

Google Web Fonts allows you to browse all the fonts available via the Google Web Fonts API. All fonts in their directory are available for use on our website. You can also check our list of sites to download free fonts.

Using Free Google Web Fonts On Your Blog

1. Go to Google Web Fonts and search for your favorite font. Now click on that font. Here I have used the font ‘Meddon’.

Google Web Fonts

This page gives all the information about that particular font, the designer’s name, license and so on. You can preview those fonts and you can also download them for offline use.

2. Now select the option “Use this font” and you can get the code for embedding this font on your blog/website.

Google Web Fonts - Use This Font

The code will look like this,

<link href=’http://fonts.googleapis.com/css?family=Meddon’ rel=’stylesheet’ type=’text/css’>

To embed this font (Meddon) into your web page copy the above code as the first element in the <head> of your html document.

For modifying the font family tag in CSS stylesheet, you can use

h1 { font-family: ‘Meddon’, arial, serif; }

So what is your opinion about Google Web Fonts? Have you used them on your blog? Do share your opinions below as comments.