Can I add a sticky sidebar with section links on a CMS Collection Page template in Webflow, similar to Webflow's Article collection page template?

Yes, you can create a sticky sidebar with section links on a CMS Collection Page template in Webflow, just like Webflow's blog article template. Follow these steps to set it up:

1. Add a Sidebar to the CMS Template

• Open your CMS Collection Page template (e.g., Blog Post Template).
• Drag a Div Block into the page and place it where you want the sidebar (typically inside a two-column layout).
• Set this Div Block’s position to sticky and adjust the top value (e.g., top: 20px) so it stays visible when scrolling.

2. Create Section Links

• In the sidebar, add a Nav Block or a simple List of Links.
• Each link should use the ID of a section within the page (e.g., #section-1, #section-2).
• To reference specific CMS content, wrap each anchor link inside a Collection List, linking to CMS fields (like headings).

3. Add Section IDs Inside the Main Content

• Identify key sections in your CMS Rich Text Block or other content areas.
• Insert Div Blocks inside these sections and assign them unique IDs (e.g., section-1, section-2).
• Your sidebar links should match these IDs (e.g., “Introduction” → #section-1).

4. Ensure Smooth Scrolling

• Go to Page Settings → Enable Smooth Scroll for in-page navigation.
• If using custom interactions, create scrolling animations in Webflow’s Interactions panel.

5. Make It Responsive

• Check the layout on tablet and mobile views.
• Consider hiding or converting the sidebar into a fixed top menu on smaller screens.

Summary

You can create a sticky sidebar with dynamic section links by adding a sticky div block, linking it to in-page section IDs, and ensuring smooth scrolling. This setup mimics Webflow’s blog article template while remaining responsive.