/    Sign up×
Community /Pin to ProfileBookmark

Trying to place a custom/developer Soundcloud Player

Hey guys. I’m trying to place a custom Soundcloud player into my dreamweaver code, but when I preview the site in firefox or safari all that appears is a text box that says “my new dub track”.

Here is the code I’m using with their code highlighted in red, and here are the instructions from developers.soundcloud.com on how to set up a basic custom player. Any help would be amazing since I am fairly inexperienced with coding! Thanks so much.

[url]http://developers.soundcloud.com/docs/custom-player[/url]

<!DOCTYPE HTML>
<html lang=”en”>
<head>
[COLOR=”red”]<link rel=”stylesheet” href=”../css/sc-player-standard.css” type=”text/css”>[/COLOR]<meta charset=”UTF-8″>
<title>Lenny Juliano</title>
<link href=”css/style.css” rel=”stylesheet” type=”text/css” />
<link href=”css/layout.css” rel=”stylesheet” type=”text/css” />
<link rel=”stylesheet” href=”css/prettyPhoto.css” type=”text/css”>
<script src=”js/jquery.min.js” type=”text/javascript”></script>
<script src=”js/cufon-yui.js” type=”text/javascript”></script>
<script src=”js/cufon-replace.js” type=”text/javascript”></script>
<script type=”text/javascript” src=”js/Josefin_Sans_600.font.js”></script>
<script type=”text/javascript” src=”js/Lobster_400.font.js”></script>
<script type=”text/javascript” src=”js/sprites.js”></script>
<script type=”text/javascript” src=”js/jquery.jplayer.min.js”></script>
<script type=”text/javascript” src=”js/jquery.jplayer.settings.js”></script>
<script type=”text/javascript” src=”js/gSlider.js”></script>
<script type=”text/javascript” src=”js/jquery.easing.1.3.js”></script>
<script type=”text/javascript” src=”js/jquery.prettyPhoto.js”></script>
<!–[if lt IE 7]> <div style=’ clear: both; height: 59px; padding:0 0 0 15px; position: relative;’> <a href=”http://www.microsoft.com/windows/internet-explorer/default.aspx?ocid=ie6_countdown_bannercode”><img src=”http://www.theie6countdown.com/images/upgrade.jpg” border=”0″ height=”42″ width=”820″ alt=”You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today.” /></a></div> <![endif]–>
<!–[if lt IE 9]><script src=”js/html5.js” type=”text/javascript”></script><![endif]–>
<!–[if IE]><link href=”css/ie_style.css” rel=”stylesheet” type=”text/css” /><![endif]–>
<style type=”text/css”>
#youtube {
height: 439px;
width: 568px;
margin-right: auto;
margin-left: auto;
}
</style>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>
<script type=”text/javascript”>
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf(“#”)!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf(“?”))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

</script>
</head>
<body id=”page1″ onLoad=”MM_preloadImages(‘images/images/NEWS-ROLLOVER.png’,’images/images/YOUTUBE-ROLLOVER.png’,’images/images/STORE-ROLLOVER.png’,’images/images/BIO-ROLLOVER.png’,’images/images/CONTACT-ROLLOVER.png’,’images/images/PHOTOS-ROLLOVER.png’)”>
<div id=”main”>
<header>
<div align=”center”><a href=”index.html”><img src=”images/images/LOGO.png” width=”348″ height=”150″ alt=”LOGO”></a><a href=”index.html” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘home’,”,’images/images/HOME-ROLLOVER.png’,1)”><img src=”images/images/HOME.png” name=”home” width=”88″ height=”150″ border=”0″></a><a href=”#” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘news’,”,’images/images/NEWS-ROLLOVER.png’,1)”><img src=”images/images/NEWS.png” name=”news” width=”80″ height=”150″ border=”0″></a><a href=”bio.html” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘bio’,”,’images/images/BIO-ROLLOVER.png’,1)”><img src=”images/images/BIO.png” name=”bio” width=”66″ height=”150″ border=”0″></a><a href=”http://www.youtube.com/user/lennyjulianoworship” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘youtube’,”,’images/images/YOUTUBE-ROLLOVER.png’,1)”><img src=”images/images/YOUTUBE.png” name=”youtube” width=”116″ height=”150″ border=”0″></a><a href=”#” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘Image14′,”,’images/images/STORE-ROLLOVER.png’,1)”><img src=”images/images/STORE.png” name=”Image14″ width=”91″ height=”150″ border=”0″></a><a href=”photos.html” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘photos’,”,’images/images/PHOTOS-ROLLOVER.png’,1)”><img src=”images/images/PHOTOS.png” name=”photos” width=”108″ height=”150″ border=”0″></a><a href=”#” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘contact’,”,’images/images/CONTACT-ROLLOVER.png’,1)”><img src=”images/images/CONTACT.png” name=”contact” width=”127″ height=”150″ border=”0″></a><img src=”images/NEWSINGLE.png” width=”1024″ height=”384″ alt=”KNOW”></div>
</header>
<article id=”content”>
<div class=”col-1″>

[COLOR=”red”]<a href=”http://soundcloud.com/matas/hobnotropic” class=”sc-player”>My new dub track</a>[/COLOR]
<div class=”p2″ id=”header10″>

</div>
<div class=”p2″> <a href=”http://compassioninternational.com”><img src=”images/compassion.png” width=”155″ height=”427″ alt=”compassion”></a></div>
</div>
<div class=”col-2″>

<img src=”images/musicvideo.png” width=”300″ height=”50″ alt=”video”>

<div id=”youtube”><iframe width=”600″ height=”450″ src=”http://www.youtube.com/embed/aRjT-WKNXPA” frameborder=”0″ allowfullscreen></iframe></div>

<div class=”table-border”>

</div>
</div>
<ul class=”soc-ico”>
<li><a href=”#”><img src=”images/facebook.png” alt=””></a></li>
<li><a href=”#”><img src=”images/twitter.png” alt=””></a></li>
<li><a href=”#”><img src=”images/myspace.png” alt=””></a></li>
<li><a href=”#”><img src=”images/linkedin.png” alt=””></a></li>

</ul>

<img src=”images/twitterheader.png” width=”165″ height=”50″ alt=”twitter”>

<div class=”col-3″>
<div class=”und”>
<p>At vero eos et accusamus et iusto odio dignissimos ducimus blanditiis.<br>
<a href=”#”>1 hour ago</a></p>
<p>Praesentium voluptatumdel enititque corrupti quos.<br>
<a href=”#”>3 hours ago</a></p>
<p>dolores et quas molestias excepturi sint occaecati cupiditate.<br>
<a href=”#”>7 hours ago</a></p>
<p>Non provident, similiqusunt in culpa qui officia.<br>
<a href=”#”>12 hours ago</a></p>
<p>At vero eos et accusamus et iusto odio dignissimos ducimus blanditiis.<br>
<a href=”#”>16 hours ago</a></p>
</div>
<h2>Newsletter</h2>
<form action=”” id=”subscribe”>
<fieldset>
<label>
<input type=”text”>
</label>
<input type=”submit” value=””>
</fieldset>
</form>

</div>
</article>
</div>
</div>
<div class=”af clear”></div>
</div>

http://soundcloud.com/matas/hobnotropic” class=”sc-player”>My new dub track</a>

<footer>
<span>
<a rel=”nofollow” href=”http://www.templatemonster.com/” target=”_blank”>Website template</a> designed by TemplateMonster.com<br>
<a href=”http://www.templates.com/product/illustrations/” target=”_
blank”>Vector Illustration</a> provided by Templates.com
</span>
</footer>
<script type=”text/javascript”>Cufon.now()
$(function(){
$(‘nav,.more,.header-more’).sprites()

$(‘.header-slider’).gSlider({
prevBu:’.hs-prev’,
nextBu:’.hs-next’
})

})
$(window).load(function(){
$(‘.tumbvr’)._fw({tumbvr:{
duration:2000,
easing:’easeOutQuart’
}})
.bind(‘click’,function(){
location=”index-3.html”
})

$(‘a[rel=prettyPhoto]’).each(function(){
var th=$(this),
pb
th
.append(pb=$(‘<span class=”playbutt”></span>’).css({opacity:.7}))
pb
.bind(‘mouseenter’,function(){
$(this)
.stop()
.animate({opacity:.9})
})
.bind(‘mouseleave’,function(){
$(this)
.stop()
.animate({opacity:.7})
})
})
.prettyPhoto({theme:’dark_square’})

})
</script>
[COLOR=”red”]<script type=”text/javascript” src=”http://code.jquery.com/jquery.js”></script>
<script type=”text/javascript” src=”../js/soundcloud.player.api.js”></script>
<script type=”text/javascript” src=”../js/sc-player.js”></script>[/COLOR]

</body>
</html>

to post a comment
CSS

0Be the first to comment 😎

×

Success!

Help @lennyjuliano spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...