Reputation: 41
Since yesterday we have a problem with embedding the soundcloud player. We use the Oembed method but it seems not all the parameters can be manipulated. So we now get the new visual player instead of the old variant.
For example when we are using:http://soundcloud.com/oembed?format=xml&url=https://soundcloud.com/radionetherlands/el-toque-educacion-sexual-a-la&visual=false
You see that the html node in the xml contains now 2 times the visual parameter
<oembed>
<version type="float">1.0</version>
<type>rich</type>
<provider-name>SoundCloud</provider-name>
<provider-url>http://soundcloud.com</provider-url>
<height type="integer">400</height>
<width>100%</width>
<title>El Toque: Educacion sexual a la mexicana by Radio Netherlands</title>
<description>"Cuando nos deje de dar verguenza que un niño nos pregunte de dónde vienen los bebés, podremos decir que estamos en buen camino en materia de educación sexual", decía una participante en el Noveno Congreso Mexicano de Educación Sexual y sexología FEMESS, realizado recientemente en Aguascalientes, México. Hasta allá se hizo presente El Toque, donde nuestra colega Mara Landa conversó, entre otros, con Marcela Martínez, la presidenta de la Federación Mexicana de Educación Sexual y Sexualidad FEMESS y Erem Dira, voluntaria del comité organizador del congreso. Producción Mara Landa. Presentación Alejandro Pintamalli.</description>
<thumbnail-url>http://i1.sndcdn.com/artworks-000061844084-068ssp-t500x500.jpg?e30f094</thumbnail-url>
<html><![CDATA[<iframe width="100%" height="400" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?visual=true&url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F118490723&show_artwork=true&visual=false"></iframe>]]></html>
<author-name>Radio Netherlands</author-name>
<author-url>http://soundcloud.com/radionetherlands</author-url>
</oembed>
Upvotes: 4
Views: 1376
Reputation: 4561
I finally found a solid work around using some jquery to do this. Its important to note I had to remove the visual setting completely by replacing visual=true with ' ' and not set it to false as recommended. This will only be called for iframes regarding soundcloud.
$(document).ready(function(){
$("iframe").each(function() {
var src = $(this).attr('src');
if(src.indexOf('https://w.soundcloud.com/player/?') != -1 && src.indexOf('visual=true') != -1) {
$(this).attr('src', src.replace('visual=true', ' '));
}
});
});
EDIT: With the above code you can finally use the show_artwork and visual params in your oembed call!
Upvotes: 0
Reputation: 1
There's a way to modify. Someone asked SoundCloud on twitter, and it has been referenced many times since.
Change visual=true
to visual=false
and show_artwork=true
to show_artwork=false
. That should take care of it!
Src: https://twitter.com/16kbit/status/430477602286239744
Hope this helps.
Upvotes: -1
Reputation: 341
Here is a temporary workaround until SoundCloud adds an option to the oEmbed. It would have been preferable if they did not make the new visual player the default since it now breaks every instance of oEmbed out there. Hopefully they update the API so that it can officially be supported.
Anyways, here is the temp workaround. We are basically just stripping out the visual player options from the iframe code before we insert it into the DOM. This code will go inside your oEmbed callback.
if (oEmbed) $('#player').html(oEmbed.html.replace('visual=true&',''));
Upvotes: 5