WordPress.org

Forums

Advanced iFrame
[resolved] Non-responsive content issue (14 posts)

  1. icndream
    Member
    Posted 1 year ago #

    Thank you so much for making this wonderful plugin.

    Everything seems working well, except that none-responsive iframed subsites are cut off and I have no control over resizing of them on mobile devices.

    The following three of my iframed sites are cut off on mobile devices.
    http://www.koreaobserver.com/answer/
    http://www.koreaobserver.com/job/
    http://www.koreaobserver.com/classified/

    Whereas it works well with responsive subsites such as http://www.koreaobserver.com/k_tube/ and http://www.koreaobserver.com/event/.

    Generally, users are able to resize content with their figures on mobile devices if the site is not responsive.

    But with the iframed site, I somehow cannot resize the iframed content at all.

    http://wordpress.org/extend/plugins/advanced-iframe/

  2. icndream
    Member
    Posted 1 year ago #

    I played around with the theme and found that I can manage to view all of the iframed, non-responsive content if I activate the scroll bar option.

    The problem appears to stem from the parent site being responsive and some iframed sites being non-responsive.

    The dillema is that if I activate the scroll bar, it looks ugly.

    If I deactivate the scroll bar, it is impossible to view all of the iframed content on mobile phones.

  3. mdempfle
    Member
    Plugin Author

    Posted 1 year ago #

    but how should the content be displayed on a mobile phone if there is not enough space and without having a scrollbar?

  4. icndream
    Member
    Posted 1 year ago #

    You know, mobile phone users can resize the content with two fingers.

    What I am having trouble is that I cannot resize the iframed content on mobile devices unless I use a scrollbar.

    If I use a scrollbar, it looks ugly with iframed responsive pages which do not require a scrollbar.

  5. mdempfle
    Member
    Plugin Author

    Posted 1 year ago #

    Do you use the workaround or is everything on one domain?
    Because the workaround has an overflow:hidden for the iframe content as well.

  6. icndream
    Member
    Posted 1 year ago #

    Yes, everything is on one domain.

  7. mdempfle
    Member
    Plugin Author

    Posted 1 year ago #

    o.k. - the only solution I could think right now is to make a detection for mobile devices that the scrollbar is available - otherwise not.
    Could also be made by css for newer browsers.

    Problem is that not all browsers do css3 properly.

  8. icndream
    Member
    Posted 1 year ago #

    Thanks for your advice.

    For now, I chose the option of "Resize iframe to content height" and set the height to "10,000px" so that the scroll bar is not displayed in most of the cases on big screens.

    The above setting also allows mobile users to use their two fingers to scroll.

    So should I stick to my tweak or do you believe I should stick to your suggestion?

    I am new to CSS, so i believe I will need to do some googling to figure out the detection on mobile devices.

    By the way, I have a major problem as to forcing iFrame content displayed on its wordpress parent page.

    As you may be aware I have iframed several of my subsites. (You can have a look at http://www.koreaobserver.com)

    Now I want people directly accessing to my subsites through google or other search engines automatically redirected to the parent site where the corresponding subsites are shown in an iframe.

    There is a wordpress plugin called "force-frame," which "allows you to force your WordPress website inside an iframe in another website, with cross-domain support."

    The plugin is supposed to do what I desire if it works. Nevertheless, i don't understand the plugin's installation instruction, which says "Add the following snippet inside the HTML of the parent."

    HTML of the parent? I have no clue as to the html of the parent.

    Do you have any suggestion on that?

  9. icndream
    Member
    Posted 1 year ago #

    Also as for the browser compatibility of the CSS3, I think it all comes down whether mobile browsers support it.

    I guess I need to do some research, but I have a gut feeling that mobile devices, which have embraced the latest modern technology, are more likely to come with browsers compatible with CSS3.

  10. mdempfle
    Member
    Plugin Author

    Posted 1 year ago #

    If you use
    Resize iframe to content height
    the height should not matter because it is resized to the needed height!

    to your 2nd thing. Normally thisi s only a very small Javascript snipplet you need to add. the parent is the html your iframe is included.

    About css 3. I will change the plugin that if scrolling is set to auto nothing is rendered to the iframe anymore so that scrolling is default.
    and then by adding css which can be done by adding a css file almost at the bottom yu could e.g. set with css at which width scrollbars should be used.
    but if the resize to heigt works fine stick to it.

  11. icndream
    Member
    Posted 1 year ago #

    Thank you for your prompt reply, once again.

    You mentioned "the parent is the html your iframe is included."

    Well, the parent site is based on wordpress. Does wordpress sites have a html?

    I only see index.php on the parent site.

  12. mdempfle
    Member
    Plugin Author

    Posted 1 year ago #

    sure - go to the theme editor and there you see all "html". You should insert into something that is included everywhere.

  13. icndream
    Member
    Posted 1 year ago #

    Thank you for your reply. But I am running a multisite and thus the parent page is the master site. Nevertheless, I cannot find the theme editor and I believe it is hidden on multisites.

  14. mdempfle
    Member
    Plugin Author

    Posted 1 year ago #

    If there is no

    Appearance -> Editor

    Than it is hidden or somewhere else...

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.