Create a Single Track Player Follow

Introduction

The Single Track Player is a compact streaming player that can be used to place a single song or video easily in the context of a web page, blog post, Facebook Static HTML tab, etc. Setting up the single track player is simple - just create one in the Topspin application and then place the embed code generated by the application on any web page you control.

Screen_Shot_2011-12-08_at_6.44.51_PM.png

Modify Settings
  • Button Text: Button text refers to the text physically inside the headline button. The button reads “Learn More” by default. 
  • Button URL: The button URL should point to a location on the web where you want people to go. It points to your Spinshop by default. 
  • Size: These are the physical dimensions of the widget (shown as width by height) in pixels. After publishing, you can only change these dimensions by altering the HTML width and height parameters when embedding the code outside Topspin. 

   

Add Product
  • Product Type & Name: Choose the exact audio track you'd like to stream. 
  • Auto-start when loaded: A feature also known as "auto-play". Make sure to consider your audience before choosing auto-play. 

You can customize the color of your single track player but altering the "Theme" and "Controlbar" attributes.

Topspin_Media__-__Widget-1.jpg

When you’re satisfied with the appearance of the widget, click “Publish” in the upper right of the creation page to save your player. You will be presented with a confirmation code that shows your widget, and provides you with the embed code that you will need to place this widget on the web. (Don’t worry — you don’t need to get it now. You can always click into the widget again to copy its embed code).


--------

Older Version Streaming Players

We've updated our streaming players twice over the last year, so some artists have specifically asked about using the code for our older players. There are two older player models: The V1 Flash-based Player, and the V2 iframe players. To use the Flash player, all you need to do is enter the widget ID and artist ID into the code below and you're good to go: 

<div class="topspin-widget topspin-widget-bundle-widget"> 
<object type="application/x-shockwave-flash" width="400" height="300" id="TSWidgetENTER-WIDGET-ID" data="http://cdn.topspin.net/widgets/bundle/swf/TSBundleWidget.swf" bgColor="#000000"> 
<param value="always" name="allowScriptAccess" /> 
<param name="allowfullscreen" value="true" /> 
<param name="quality" value="high" /> 
http://cdn.topspin.net/widgets/bundle/swf/TSBundleWidget.swf" /> 
http://cdn.topspin.net/api/v1/artist/ENTER-ARTIST-ID/bundle_widget/ENTER-WIDGET-ID&amp;theme=black&amp;highlightColor=0x91e2e5&displayCTAButton=true" /> 
<param name="wmode" value="transparent" /> 
</object> 
</div>

To use the V2 iframe player, just input your widget ID in the following embed code: 

<iframe id="tsFrameENTER-WIDGET-ID" src="http://cdn.topspin.net/api/v2/widget/ENTER-WIDGET-ID" frameborder="0" width="300" height="300" ></iframe>

 

Note: Old players (V1 & V2) are no longer supported and will not function on mobile devices. 

Have more questions? Submit a request and our team will be able to help get you sorted.
Powered by Zendesk