Collections

Group multiple projects into a single shareable page with one short URL, QR code, and embed.

What is a collection?

A collection is a lightweight container that bundles multiple projects from your workspace into one public page. Instead of sharing five different links, you share one, and visitors browse all your projects from a clean grid.

Collections live alongside your projects under the workspace, with their own visibility settings, view counter, and shareable URL. They are perfect for:

A fashion magazine sharing all monthly issues in one place
A photographer presenting client galleries together
A real estate agent grouping property catalogs
An event organizer bundling all session decks
Any creator who wants visitors to browse their portfolio of projects

Creating a collection

Anyone in the workspace can create a collection. To get started:

Open the Collections tab in your workspace sidebar
Click "New collection" in the top right
Give it a title (and an optional description), both are shown publicly
Click Create and you'll be taken to the editor to configure the rest

Adding, reordering, and removing projects

All project changes inside a collection are local until you click Save. The Save button highlights and an "Unsaved" badge appears whenever there are pending changes.

Add projects

Click "Add projects" in the Content tab. The picker shows every project in the workspace as a card, with search and filters by type and visibility; switch to the Studio tab to add Studio pieces the same way. A piece appears on the page as a card of the project it films, marked Studio, and opens its own page. Projects already in the collection stay visible, marked as added.

Reorder

Drag the handle on the left of each row to rearrange the order. The order in the editor matches the order visitors see on the public page.

Remove

Click the × button on a row to remove a project. The project itself stays untouched in the workspace, only the link is removed.

Card content

The pencil on each row opens what the card says on this page: a description just for this collection (empty uses the project's own), a category, and external links with an icon, a label and a URL, like a dock item: a YouTube video, a store page, a PDF. Each card can also show the live project embedded instead of its preview; the Magazine and Editorial layouts do that for their featured card by default.

Use Cmd/Ctrl + S to save quickly. Click Undo to revert all unsaved changes back to the last saved state.

Customizing your collection page

Pick a template in the Templates tab to set the whole look at once, then fine-tune anything in the Style tab so the public page matches your brand. In the preview, click any element (the title, a card, the navbar, the footer) and the sidebar jumps to its settings.

Layouts and themes

Two independent choices in the Templates tab. A layout is how the page is arranged (twelve, after the shadcnblocks blog patterns: card grids, a featured story, a magazine masthead, a bento, a category sidebar, a timeline, horizontal strips). A theme is colors, fonts and the card frame (nineteen palettes). Pick any of one with any of the other; the miniatures of the layouts are drawn in your current theme. Your projects, tagline, categories and footer are always kept.

Midnight, Ivory, Cream, Charcoal, Neon, Paper, Terracotta, Pastel
Noir, Forest, Sunset, Ocean, Concrete, Rose
Lime, Teal, Indigo, Newsprint, Amber

Categories and navbar

Group projects into categories in the Categories tab: they become filter pills, navbar entries and, if you turn it on, one section per category. The Navbar tab decides what visitors see at the top: your workspace logo and name, a logo of your own or nothing, plus custom links and your social links.

Categories: name and color; assign one to each project from its card content panel
Filter pills, a badge on each card and optional grouping by category
Navbar brand: workspace identity, a custom logo you upload, or none
Favicon: upload any square-ish image and the page gets its own browser-tab icon, cropped and resized for you
Navbar links: categories inline or as a dropdown, custom external links, social links
Navbar options: keep it fixed on screen while visitors scroll, and show or hide the brand name
"Made with i3dify" in the footer: always on for the free plan, optional on paid plans
Banner: a strip above the navbar with a message, an icon and a link; keep it fixed while the page scrolls, and let visitors close it

Page hero

In Style › Page hero, upload a background image for the header. It is resized and compressed like every other upload, and it is deleted with the collection.

Coverage: a band at the top that fades into the page color, or the whole page
Focus: which part of the image survives the crop (top, center, bottom)
Blur, a tint of the page color so the title stays readable, and a black-and-white switch
Colors of their own for the tint, the title, the subtitle and the accent, so the title reads over the photo whatever the page palette
Replacing or removing the image deletes the old file from your storage

Blocks and pages

The main page is a list of blocks in the Content tab, with the Projects block where your projects go. The Pages tab adds pages of their own under the collection, each with blocks and a breadcrumb back to the main page.

Blocks: heading, text, quote, about, showcase, image, YouTube or Vimeo video, button, divider, spacer and projects
YouTube feed: paste a channel, @handle or playlist and the page shows its latest videos in the page's grid or as a strip, always current
Text with formatting: bold, italic, links and lists in text and about blocks, and every block with copy picks its text size and weight
About: a picture beside a title and copy, a row of big numbers and a button. Showcase: a few projects, big, one row each or as a list
Drag to reorder; click a block in the preview to open its settings
Every block can carry colors of its own, and images and videos pick their width: a column, the text width, the page or edge to edge
Pages live at /c/<id>/<address>, are listed in the navbar, and a button block can link to one
Images in blocks go through the same compression as every other upload and are deleted with the collection

Style

Background, text and accent colors: the accent tints links, the tagline and the hero glow
Card layout: stacked, text over the image, inset image, side by side, caption only, reveal on hover, text first or polaroid; plus card background, frame (flat, elevated, outline or glass) and corner radius
Title and body fonts: the i3dify defaults or a curated set of Google Fonts
Tagline above the title, and toggles for project type, and descriptions
Footer text and social links
How cards open: this window, a new tab or a dialog over the page, with a per-card override

Layout

Classic: title on top, projects in a grid or a list, 1 to 4 columns
Hero: a big title band, then the grid
Split: title pinned on the left, projects scroll on the right
Editorial: first project featured large, the rest in a grid
Showcase: one project per row, alternating sides, with big numbers
Mosaic: tiles of mixed sizes where the first one leads
Minimal: a narrow list with thin dividers
Bento: mixed-size cards where the first one takes a 2×2 cell
Sidebar: categories on the left, rows on the right
Timeline: a vertical feed with a date beside every project
Magazine: oversized title, a featured story beside a stack of short rows
Strips: horizontal scrolling rows, one per category
Spacing: compact, comfortable or spacious
Pagination: page numbers with previous/next and a per-page selector (the default), a Load more button, or infinite scroll, with the page size you choose
Search: a box under the header and, if you want, another in the navbar; visitors filter the projects by title, description, type or category as they type

Sharing your collection

Each collection has its own short URL like /c/abc12345 and supports the three visibility modes you already know from projects:

Private

Only members of the workspace can open it. The public URL returns a Not Found page to prevent leaks.

Unlisted

Anyone with the link can view it, but search engines don't index it. Best for client-only sharing.

Public

Anyone can find and view it. Indexed by search engines for organic discovery.

Three ways to share

Open the Share tab to find:

URL: copy the short link and paste it anywhere
QR code: download a PNG (4 sizes available) for print and offline events
Share the collection link, or add it to your own i3dify pages
Custom domain (paid plans): in Share › Custom domain, point a subdomain of your own like portfolio.yourstudio.com at the collection. The page opens at the root of that domain and its custom pages at /<address>

What about private projects inside a collection?

You can add any project to a collection, regardless of its visibility. As the owner you'll always see them in the editor, marked with an eye-off icon that reads "Project is private, won't be shown publicly".

On the public page, private projects are filtered out automatically. If you make a private project public later, it reappears in the collection without any extra action.

Collaboration

Collections are workspace-level resources, designed to be edited collaboratively:

Any workspace member can create and edit collections
Any member can add, remove, or reorder projects
Only owners and admins can delete a collection
Projects can only be added from the same workspace, you can't pull projects from someone else's workspace into yours

Tips and best practices

Match the background color and font to your existing brand for a cohesive look
Use grid mode with 3 columns for portfolios, list mode for catalogs with longer descriptions
Set visibility to Unlisted for client work, same access without being indexed
Generate the QR code at 1024px for high-quality print collateral
Link your public collection from your homepage to showcase your full body of work