About

Taking inspiration from the multitude of “link in bio” options, our Link in Bio cloneable takes the simplicity of the others, and blends it with the power of the Webflow CMS making this directory style, one page website simple, effective, and expandable. Clone it, remix it, and make it your own (we even use it ourselves! — webflow.com/linkinbio)

How it works

Ultimately, the goal here was to keep things simple and streamlined, with the intent of guiding visitors to a list of links as quickly as possible. The layout is constrained to a max-width of 600px, the design aesthetic is purposefully vanilla, and the content is streamlined to just headline text and a few images.

Sections

Aligning to the Webflow CMS (note: “Link section category” in the CMS under the Links collection), the layout is structured into five stacked sections:

• Navigation — keeping this to just a logo and a brief list of social links encourages visitors to keep moving down the page
• Featured — the main focus, an area to highlight the main story / link (including the optional image)
• Latest — secondary links that might be relevant to the featured link
• “Ad unit” — an optional, text + image area to make an additional, distinct callout (aside from the featured section) 
• Resources — a list of links to point visitors to specific directories of content

CMS

As noted above, each of these sections is powered by the Webflow CMS and divided into just two collections:

1. Links — regardless which section they live in, all links are created from this collection and sorted/filtered to their appropriate area based on custom fields for category and sort order (aka where you want them to live and what order they should be in)
2. Ads — a straightforward “ad unit” with a toggle to turn on/off (in the event there are multiple items with the toggle left “on”, the system defaults to the last published item so only one ad is ever displayed at a time)