How to make notification bar sticky on scroll

Home › Forums › Front End PM PRO › How to make notification bar sticky on scroll

This topic is: Not Resolved
Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • January 12, 2022 at 6:07 am #44097
    c.cooper
    Participant

    I have a sticky header that shrinks and stays to the top of page on scroll. On scroll the FEP notification bar moves and leaves a 114px gap at top of page(above the header/menu). How can I keep the FEP notification bar in place (sticky) on scroll?

    Thanks!

    January 16, 2022 at 9:08 pm #44111
    Shamim Hasan
    Keymaster

    You can use #fep-notification-bar to add any css to notification bar.
    Try adding following code in Front End PM PRO > Settings > Appearance > Custom CSS

    #fep-notification-bar {
    position: fixed;
}
    March 8, 2022 at 12:25 am #44293
    c.cooper
    Participant

    Hi, tried that and the gap remains, probably due the head builder (dynamic header). Is there a way to add that bar as a shortcode?
    Thanks,
    CC

    March 8, 2022 at 3:57 am #44295
    c.cooper
    Participant

    I found this.
    https://sp-test1.arogga.co/docs/front-end-pm/getting-started/show-unread-message-count-in-menu/

    One of these will work.
    Thanks!

    March 8, 2022 at 5:03 am #44297
    c.cooper
    Participant

    So, I tried these as well. There seems to be a jump on the menu when the page loads, the menu shifts. Back to needing the message. Is there a way to make that message bar a shortcode to embed as a part. The size of our header shrinks.

    The fixed position of the notification bar hides the header/menu in part.

    Thanks!
    CC

    March 9, 2022 at 6:55 pm #44305
    Shamim Hasan
    Keymaster

    You can then directly use fep_notification_div() function which will echo the bar. You can show where you like.

    March 9, 2022 at 10:56 pm #44314
    c.cooper
    Participant

    Not sure of the syntax on how to add this. Sorry, I don’t want to blow up the site with the wrong syntax.

    <?php echo fep_notification_div(); ?>

    I’m using Beaver themer for page templates and a snippet app for php.

    March 10, 2022 at 10:44 am #44316
    Shamim Hasan
    Keymaster

    I recommend you to use a staging website first to test changes and after tested, update live site.

    Also, this function already echo, so no need to add echo there.

    March 11, 2022 at 1:08 am #44319
    c.cooper
    Participant

    Hi I tried to insert that after header in a Generate Press element (both with and without the semi-colon. With and without executing php. Only would show raw text in the container.

    fep_notification_div()
    fep_notification_div();

    March 12, 2022 at 10:58 pm #44333
    Shamim Hasan
    Keymaster

    If php can execute it should echo header bar.
    You can also try adding that directly in template php file.

    March 31, 2022 at 1:29 am #44393
    c.cooper
    Participant

    I am using Generatepress hooks. This code is not working. Tried after header content, before main content. It’s not working in any of these hooks where php is executed. See example in screen shot below.

    https://www.screencast.com/t/mTSTvHBd

    April 8, 2022 at 11:29 pm #44410
    Shamim Hasan
    Keymaster

    Do you use unread messages in inbox? That bar will only show if you have unread messages.

    If still not working can you please contact that theme/plugin author if they have any idea why this code is not executing?

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)

You need to purchase ‘Front End PM PRO’ to create topic in this support forum.

If you already purchased ‘Front End PM PRO’ please LOGIN.