Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

GeneratePress GenerateBlocks

Issue with Sticky Sidebar for Table of Contents Not Functioning Properly

  • buatduit
    May 4, 2025 at 2:30 am

    Hi there,

    I hope you’re well. I recently implemented a sticky sidebar for the Table of Contents on my website, but it’s not behaving as expected. Instead of staying fixed or floating as I scroll down the page, the sidebar scrolls away with the rest of the content.

    Could you please help me figure out what might be causing this issue or guide me on how to fix it?

    Thank you for your support!

    Best Regards,
    Buat Duit

  • Alvind
    May 4, 2025 at 7:30 pm

    Hi there,

    Due to your layout structure, it’s not possible to make the section sticky. The parent container of a sticky element must have enough height for the sticky behavior to work properly.

    The alternative would be to add the TOC into a sidebar and use custom CSS to achieve the sticky effect.

    By the way, what method are you using to create the sticky TOC?

  • buatduit
    May 5, 2025 at 5:00 am

    Hi Alvind,

    Thank you for your response.

    I’ve managed to solve the initial issue by applying a suitable height to the parent container, which allowed the sticky behavior to work properly. To create the sticky TOC, I placed it inside a container and added custom CSS to achieve the desired sticky effect.

    However, I’ve encountered a new issue: when viewing the page on a mobile device, the sticky TOC appears at the bottom of the article instead of remaining in view or behaving responsively.

    Could you please advise how I can resolve this issue on mobile? I’d appreciate any guidance or best practices to make the TOC more mobile-friendly.

    Thanks again for your help!

    Best Regards,
    Buat Duit

  • Ying
    May 5, 2025 at 9:42 am

    Select the Grid container that contains the TOC, switch to mobile view, and set its order to -1 which will bring it up.

  • buatduit
    May 6, 2025 at 4:59 am

    Hi there,

    Thank you so much for your help!

    I followed your instructions again, and this time the issue was successfully resolved. The TOC now appears correctly on mobile.

    Really appreciate your support!

    Best regards,
    Buat Duit

  • Ying
    May 6, 2025 at 9:24 am

    Glad to hear that 🙂

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.