Designing the Item Page & Dynamic Content

The listing page shows all your Items together. This article is about the other half: the page a visitor sees when they click into a single Item: the full detail page for one project, one service, one property. You design it once, as a template, and every Item you ever add uses it. The magic that makes that possible is called dynamic content, and it's the most powerful idea in the whole Content Types system.

Where to design it

Open Content → Content Types, click your Content Type, and choose the Inner Design tab. "Inner" here just means the inside page: the individual Item page, as opposed to the outer listing that lists them all.

Build it like any other page

You design the item page exactly the way you build a regular page on your site: by stacking sections. Add a Hero at the top, a Rich Text section for the body, an image gallery, a call-to-action, a contact form, whatever suits the content. Arrange and style them however you like.

The difference from a normal page is one setting on each section: its Content Mode. That's what turns a fixed layout into a living template that fills itself in for every Item.

The key feature: Content Modes

Because this one design has to work for every Item, each section needs to know: should it show the same thing on every Item, or should it pull in that particular Item's own information? You answer that with the section's Content Mode. There are three:

Content Mode	What it does	Use it when
Static	You type the values in directly. The section looks identical on every Item.	A section that's the same everywhere: a "Request a Quote" call-to-action at the bottom of every service page.
Hybrid	You choose, field by field, whether to type a value in or pull it from the Item.	A section that's mostly the same but has one or two parts that should change: a fixed heading with the Item's own image below it.
Dynamic	Every part of the section pulls from the Item's own data.	A section that should be completely different on each Item: a Hero whose title, image, and text all come from that Item.

So on a single section you're really answering one question: "Where does this text (or image) come from: do I type it here, or does it come from each Item?" Static means you type it; Dynamic means it comes from the Item; Hybrid lets you mix the two within the same section.

A worked example: a Service detail page

Say you run Meridian Studio and you've set up a Services Content Type with fields for a description (body), a banner image (heroImage), and a photo gallery (gallery). Here's how one Inner Design template serves every service automatically:

• A Hero section, set to Dynamic: its title pulls from each service's Title, and its background pulls from the heroImage field. On the "Brand Identity" service it shows that title and image; on "Website Design" it shows those instead. Same section, different content, zero extra work.
• A Rich Text section, set to Dynamic: its body pulls from the body field, so each service shows its own write-up.
• A Gallery section, set to Dynamic: it shows the photos from that service's own gallery field.
• A call-to-action, set to Static: "Start a project," identical on every service page because it should be.

You built that page one time. Add a brand-new service tomorrow, fill in its fields, and its detail page appears fully formed (correct title, correct image, correct description, correct gallery) without you touching the design again.

What you can pull from

When a section is set to Hybrid or Dynamic, you tell each part which piece of the Item to pull from. Two kinds of information are available:

• The four built-in item fields, which every Item always has:
  • Title: the Item's name.
  • Slug: the Item's web address ending.
  • Excerpt: the short summary you write for it.
  • Featured image: the main image you set for it.
• Any custom field you defined on the Custom Fields tab: the price, the gallery, the completion date, and so on. This is where those tidy field keys pay off: you'll recognize price or heroImage instantly when you're choosing what a section should show.

Putting a field inside a sentence

Content Modes swap out a whole part. The heading becomes the Item's title, the paragraph becomes its description. That is what you want when the part is nothing but the field. It does not help when you need words wrapped around it, like "Gutter repair in Asheville", where only the town changes from one Item to the next. Until now that meant retyping the sentence on every Item.

Instead, leave the section on Static and write the field key in curly brackets inside your normal wording:

Gutter repair in {custom.field.city}

Every Item's page fills in its own town. Any field you defined on the Custom Fields tab works this way, and so do the built-in ones: {custom.field.title}, {custom.field.excerpt} and {custom.field.slug}. It works in headings, paragraphs, button labels and rich text alike.

Your business details, on any page

The same brackets pull in your contact details, and these are not limited to Item pages. They work anywhere on your site:

• {site.phone}: your main phone number.
• {site.email}: your main contact email.
• {site.address}: your business address.
• {site.businessName}: your full business name.
• {site.name}: your site name.
• {site.domain}: your web address.

Write "Call us on {site.phone}" once and it reads correctly everywhere you used it, so changing your number is one edit rather than a hunt through every page. See Logo, Contact Details & Menus for where those details are set.

Worth knowing

• Capitals and spaces do not matter: a field named Review Highlight answers to {custom.field.review-highlight} just as well as the exact name.
• A typo leaves a gap, not a mess: get the name wrong and the live page shows nothing in that spot rather than printing brackets at your visitors. Live Preview marks it with a warning so you catch it first.
• Item fields need an Item: {custom.field.city} has nothing to read from on an ordinary page, so it comes out blank there. The site ones work everywhere.
• Use them for wording, not web addresses: they fill in text, so they do not belong in the link box where a button points.

Adding a sidebar

Your item page can include an optional sidebar alongside the main content, a narrower column that runs down the side of the page. It's a natural home for quick facts (a property's price and square footage, a service's key details), a small contact prompt, or an automatic table of contents that links to the sections further down the page. Turn it on when the content benefits from an at-a-glance panel; leave it off for a clean single-column read.

Advanced touches

One-off Extra Blocks on a single Item

The shared template covers the vast majority of what you need. But every so often one Item deserves something special. Individual Items can add their own Extra Blocks: one-off sections placed before or after the shared design, just for that Item. Maybe one flagship project earns an extra video and a client testimonial that the others don't have. You add those on that single Item without disturbing the template or any other Item. The shared design stays exactly as it is for everyone else.

A pop-up that fills itself in

You can also define a pop-up on the item design, for example a "Book this service" window that opens when a visitor clicks a button. Like the rest of the design, it can pull from each Item's data, so the same pop-up fills itself in appropriately on every Item. Open it on the "Brand Identity" page and it knows it's about brand identity; open it on another and it adapts, all from the one definition you set up.

The takeaway

Design the item page once, decide for each section whether its content is typed in (Static), mixed (Hybrid), or pulled from the Item (Dynamic), and you've built a template that quietly does the heavy lifting forever. Every Item you add from now on gets a complete, on-brand detail page for free. With the design finished, you're ready for the best part: adding your Items, covered in the next article.