Responsiveness?

  • Resolved Erik Archbold

    (@erik-archbold)


    10 years, 6 months ago

    Thanks Cameron. One of our website overseers here wrote this to me after installing your plugin, which I felt to ask you about:

    “Hi Erik, I just want to mention that it doesn’t appear that the plugin on the bottom of the davidhoffmeister.com homepage is entirely responsive. When the width goes between 960px–768px the box actually extends over the right content edge (and it actually disappears in mobile view, but that looks like it’s intended so that feels good). This going beyond the content edge is still something that would be good to take a look into. Full responsiveness is basically a must on our websites these days. I think it’s something you can ask the developer about 🙂 And you can try it out yourself by just pulling in one edge of your browser to make it more narrow.”

    So in possible answer to this, I read another post on this support forum in which you wrote this, which seems like it might be the answer to my friends question:

    “Adaptive width simply means that when the plugin renders, it resizes independently of the width setting to fill the parent container. However there are some restrictions, firstly the width will never be smaller than 180px, and will never be wider than 500px. This is a restriction Facebook has set. Secondly, it only adapts when it renders, meaning that the width doesn’t change when you resize your browser. Again, this is a restriction Facebook has set.”

    It sounds like we’re out of luck due to the restrictions Facebook has set, but if there is anything we can do to make it responsive in the way my friend is wanting, please let me know.

    Many thanks,
    Erik

    https://wordpress.org/plugins/facebook-page-feed-graph-api/

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Cameron Jones

    (@cameronjonesweb)

    10 years, 6 months ago

    Hi Erik,

    Set the widget to have adaptive width and add this CSS to your site.

    #facebook_page_plugin_widget-2 {
    width: 500px;
}
@media (max-width: 960px) {
    #facebook_page_plugin_widget-2 {
        width: 60%;
    }
}

    Bear in mind that to test the responsiveness you’ll need to refresh the page to rerender the plugin.

    Let me know how that goes.

    Thanks,
    Cameron

    Thread Starter Erik Archbold

    (@erik-archbold)

    10 years, 6 months ago

    Hi Cameron,
    Thanks for that, but that doesn’t seem to have worked. The code clearly had some effect in the sense that when I was using the adaptive width setting before, it would cut off most of the widget (as you helped me understand in my previous post here: https://wordpress.org/support/topic/plugin-getting-half-sized-when-used-as-a-widget-on-my-site?replies=5), while now it kept it at 500. But after refreshing the page and then downsizing my browser size, it simply stayed at 500, and at a certain point it overlapped the boundary of the widget area it’s currently in (which you can test now for yourself at the bottom of http://davidhoffmeister.com/).
    Let me know if there’s anything I could have missed, or if there’s any adjustment needed for the coding.
    Thanks!!!
    Erik

    Plugin Author Cameron Jones

    (@cameronjonesweb)

    10 years, 6 months ago

    Hi Erik,

    I can’t seem to replicate the issue. Remember that you’ll need to refresh the page after resizing your browser to rerender the plugin and see the effect.

    Thanks,
    Cameron

    Thread Starter Erik Archbold

    (@erik-archbold)

    10 years, 6 months ago

    Okay yes, that was the part of your instruction I didn’t understand. It’s working now in that sense. But what I think my friend is wanting is for the plugin to not require a refresh after resizing the browser. Is there any way of getting it to do automatically adjust its width while resizing the browser?
    Thanks,
    Erik

    testcouch

    (@testcouch)

    10 years, 6 months ago

    hello,

    But what I think my friend is wanting is for the plugin to not require a refresh after resizing the browser. Is there any way of getting it to do automatically adjust its width while resizing the browser?

    i found a solution but i have not enough knowledge to add the fix for the Resizing/Rotation issue:

    http://www.praxis.net.au/blog/making-the-facebook-page-plugin-responsive/

    Could you implement this fix in the Plugin cameronjonesweb?

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Responsiveness?’ is closed to new replies.