Support Center

Creating Widgets

Last Updated: Jan 28, 2014 03:39PM EST
Creating A Song or Playlist Widget
To create a song or playlist widget, just follow these steps.

1. Search for the song or playlist you wish to embed.

2. Once you have found the song, click on the Share Song icon. 
 
 Share Option 
 
For a playlist, click on the share button in the top right hand side of the playlist's page:


3. Click More and then the Embed button to bring up the widget customization menu. If you are sharing more than one song, you'll see more customization options for the widget.
 
  Song Widget Menu
  

4. Then copy the code starting with '<object...' and past the embed code into your HTML document! 


Tips:

​To make a widget autostart when the page loads, you need to edit the widget code just a bit. There are two
 &p=0. Change both to &p=1.

For Playlists, a
ny and all changes you make to the playlist will be reflected in your widget. 

It is not possible to create a widget from an Artist or Album.
 
 
Embedding a Grooveshark Widget on WordPress

First, find the song or songs you'd like to embed on your blog, then choose Share Song:
 

Share Option

 

From the Share menu, select More and then Embed. Click 'Copy to Clipboard' and the entire HTML code will be added to your clipboard:
 

 Song Widget Menu

 

Then, go to WordPress or any other text editing program and paste the widget code. You'll need to trim some of this code. The essential part of the code is the orange text and the highlighted width and height:

 

<object width="250" height="40" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id="gsSong3315361833" name="gsSong3315361833"><param name="movie" value="http://grooveshark.com/songWidget.swf" /><param name="wmode" value="window" /><param name="allowScriptAccess" value="always" /><param name="flashvars" value="hostname=cowbell.grooveshark.com&songIDs=33153618&style=metal&p=0" /><object type="application/x-shockwave-flash" data="http://grooveshark.com/songWidget.swf" width="250" height="40"><param name="wmode" value="window" /><param name="allowScriptAccess" value="always" /><param name="flashvars" value="hostname=cowbell.grooveshark.com&songIDs=33153618&style=metal&p=0" /><span>The Confessor by <a href="http://grooveshark.com/artist/Quiet+Company/332795" title="Quiet Company">Quiet Company</a> on Grooveshark</span></object></object>

 


The last step is the most important: click over to the HTML editor. Once there, paste the code shown below, replace the xxxx with the orange text, and the width and height from your widget code. Depending on whether you're embedding one song or multiple songs in your widget, you need to choose one code from the following two.
 
Single song widget look here:

[gigya src="http://grooveshark.com/songWidget.swf" type="application/x-shockwave-flash" width="250" height="40" flashvars="xxxx" allowScriptAccess="always" wmode="window"] 

or multiple songs...

[gigya src="http://grooveshark.com/widget.swf" type="application/x-shockwave-flash" width="250" height="40" flashvars="xxxx" allowScriptAccess="always" wmode="window"] 

Now update your blog and enjoy your Grooveshark Widget.
 
If you're still having problems with the widget, please check your code in the editor and make sure that no DIV or PRE tags are located in your widget code. If you're still having trouble, please contact Grooveshark Support at support@grooveshark.com.
 
Embedding a Grooveshark Widget on HTTPS
If the widget is appearing as a link on an https site, please add an "s" to both .swf URLs in the widget code.

Contact Us

  • Can’t find the answer here?
    Have some suggestions for us?

    There are several ways we can offer support: