Recipe: Build a Services Section

Services are the Content Type most likely to earn you money, because a page per service is what people find when they search for the thing they need right now. Someone typing "emergency drain unblocking near me" wants a page about that, not a paragraph three-quarters of the way down a general services page.

This guide builds one end to end. The example is Rowan Plumbing, but the shape fits any trade with a handful of distinct offerings: a renovation firm, a law practice, a cleaning company, a studio.

How this one differs from a portfolio

Worth saying up front, because it changes the decisions. A portfolio grows forever and visitors browse it. A services list is short, stays roughly the same for years, and visitors do not browse it, they arrive at one specific service and want to book.

That means:

  • The item page matters more than the listing page. On a portfolio the listing is the destination. Here the individual service page is the destination, and often the first thing a visitor ever sees of your site.
  • Every service page needs a way to get in touch on it. Not a link back to a contact page, an actual call to action on the page.
  • Order matters more than filters. Six services do not need filtering. They do need your most profitable one first.

Step 1: Create the Content Type

In Content Types:

  • Name: Services
  • Singular label: Service
  • URL slug: services, giving you yoursite.com/services/drain-unblocking and so on

Turn on Show in navigation. Unlike a portfolio, services belong in the main menu.

Step 2: Choose the fields

Title, Featured image and Excerpt come built in. Rowan Plumbing adds:

Field Type Why
Short summary Textarea One or two plain sentences for the card and the top of the page. Textarea rather than Rich Text keeps it from growing into an essay.
What's included List A repeating mini-table, one row per thing. This is the field that answers the question visitors actually have.
Starting price Number Optional, and worth arguing about internally. See below.
Full description Rich Text The detailed write-up, with headings and links. This is what search engines read.
Response time Text "Same day", "Within 2 hours". Short, concrete, and reassuring at the exact moment someone is deciding.

Why List rather than a Rich Text bullet list for "What's included". A List field is a proper repeating structure, so every service presents its inclusions in the same shape, and you can render them as a tidy checklist rather than whatever bullets someone typed that day. It also stops the write-up and the inclusions blurring into one another.

On Starting price. Plenty of trades leave it off, and that is a legitimate choice. But a Number field with nothing in it renders as nothing, so you can add the field now and fill it in only for the services where a number helps. That is better than adding the field in six months and editing every service.

Step 3: Design the listing page

Open Archive Design. This is your Services page.

Services suit fewer, larger cards than a portfolio does. Two or three columns, each showing the featured image, the title and the excerpt. Turn the date off, since when you published a service page says nothing useful.

Skip filters for a normal list of six or eight. If you genuinely have thirty services across residential and commercial, add a Category Select field and turn filters on, exactly as the portfolio recipe does.

Step 4: Design the service page, which is the important one

The Inner Design tab, which is where you lay out the individual page. Build this one carefully, because it is your landing page and every service inherits it.

A structure that works:

  1. A banner with the heading pulling from the service Title and the background from the Featured image, plus a "Book this service" button.
  2. A text section pulling from Short summary, so the page opens by confirming the visitor is in the right place.
  3. A section showing What's included, pulled from your List field.
  4. A text section pulling from Full description, for the depth and the search engines.
  5. A call to action at the bottom.

The piece that makes this feel bespoke rather than templated is putting the service's own details into the surrounding copy. Typing {custom.field.Response time} in a sentence prints that service's value, so a single line of copy reading "We aim to be with you {custom.field.Response time}" is accurate on every service page without you writing it out per service.

You can pull your business details the same way with {site.phone}, so a call to action reading "Call us on {site.phone}" stays correct everywhere, including after you change your number in Site Settings.

These tokens fill themselves in from the service being viewed, which is why they only work on a service page. On an ordinary page there is no item behind them, so they render as nothing.

Step 5: Add your services in the order you want them

Add an Item per service. Write the Short summary for a person deciding, and the Full description for a person researching. They are different readers and it is a mistake to write one thing for both.

Put your most profitable service first. On a short list, order is the only prioritization you get, and it is the one most businesses forget to use.

Step 6: Put them under your homepage banner

Edit the homepage, add a Collection Listing section under your main banner, and point it at Services.

Unlike the portfolio, show them all rather than capping at three. A visitor landing on your homepage should be able to see everything you do without a second click, and for six services that is a single tidy row.

Switch off the "See all" link if every service is already on screen, since a link promising more when there is no more is a small letdown.

What this gets you

Each service now has its own page, with its own web address, its own heading, its own description and its own call to action. That is what search engines index and what you can point an ad at. Adding a seventh service means filling in a form, and it arrives with a complete landing page already built.

The design work happened once. Every service since has inherited it.

Was this helpful?