Question

Embed code not working properly

  • 16 November 2014
  • 6 replies
  • 829 views

There is something weird going on the with the embed code! I try grabbing the embed code from this playlist: https://soundcloud.com/since3083/sets/good-vibrations-2014-mixtape-2. This is the code I get:
<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/playlists/49286415&amp;color=ff5500&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe>When I put it in my WordPress site, it doesn't show the whole playlist. It only shows the first song: http://nuonis.com/good-vibrations-2014-mixtape-vol-7/

I've used this method before and it worked fine in the past. Here is an example: http://nuonis.com/good-vibrations-2014-mixtape-vol-6/

Is there anyway we can get a fix??

6 replies

Userlevel 7
Badge +3
Hi Sinoun,

Thanks for posting. I've taken a look at this.
Not sure which browser it is that you're using, I'm on Chrome. In Chrome (and in a few other browsers, too), you can right-click on a website and choose "Inspect Element" - this will open the developer environment that shows the source code as well. You can even go ahead and edit the html code so see how changes would look like (obviously, I cannot change this on your website, it is a purely emulated environment, but it's good for debugging. I've gone ahead and tested this for you, then took a screenshot:
http://cl.ly/image/0P1a1Q1j3Y1z

The iframe code I used for it is:
<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/playlists/49286415&amp;auto_pl...;

However, when you go to the track and click on share, then choose the "Embed" tab, you should also see a "WordPress" box that you can tick.

Hope this helps! Can you try that and see if you can get it to work?

Cheers,
Mathis
Thanks for the response, Mathis. I was able to find the issue on my own though. Here is what I found just in case someone has this issue!

If you want to show the whole playlist on your site and the iframe code given to you from Soundcloud isn't doing what you want it to do, it's because of one tiny thing! All you have to do is change the width to 500 or whatever you'd like. See below:

Original code from Soundcloud that didn't work for me:
<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/playlists/49286415&amp;color=ff5500&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe> Edited code to make it work:
<iframe width="500" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/playlists/49286415&amp;color=ff5500&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe> As you can see, everything is EXACTLY the same except for the width! That fixed it for me! Hope this helps others.

Sinoun
Userlevel 7
Badge +3
Thanks for the response, Mathis. I was able to find the issue on my own though. Here is what I found just in case someone has this issue!

If you want to show the whole playlist on your site and the iframe code given to you from Soundcloud isn't doing what you want it to do, it's because of one tiny thing! All you have to do is change the width to 500 or whatever you'd like. See below:

Original code from Soundcloud that didn't work for me:
<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/playlists/49286415&amp;color=ff5500&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe> Edited code to make it work:
<iframe width="500" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/playlists/49286415&amp;color=ff5500&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe> As you can see, everything is EXACTLY the same except for the width! That fixed it for me! Hope this helps others.

Sinoun

Aha! Sinoun, thanks so much for sharing your expertise on the forum - super helpful!

Cheers,
Mathis
I'm having exactly the same problem, but that solution is not working for me. When i change from percentage to a size, it goes down to like 300 pixels no matter what i put, but still doesn't show more than the first song. When it plays past the first song, it will continue to play the list, but does not show the tracks like i need. Incredibly frustrating
Userlevel 7
Badge +3
I'm having exactly the same problem, but that solution is not working for me. When i change from percentage to a size, it goes down to like 300 pixels no matter what i put, but still doesn't show more than the first song. When it plays past the first song, it will continue to play the list, but does not show the tracks like i need. Incredibly frustrating
Hi Casey,

Hmm, can you try and use the embed code on a page like this one? This way the embed code cannot interfere with any code on a personal site, which could potentially impact the embed, plus you will see changes take effect immediately.

If the embed works properly there, a piece of code on the website where you're trying to embed your playlist / track must be tampering the code.

Hope this helps.

Cheers
Mathis
I tried the embed code on the realtime HTML site listed above, and my track did not show up. (It is not showing up on Blogger either.) What is wrong? Here is the blogger post where it isn't working: http://www.irenelatham.blogspot.com/2016/04/artspeak-2016-triolet-for-planting-day.html

here is the code that isn't working:

<iframe width="100%" height="166" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/255031041&amp;color=ff5...;

Any help appreciated!
Thanks,
Irene

Reply