Instagram images are too big in mobile view

Um alle Funktionen von Destinaja nutzen zu können, sollten Sie sich registrieren oder einloggen.

    Thank you for the plugin! Your time & trouble to create and maintain it, and provide it free of charge, are much appreciated.


    Images linked via an Instagram URL are not scaled in the browser when viewing on a mobile device.


    Example: https://www.instagram.com/p/BS7u1ShFGH1/


    I have tried editing the MediaProvider to use width="100%" and that works great except the height is then much too small... but it doesn't seem to understand "100%"... if I use figures instead, I can get perfect height on a phone but much too short on a desktiop, orthe pther way round, but nothing that suits both!


    Is it possible to make it so that it will scale to the exact optimum size like a standard image?


    Cheers :)

    Hey,


    you can do the following:


    1. Change the RegEx to
    https?://(?:.+?\.)?instagr.?am(\.com)?/p/(?<ID>[a-zA-Z0-9_-]+)/?


    2. Change the HTML-Code to
    <div class="mediaProviderInstagram_beta1"><iframe src="//instagram.com/p/{$ID}/embed/" frameborder="0" scrolling="no" allowtransparency="true"></iframe></div>


    3. Add this lines to the Style properties

    CSS
    1. .mediaProviderInstagram_beta1 {
    2. overflow: hidden;
    3. padding-bottom: 80%;
    4. position: relative;
    5. iframe {
    6. height: 100%;
    7. position: absolute;
    8. width: 100%;
    9. }
    10. }

    i would overwrite the provider with the next update to the final version.


    Is this solution OK for you?

  • The_Waiters

    Hat das Thema geschlossen