Insert the progress bar in the bottom of sticky header

Hi @simonavshalom, that’s a nice feature, showing the title, never thought of that. This would require some custom javascript, or maybe I can build it in a future release, which would be more robust I guess. As it stands now, it is not easily done, sorry.
Regarding the stickyness: open your dev tools / inspector (F12 on windows, or right-click inspect) and locate the sticky header, once found, identify the unique identifier for that element, this can be an id (id=’blabla’) or a unique combination of classes (class=’header sticky-header the-coolest-header-ever’), than put that identifier into the WP reading progress bar settings page ‘Stick the bar to this element’ input, in css format, like so: #blabla, or .header .sticky-header .the-coolest-header-ever (id’s are preceded by #, classes by a dot). Alternatively: show me the page you are working on, so I can try to identify it for you.
Kind regards,
Joeri

• This reply was modified 2 years, 6 months ago by Joeri van Veen.

Hi @simonavshalom that website is not accessible to me. Can you double check the url?

Hi, I think you can target the bar with this: [data-id="32aa78c"] (in the input field ‘attach bar to this element’).
And then switch on ‘relative positioning’ (the checkbox) to have the bar move with the mobile menu as well.
You’re left with a gap though, this looks like a bug on my part which I will look into. Meanwhile you can easily correct that with the following css:

#ruigehond006_inner { margin-top: 0 !important; }

I don’t know how stable the data-id is, maybe elementor has some functionality where you can put an id on an element? That might be more stable.
Hope this helps, let me know how it goes!

• This reply was modified 2 years, 6 months ago by Joeri van Veen.