Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #19991

    Hi,

    I am using the Eunoia theme. I am attempting to make a blog post that I am embedding a playlist from Spotify into.

    Here is the page:

    http://www.theybklyn.com/2013/02/jan2013music/

    pw: spotify

    Here is the embed code I am using:

    <iframe src=”https://embed.spotify.com/?uri=spotify:user:mudskippir:playlist:6DyxOsAbolEybOXjUMyg8i” height=”380″ width=”250″ frameborder=”0″></iframe>

    There are TWO issues, the first being that I can’t resize the player. It will always default to the full width of the blog, as you can see in the example link above. I tried using the shortcode/column solution as seen here: http://www.kriesi.at/support/topic/incarnation-theme-style-overwriting-my-page-code#post-93959

    That worked to make my player fit inside half of the blog, but height of the player was way less in pixels and I was unable to adjust it even from the embed code.

    The second issue is the white space below the top part of the player that closes up when you roll over the player. I’ve posted the same embed code on another blog I have and the player embeds without the dreaded white space opening and closing.

    Help, please!

    #105884

    Probably Kriesi’s iframe fix “adjusts” the spotify iframe dimensions. You can try to remove the fix – open up js/avia.js and replace following code:

    avia_small_fixes(container);

    with:

    //avia_small_fixes(container);

    #105885

    Hi Dude,

    I replaced the code like you suggested and it doesn’t work. :(

    Take a look:

    http://www.theybklyn.com/2013/02/jan2013music/

    pw: spotify

    It seems like it did format it to the default width, but the height is still being overridden by something. Here is the only coding in the text section of the post:

    <iframe style=”font-size: 13px; line-height: 19px;” src=”https://embed.spotify.com/?uri=spotify:user:mudskippir:playlist:6DyxOsAbolEybOXjUMyg8i” height=”600″ width=”250″ frameborder=”0″></iframe>

    I went to change the height to 400 and all it did was remove the white space you see under it in it’s current state.

    The weird white space that closes up when you rollover the player is also still there.

    Any other suggestions?

    Thanks,

    Christy

    #105886

    Hi,

    I thought what Dude said will already fix the issue but try to add this on your custom.css.

    #mainContainer {
    min-height: 400px !important;
    }

    .postid-1529 iframe {
    min-height: 550px !important;
    }

    .jspContainer {
    min-height: 600px !important;
    }

    I hope this will adjust the height. Actually, try to do what Dude posted earlier then remove browser history.cache then reload the page.

    Regards,

    Ismael

    #105887

    Hi Ismael,

    I added this to the CSS style sheet and emptied my browser history and cache from the earliest possible point. The embed still looks funky and the embed doesn’t reflect any size changes or directions.

    I hope this isn’t a lost cause as this is a really integral part of our website and we want to be embedding this player once a month.

    Thanks for your help,

    Christy

    #105888

    Hey Christy,

    I think the actual spotify code has something to do with it. If you open your embed url alone and adjust the window to various sizes it seems to limit the height in some cases and let it expand full height+width in others.

    I made a test page with just the spotify iframe and it wont let you change the height if the height+width is to far in proportion. It may just be something you have to tweak and get to a tolerable size.

    For example, I used 780px height and 500px width which limited the height to 580px. If I bumped up the width to 550px it expanded the height to 549px (of the actual player inside the iframe) while the iframe itself was what I set originally (780px).

    I’ll keep my test live for you here so you can see what I mean:

    removed

    Regards,

    Devin

    #105889

    Hi Devin,

    On my other blog site that I tested the embed code in, it looks the way yours looks, which is totally fine. Unfortunately, the way it looks in the blog post in this thread is not only limited in the ability to size/resize, but it also has that white space that closes up on rollover. Can you tell me why that is happening?

    It isn’t happening on your page that you linked to and it doesn’t happen on my other blog, here: http://www.christypessagno.com/blog/?p=385 pw: spotify

    If I could at least get this rollover fixed, I’ll be happy.

    Thanks,

    Christy

    #105890

    Ignore me, just tried another computer. This will do!

    Thank you guys for your help!

    #105891

    Glad we could help :)

    Let us know if you have any other questions or issues.

    Regards,

    Devin

Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘Spotify embedded in post problem’ is closed to new replies.