Not theme releated. soundcloud is embedded with oembed via wordpress.
You need to insert the code where width is 100%, or iframe, and not fixed width as you have it.
e.g. if you have it inserted like so, the fixed width doesn’t scale as it’s NOT a photo.
<p><iframe width="640" height="400" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?visual=true&url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F139414902&show_artwork=true&maxwidth=640&maxheight=960"></iframe></p>
Check the embed options and Soundcloud help for how to embed a responsive player into WordPress.
That’s what the web is for 😉
For example if you follow the docs on WordPress for soundcloud, pretty simple:
http://en.support.wordpress.com/audio/soundcloud-audio-player/
while that is for wordpress.com also works for self hosted.
Note how if you resize the web browser on above page, the player window resizes also? Yup. Ya gotta do it right for it to work !
Hi,
@felizubi
You can also adjust it via css, like this: http://screencast.com/t/OM6WaMVyO
@media (min-width: 768px) and (max-width: 1023px) {
.td-post-content p iframe {
max-width: 100% !important;
}
}
Thanks
Thanks Lucian, now it looks great on iPad (portrait) too.
Actually Chris before posting I tried to paste the Soundcloud “WordPress code” on my post, for example:
[soundcloud url=”https://api.soundcloud.com/tracks/156661852″ params=”auto_play=false&hide_related=false&visual=true” width=”100%” height=”450″ iframe=”true” /]
but it wasn’t recognized. So, I tried the same approach as when embedding a Youtube video, meaning, just paste the link (url). In fact, two or three Newsmag’s template versions ago, the same problem happened when embedding a Youtube video: on iPad (portrait) the video occupies the sidebar. This issue was corrected on the penultimate version though.
Fz
-
This reply was modified 11 years by
felizubi.
Hi,
Glad you’ve fixed it. The embed feature via url or embed code is a built in WordPress feature, the them doesn’t handles that at all. We had previous reports regarding the embeds features for tweets/instagram images an so on.. but the fact is that when dealing with those kind of issues best would be to focus on WordPress in order to identify it’s cause as the theme don’t handles the embeds. Issues with might be theme related may occur in terms of styling which was your case.
Thanks