Support Center/Artist Knowledge Base/Promotion

Streaming player

Bill Thompson
posted this on Jul-29 2011 13:25

Introduction

The Streaming Player is a multimedia player that can be placed in a wide variety of environments. It will easily play full albums, display images or slideshows, or play videos. It can also present mixed media (images, slideshows, and tracks). This player can easily be shared; it can generate embed codes for fans to place the widget on their own page, and has a fullscreen mode. The streaming widget can also drive traffic to a page you desire - storefronts, blogs, your homepage, etc.

Setup

Setting up the streaming player is a matter of creating the embed code in the application and placing the embed code generated by the application on one or more web pages you control.

Generating an embed code in the application

In your Topspin account, click on “Spin”, then click on “Publish Widgets”. Select “Streaming Player” as your widget type.

Modify Settings

  • Widget Name: This is the name you will use to track this widget in your Spin history. Be as descriptive as you need to be for it to make sense.
  • Button Text: Button text refers to the text physically inside the button to get people to click, e.g. “Get it Now”, etc.
  • Button URL: The button URL should point to a location on the web where you want people to go.
  • Widget Size: These are the physical dimensions of the widget (shown as width by height) in pixels. You cannot change these dimensions after creating the widget, so consider your application.
  • Widget Color: The Streaming Player has two themes: Black and White.
  • Enable Sharing: When this is checked, fans will be able to obtain a code for this widget that they may use to place the widget on their own website, Facebook, Twitter, etc.
  • Public Offer: Checking the Public Offer check box opts the spin into a public Offers API which allows automated discovery and presentation of opted-in spins.
  • Widget Customization: The size and color of the Streaming Player widget can be customized by editing the flashvars in the embed code. Please see the Flash Widget API Documentation and Streaming Widget: Change the Button Color

Add Product

  • Product Type: Options are Song, Image, Video, Album. This menu allows you to choose what you will offer from your account in exchange for an email address.
  • Asset Title: Appears as Song Title, Video Title, etc and is the image, video, song, etc. that you choose to offer for an email address.

Add Display Image

  • Single Image: This allows you to choose an image from your catalog to appear in the widget.
  • Product Artwork: displays any artwork that may be associated with the media that you’re offering in widget
  • Enable Clickable Display: makes the whole widget display area clickable to the Button URL - that is, it makes the widget behave like an ad unit.

Preview and Publish

At the bottom of the creation form, you can see what the widget you’re creating will look like.

If you’re satisfied with the appearance of the widget, click “Publish” in the upper right of the creation form. 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 go to Spin - Summary and click through to the details page for the widget to get its embed code).

Placing the embed code generated by the application on one or more web pages you control

Take the embed code for your widget, and insert it into pages wherever you want. You can place the code as-is in any web page; paste it into WordPress posts (using WordPress’s code view); MySpace, etc.

You should always give your widget a quick test from to make sure that it works as expected - if you have videos, try playing them; listen to tracks, see that your slideshow works.

View Performance Data

Find your campaign under the “Summary” view of the “Spin” section. Click on the campaign name and you’ll be able to view data like number of views, clicks, and plays.

Old Streaming Player

We have updated the streaming player in the Topspin application, however, some artists have asked for the code for the old one. To use the old player, all you need to do is enter the widget ID and artist ID into the code below (select a highlight color too probably) and you're good to go. NOTE: If you decide to use the old player, you are on your own as it is no longer supported:

<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" /> 
<param name="movie" value="http://cdn.topspin.net/widgets/bundle/swf/TSBundleWidget.swf" /> 
<param name="flashvars" value="widget_id=http://cdn.topspin.net/api/v1/artist/ENTER-ARTIST-ID/bundle_widget/ENTER-WIDGET-ID&theme=black&highlightColor=0x91e2e5&displayCTAButton=true" /> 
<param name="wmode" value="transparent" /> 
</object> 
</div>