Keeping the hamburger menu visible while scrolling on mobile

[rafisics]

Checklist

• I have read and accepted the contributing guidelines.

How did you create the site?

Built from jekyll-theme-chirpy

Description

While scrolling long posts or pages from a mobile device, I like to keep the hamburger menu visible at the top bar's left side, just like the ToC appears at the right side. How to do it?

Operations you have already tried

Here's the chirpy theme I am using with a few modifications: https://github.com/rafisics/chirpy-test

Anything else?

No response

[lotusk08]

There's no need for that; just scroll to the top to find the sidebar button in the top left. This theme has a tocbar and a top bar. You can duplicate this button without adding complexity. I prefer to think independently.

[rafisics]

I understand the current layout and that the menu button is accessible at the top. However, for my longer posts on mobile, I personally find it helpful to have the menu button persistently visible, similar to how the ToC appears on the right. It's my personal preference, which is why I asked here.

You mentioned duplicating the button without adding complexity; that sounds like a reasonable approach. Could you please point me to the relevant part of the code or suggest how best to go about it? Thanks.

[lotusk08]

You might try to call sidebar from tocbar with optional only for mobile like #sidebar-trigger at this.

The logic is:

• Add HTML elements for tocbar (post/page layout) to make it available at the top but not display without mobile (display: none;).
• Style it with CSS in whatever you want, recommend using inline CSS with an HTML in _included/ folder for better performance. (though).
• Adjust the javascript to make the button work!

Good luck!