Though you can publish an audio track or playlist in a Tumblr post, the post will only play when the user starts the Tumblr audio player in the post. Alternatively, embed a player in your Tumblr theme that will continue to play music while users scroll through your blog’s pages. Several audio player widgets are freely available from sites like Hypster, SCM and Streampad. With Hypster, select a song or playlist, then build the audio widget around the audio link. Play any online track or playlist on your Tumblr blog with the SCM player. With Streampad, simply embed the player in your theme code to play all audio posts on your blog.
Open Hypster in a browser, then log in with your Hypster account credentials. If you do not have an account, click the “Register” link, then type an email address, username and password. Click the “Both” radio button to answer the question “I Am Interested In (Players, Playlists, Both).” Type the answer to the security question, then click the “I Agree to the Terms and Conditions” check box. Click the optional checkboxes to receive the newsletter and additional information, if desired. Click “Register.” A verification email is sent to your email address; however, you can immediately log in to your account.
Click the “Create” option in the top navigation menu, then click “Playlist.” Click the “Add New Playlist” button, then click “Add New Song.” Type a song title or artist’s name in the Search box, then click the “Search” icon. Click the desired track to add the song to the playlist. Repeat selecting songs until you have composed the playlist to publish on Tumblr.
Click the “Create” option in the top navigation menu, then click “Player.” A list of available embedded player widgets opens. Click the thumbnail for the player you want to open the code generation page for the player.
Type a name for the player in the Name field, then click the “Playlist” drop-down box and click one of your saved playlists. Click the “Autostart” check box to play the music automatically on your blog. You can also click the “Shuffle Playlist” option, if desired.
Click the “Player Color Scheme” drop-down box, then click the desired color scheme. Click “Get Code.” The widget code displays in the Code box. Click the “Copy Code” button to copy the widget code to your clipboard.
Log in to your Tumblr dashboard, then click the “Customize” link to open the theme for your primary blog in the Customize tool.
Right-click inside the “Description” box in the Customize menu, then click “Paste.” The player code is pasted into the description of your blog. Note that you can also click “Edit HTML,” then embed the widget code in another location in your theme’s code.
Click the “Update Preview” button, then click “Save.” Click “Exit” to close the Customize tool. The embedded Hypster widget now plays your Hypster playlist on all pages of your blog.
Open the Streampad Get It page in a browser, then click the “Tumblr” icon (see Resources).
Right-click in the code box, then click “Select All” to copy the code to your clipboard.
Open Tumblr and log in to your dashboard. Click the “Customize” link under the name of your primary blog.
Click the “Edit HTML” link in the Customize panel to open the theme code in the editor.
Locate the “</head>” tag, then right-click directly in front of the tag. Click “Paste” to paste the widget code.
Click the “Update Preview” button, then click “Save.” Click “Exit” to close the Customize tool. The Streampad widget now displays on your users’ browsers and plays your published audio posts on your blog.
Open the SCM site in a browser, then click the radio button next to the desired player skin in the Setup Wizard tool (see Resources).
Click the “Edit Playlist” tab in the Setup Wizard, then click the “Manual Playlist” radio button to manually enter URLs to online playlists or tracks. You can also click the second radio button to use an RSS playlist, a SoundCloud set or a YouTube playlist.
Type or copy and paste the desired URLs in the respective input boxes, then click “Next” to open the Configure Settings box.
Click the “Autoplay” and the “Shuffle Playlists” options, if desired, then click the “Volume” slider. Select the default volume for the player.
Click the “Repeat Mode” drop-down box, then click the “Repeat Playlist” or “Repeat Item” option to loop the playlist or song. You can also click “Play Playlist Once” to play the selection one time.
Click the “Placement of Player Bar” drop-down box, then click the “Top” or “Bottom” option, depending on your preference. Click “Done” to generate the widget code. Drag the cursor over all of the code, then press “Ctrl-C” to copy the code to your clipboard.
Log in to your Tumblr dashboard, then click the “Customize” link under your primary blog name to open the theme for your blog in the Customize tool.
Click “Edit HTML,” then click just after the “<body" or “<body>" tag. Depending on your theme, the “body" tag may or may not have a closing bracket. Press “Ctrl-V” to paste the widget code.
Click the “Update Preview” button, then click “Save.” Click “Exit” to close the Customize tool. The SCM player now displays in the top or bottom of the browser window for visitors to your blog.
- Hypster and other hosted music services require that you first create a free account, however, you do not need to create an account to generate the widget code for Streampad and SCM.
- Jupiterimages/BananaStock/Getty Images