Skip to content
Public Ticket #22715

Fix topbar on mobile

Conversation thread

Udbye7120 replied

Customer Reply

Thanks a lot ??

Udbye7120 replied

Customer Reply

Hi,

Thanks a lot, but now the cart icon and the search icon is missing on the mobile navigation bar as you can see on the attached image. Are these icons missing on your devices?

Thanks

Thomas

PenciDesign Supporter replied

Staff Reply

Hi,

The current version of Soedad doesn't support sticky topbar content on mobile, but you can force it always be sticky by adding the following CSS code to your site.

@media only screen and (max-width: 767px) {
    .penci-top-bar {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 999;
    }
    .is-sticky #navigation {
        top: 71px !important;
    }
    body {
        padding-top: 71px;
    }
}

If you want to get the perfect solution, please build your custom header layout with the Penci Header Builder: https://soledad.pencidesign.net/soledad-document/#header-footer-builder

Regards,
PenciDesign.



Udbye7120 started the conversation

Conversation Start

Hi,

Is it possible to fix my orange topbar on mobile devices, so the topbar maintains its position just above the head navigation? Now the orange topbar dissapperas when scrolling.


Thanks,

Thomas

Want to join this conversation or access attachments? Sign in first.