sianisiani Posted June 19 Posted June 19 Hi there, I am using four soundcloud blocks in one of my projects. Sadly, all the images are being cropped on the desktop version. On the mobile version, two are showing as the full image so it's obviously possible. However, on the mobile version, all of the images are covered with these annoying buttons asking whether the user wants to listen in browser or on soundcloud, which blocks the images. I have tried using the special embed links from soundcloud but this does not result in the full image, even though it clearly displays as though it will on the soundcloud preview. And it also stops the file from playing. Somewhat infuriating! Any help would be truly fabulous. Here is my soundcloud profile so you can see the differences in image:
Ziggy Posted June 19 Posted June 19 Can you share your website and the embed code you are using? sianisiani 1 Please like and upvote if my comments were helpful to you. Cheers! Zygmunt Spray Squarespace Website Designer Contact me: https://squarefortytwo.com Hire me on Upwork! 📈 SEO Space (Referral link) Ⓜ️ Will Myers' Plugins & Tutorials (Referral link) 🔌 Ghost Squarespace Plugins (Referral link) ⬛ SquareWebsites Plugins (Referral link) 🔲SQSP Themes (Referral link) ✨ Spark Plugin (Referral link) 🖼️Pinch-to-Zoom Gallery Lightbox Plugin (Referral link) ☕ Did I help? Buy me a coffee?
sianisiani Posted June 20 Author Posted June 20 hi ziggy. thanks so much for your response. the website page with the souncloud blocks is https://www.siangriffin.com/home/ofkinshipandconspiracy i'm currently using the following URLs for the four poems and have included the embed code for each one (though when I use these the track doesn't play at all) https://soundcloud.com/user-437779713-558265231/the-back-of-our-eyelids <iframe width="100%" height="600" scrolling="no" frameborder="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/1833583401&color=%23ff5500&auto_play=false&hide_related=true&show_comments=false&show_user=true&show_reposts=false&show_teaser=false&visual=true"></iframe><div style="font-size: 10px; color: #cccccc;line-break: anywhere;word-break: normal;overflow: hidden;white-space: nowrap;text-overflow: ellipsis; font-family: Interstate,Lucida Grande,Lucida Sans Unicode,Lucida Sans,Garuda,Verdana,Tahoma,sans-serif;font-weight: 100;"><a href="https://soundcloud.com/user-437779713-558265231" title="Siân Griffin" target="_blank" style="color: #cccccc; text-decoration: none;">Siân Griffin</a> · <a href="https://soundcloud.com/user-437779713-558265231/the-back-of-our-eyelids" title="The Back of Our Eyelids" target="_blank" style="color: #cccccc; text-decoration: none;">The Back of Our Eyelids</a></div> https://soundcloud.com/user-437779713-558265231/strategy <iframe width="100%" height="600" scrolling="no" frameborder="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/1832858211&color=%23ff5500&auto_play=false&hide_related=true&show_comments=false&show_user=true&show_reposts=false&show_teaser=false&visual=true"></iframe><div style="font-size: 10px; color: #cccccc;line-break: anywhere;word-break: normal;overflow: hidden;white-space: nowrap;text-overflow: ellipsis; font-family: Interstate,Lucida Grande,Lucida Sans Unicode,Lucida Sans,Garuda,Verdana,Tahoma,sans-serif;font-weight: 100;"><a href="https://soundcloud.com/user-437779713-558265231" title="Siân Griffin" target="_blank" style="color: #cccccc; text-decoration: none;">Siân Griffin</a> · <a href="https://soundcloud.com/user-437779713-558265231/strategy" title="Strategy" target="_blank" style="color: #cccccc; text-decoration: none;">Strategy</a></div> https://soundcloud.com/user-437779713-558265231/november <iframe width="100%" height="600" scrolling="no" frameborder="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/1391397097&color=%23ff5500&auto_play=false&hide_related=true&show_comments=false&show_user=true&show_reposts=false&show_teaser=false&visual=true"></iframe><div style="font-size: 10px; color: #cccccc;line-break: anywhere;word-break: normal;overflow: hidden;white-space: nowrap;text-overflow: ellipsis; font-family: Interstate,Lucida Grande,Lucida Sans Unicode,Lucida Sans,Garuda,Verdana,Tahoma,sans-serif;font-weight: 100;"><a href="https://soundcloud.com/user-437779713-558265231" title="Siân Griffin" target="_blank" style="color: #cccccc; text-decoration: none;">Siân Griffin</a> · <a href="https://soundcloud.com/user-437779713-558265231/november" title="November" target="_blank" style="color: #cccccc; text-decoration: none;">November</a></div> https://soundcloud.com/user-437779713-558265231/on-destruction <iframe width="100%" height="600" scrolling="no" frameborder="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/858578032&color=%23ff5500&auto_play=false&hide_related=true&show_comments=false&show_user=true&show_reposts=false&show_teaser=false&visual=true"></iframe><div style="font-size: 10px; color: #cccccc;line-break: anywhere;word-break: normal;overflow: hidden;white-space: nowrap;text-overflow: ellipsis; font-family: Interstate,Lucida Grande,Lucida Sans Unicode,Lucida Sans,Garuda,Verdana,Tahoma,sans-serif;font-weight: 100;"><a href="https://soundcloud.com/user-437779713-558265231" title="Siân Griffin" target="_blank" style="color: #cccccc; text-decoration: none;">Siân Griffin</a> · <a href="https://soundcloud.com/user-437779713-558265231/on-destruction" title="On Destruction" target="_blank" style="color: #cccccc; text-decoration: none;">On Destruction</a></div>
Ziggy Posted June 20 Posted June 20 So you want the soundcloud embeds to be square? sianisiani 1 Please like and upvote if my comments were helpful to you. Cheers! Zygmunt Spray Squarespace Website Designer Contact me: https://squarefortytwo.com Hire me on Upwork! 📈 SEO Space (Referral link) Ⓜ️ Will Myers' Plugins & Tutorials (Referral link) 🔌 Ghost Squarespace Plugins (Referral link) ⬛ SquareWebsites Plugins (Referral link) 🔲SQSP Themes (Referral link) ✨ Spark Plugin (Referral link) 🖼️Pinch-to-Zoom Gallery Lightbox Plugin (Referral link) ☕ Did I help? Buy me a coffee?
sianisiani Posted June 20 Author Posted June 20 I would like them to show the full picture, as it does when i go to the embed preview in soundcloud for each one. i have a attached a screen shot of this. thanks so much for your help!
Ziggy Posted June 20 Posted June 20 Square could be tricky with the embed, you can adjust this value to get closer to square, but because of the width generally needs to be a percentage value to adapt the screen it's going to be hard to match them up. Incidentally using 100% or another percentage won't work with the height! You could use 400px and 400px but you might have to play around with the block positions to look good. sianisiani 1 Please like and upvote if my comments were helpful to you. Cheers! Zygmunt Spray Squarespace Website Designer Contact me: https://squarefortytwo.com Hire me on Upwork! 📈 SEO Space (Referral link) Ⓜ️ Will Myers' Plugins & Tutorials (Referral link) 🔌 Ghost Squarespace Plugins (Referral link) ⬛ SquareWebsites Plugins (Referral link) 🔲SQSP Themes (Referral link) ✨ Spark Plugin (Referral link) 🖼️Pinch-to-Zoom Gallery Lightbox Plugin (Referral link) ☕ Did I help? Buy me a coffee?
sianisiani Posted June 20 Author Posted June 20 Hi Ziggy. I just entered the embed codes changing the width and height to both 400px. This hasn't changed the size/shape of the image and it also now won't play the file, which was a problem I had when using the embed codes when I first tried. One good thing though is that it has taken the annoying "play in souncloud/play in browser" buttons off which totally blocked the image (strangely this only happens on the mobile version). Amy further suggestions would be most welcome. I'm sure there has to be a way to make this work!
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment