Discover the best anchor websites created by professional designers. Get inspired and start planning your perfect anchor web design today!

Hello fellow Webflowers,

We have built a fresh freebie services overview page. All categories with associated references are dynamically loaded with Webflow collection items. - you can simply add new categories or associated references and remain a good user experience by enabling the progress bar indicator. 🤩 

The progress bar we created scrolls to the dynamic collection blocks, this is 'normally' not possible, because collections can't have anchor links. We resolved this with a nice hack by assigning an 'ID' to the collection classes 😄 thru an embed and then converting the progress bar links to anchor links so you can scroll back and forth thru all the collection items. 🤙

If you like this project and find it helpful please like ❤️ it so other Webflowers can see this project and use it on their next website 🙌

Dynamic collection progressbar

Progressbar - anchor links - Dynamic Collection

Anchor Links - Liquid Nav Links

Liquid Nav Anchor Links

Memberstack

Happy Thursday! 

I recently needed a way to dynamically generate a table of contents that works with the Webflow CMS. Figured it might benefit others to share it in a simple cloneable project.

Everything is styled and configured to be super easy to drop into your project. The code is located in embeds, the page is a static Webflow page (not connected to the CMS), and all styles are applied via class names so you won't lose anything during the copy/paste process. 

I hope it serves you well!

The layout is by Flowbase, the sticky table of contents is by Flowrite (1), and the code styling is by highlight.js (2). Photos from Pexels.

1. https://www.flowrite.com/blog/dynamic-table-of-contents-on-webflow-cms
2. https://highlightjs.org/

Blog CMS Table of Contents

CMS Table of Contents

This free cloneable is great for quickly using all common social media icons assets and social buttons for your next Webflow project! Just copy and paste any section that is most appropriate for your project.

-> Copy paste to your Webflow project
-> Add custom animations 
-> Modify the size of the classes 
-> Create separate assets for social sharing icons
-> Save time on your work!

Social Media Sharing Links

Free Social Media Sharing Links

Finsweet

Learn how to add complex, non-native functionalities to your Webflow CMS websites for free in this beginner tutorial series!

BeginneRR Series: F'in sweet CMS Library for Webflow

This is an on-going project for my current team. Anchor links and sticky design are used for the purpose of keeping it an organized one-pager. Will be designing the banner section soon.

Dongwei's Amazing Project

Octaive Homepage (in-progress)

Noureddine Made

Create dynamic anchor tags from rich text in your cms collections.

While working on a client's Webflow website, I needed a table of contents for each product information page and advice blog post. The problem was that this needed to be a dynamically generated list that included anchor tags to each specific section or chapter based on the content in a rich text field.

I looked at solutions online but only came across half solutions or solutions for full collections and not for the content inside of each collection item. So I decided to make my own.

The solution I came up with is super simple and allows you to customise it to your exact needs. All we need to do is give two elements on the page a unique ID and then add 15 lines of custom code.

Dynamic Anchor Tags from Rich Text (CMS/Collections)

Dynamic Anchor Tags from Rich Text (CMS collections)

Ali Saeed

The website uses a custom code snippet and ID links to smoothly scroll to anchor links on another page. 

Try it out :)

Smooth Scroll

Smooth Scroll to Anchor Link on Another Page

Site is based on https://www.love.com/

This is site is developed only for the purpose of learning and experimenting.

ED love

Section Scroll using Scrollify - Everything Design

On-going homepage for D&D Design, my partner Daisy and I are helping client design and develop wechat H5, web and APP experience. This is our starting point. Eng version will come with a switch after we hammer out the service description.

Belite Consulting

d-d-design

a quick project showing how it's possible to use anchor links within a rich text block.

CMS anchor links

Rich text field anchor links

Link to an anchor on a different page, but smooth scroll to it.

Scrollllllly

Smooth scroll to an anchor on another page

Smooth scroll to anchor link after the page is loaded completely instead of quickly snapping to the section.

Hope this helps.

For questions, feel free to reach out.

Discover anchor websites built by the Webflow community

Discover anchor websites built by the Webflow community