Hansler is a portfolio template for designers, photographers and small studios who would rather show the work than write about it. There is no hero section. The home page is the feed.
Most portfolio templates loop over projects, so each project gets one cover image and everything else is buried on a detail page. Hansler loops over a Media collection instead. Every image or video is its own CMS item with a reference back to its project, so one project can put six frames into the grid and each frame is a tile of its own. The home page reads like an index of images, and the project pages still hold the full story.
Pages
- Home. Masonry grid, category chips, staggered load, sorted by any CMS field.
- Work detail. Fixed project column, centred media column, lightbox, next project link.
- About. Practice, selected clients, recognition list.
- Contact. Native Framer form with name, email, project type and message.
- 404.
Inside
- Three CMS collections: Work, Media and Categories, filled with 18 projects and 30 media items.
- A layout template holding a glass sidebar that turns into a floating pill and a drawer on phones.
- Six components: Shell, Chip, Avatar, Client Logo, Recognition Item and Submit Button.
- Project fields that hide themselves when left empty, so short entries never leave holes.
- Video tiles alongside images, in the feed and in the lightbox.
- Colour and text styles on every layer, so one token swap restyles the whole site.
- Desktop, tablet and phone breakpoints.
Notes
Instrument Sans and IBM Plex Mono, both free. Light mode only. Text and control contrast clears WCAG AA, and the appear animations switch off for visitors who ask for reduced motion.
Swap the CMS content for your own and the site is finished.
