[Support request] Sidebar widget positions on mobile

Home Forums Support [Support request] Sidebar widget positions on mobile

Home Forums Support Sidebar widget positions on mobile

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1875778
    Ben

    Hi

    I have a layout with the main content on the left and a sidebar on the right. The sidebar has three widgets in it, one above the other.
    On mobile, when there isn’t enough space to show the sidebar to the side, all of the widgets are displayed below the main content instead.
    My question – is there any way to get one of those widgets to display above the main content on mobile, but for the others to continue to display below the main content?

    *edit* or is there even a way to make all three of the widgets appear above the content on mobile?

    Many thanks!

    #1876078
    David
    Staff
    Customer Support

    Hi there,

    its possible to move the entire sidebar above the content, but not an individual widget.

    Try this CSS:

    @media(max-width: 768px) {
        .right-sidebar .site-content {
            display: flex;
            flex-direction: column-reverse;
        }
    }

    For a single ‘widget’ – depending on whats in the widget you could use a Block ( or Hook ) Element to add it above the content on mobile only. If you want to share a link to the site and let me know which widget should be above, i can advise.

    #1876371
    Ben

    Thanks David. That’s a really good idea to use a hook element. The widget just contains html so the contents could be placed under the header on mobile view only using a hook, and then I guess all the widgets could be hidden on mobile view too.
    I can see that this would all work… I just need to work it out now 🙂
    Thanks again!

    #1876946
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.