Everything you can change, in plain English. Nothing here needs code. Find what you want to do in the menu on the left, follow the steps, and glance at the picture beside each one.
Your site is built from small, labelled boxes you fill in. You never touch code. There is one rule that makes everything easy:
Leave a box empty and that part disappears from the page. You can't break the layout, so fill in what you have and skip the rest. Every field below works this way.
Theme editorThe look: sections, text, images, colours. "Customize" on your theme.
ProductsEach service and its page content (the metafields).
ContentBrands, gallery and icons (the metaobjects).
The mental model
The three places you edit
Almost every change lives in one of these three places. When something isn't where you expect, it's almost always in one of the other two.
Theme editor the lookSection text & images, the order of sections, colours, spacing, the header, the footer. Online Store → Themes → Customize.
Products servicesA service's price, photos and all its page content (the "metafields"). Products → pick the service.
Content reusableBrands, gallery photos/videos and custom icons (the "metaobjects"), plus menus and blog posts. Content → Metaobjects / Menus / Blog posts.
Metafield = an extra labelled box on a product. Metaobject = a reusable content card (a brand, a gallery item) you create once and the site places for you. That's the only jargon in this whole guide.
How-to
Using the theme editor
The theme editor is a live preview with a settings panel. Click anything on the left to edit it; changes show instantly and only go live when you Save.
Online Store → Themes → Customize on your live theme.
Use the page dropdown at the very top to move to the page you want (Home, a service, About, and so on).
On the left is the list of sections on that page. Click a section to open its settings; edit text and swap images on the right.
Reorder by dragging a section up or down. Hide one with the eye icon. Add one with "Add section".
Click Save (top right). Nothing is public until you save.
Customize › Home
Sections on this page
Hero slider
Services grid
Brand strip
Drag to reorder · eye to hide · click to edit its text & images.
Your content · the big one
Service pages & their fields
Every service (New Car Detail, Window Tinting, a course…) is a product. The top of the product controls the basics; the Metafields section further down controls the whole rich page. Here is exactly what each box does.
Products → click the service.
At the top set the Title, Price and Media (the first photo is the big hero image). Price 0 shows your "Price on assessment" label instead.
Scroll to Metafields and fill the boxes below. Then Save.
Hero — the top of the page
DTC EyebrowSmall label above the title, e.g. "Studio Detailing".
DTC IntroShort intro paragraph under the title.
DTC DurationHow long it takes; shows as a chip by the price (e.g. "1 to 2 days").
DTC Price noteSmall note under the price (e.g. "from", tiered pricing).
DTC Benefits one per lineThe benefit chips. Aim for about six.
What's Included — four stage cards
Included Stage 1–4 titleEach card's title (e.g. "Exterior Preparation & Decontamination").
Included Stage 1–4 points one per lineThe bullet points inside each card.
DTC Includes fallbackA simple list used only if the four stage cards above are empty.
About, Ideal For & The Result
About section textTwo short paragraphs. Falls back to the product description if empty.
About section imageImage on the right. Falls back to a product photo.
DTC Ideal For one per lineWho the service suits, as a bullet list.
Ideal-for section imageImage beside the "Ideal for" list.
DTC ResultShort paragraph describing the outcome.
DTC Before / After ImageThe two photos for the drag-to-compare before/after slider.
Result callout title / textA highlighted callout card within the Result section.
Pros & Cons, Ceramic, Aftercare, Area, FAQs
DTC Pros / Cons one per lineThe Pros list and the "Good to know" list.
DTC Ceramic Included empty = hiddenCeramic-coating text. Leave empty on non-ceramic services to hide the whole section.
Ceramic / Aftercare / Area imageThe image beside each of those sections. Service-area image can be a map.
DTC FAQs Question|AnswerOne per line, with a vertical bar between the question and the answer.
Products › New Car Detail › Metafields
DTC IntroMost new vehicles leave the dealership with little protection…
"One per line" fields: press Enter between items. Leave any box blank to hide that part.
Save
Your content
Category pages
The category pages (Studio Detailing, PPF & Wrapping, Window Tinting…) build themselves. Each one shows every service you've put in that category — you never lay them out by hand.
To put a service in a category: Products → the service → Collections (right side) → tick the category. It appears on that page straight away.
A category's own title, image and intro: Products → Collections → open the category.
A service can sit in more than one category. Remove it from a category and it simply drops off that page — the service itself stays.
Your content · metaobject
Brands
One brand entry powers three places at once: the logo strip on the homepage, the Brands page, and a full page for that brand. Add it once.
Content → Metaobjects → DTC Brand → Add entry.
Fill the fields below, then Save.
NameThe brand name.
LogoA transparent PNG works best on the dark background.
DescriptionA short paragraph about why you trust the brand.
Specialties one per lineWhat they're known for (e.g. Ceramic coatings).
WebsiteThe brand's site; opens in a new tab from their page.
Featured on / offTurn on to include it in the homepage brand strip.
Shows on: the homepage strip (Featured only), the Brands page grid, and its own brand page at /pages/dtc-brand/<name>.
Your content · metaobject
Gallery photos & video
Add your work once. It appears on the main Gallery page and on the matching service page automatically, based on the category you set.
Set the fields, add your media, and Save. Every photo and clip becomes its own tile.
TitleA short caption for the piece of work.
CategoryWhere it lands. Use one word like tinting, or two with a comma for two pages: ppf,wrapping.
Images add manyYour photos.
Videos add manyShort clips. They only play when scrolled into view.
Shows on: the main Gallery page (everything) and the service page whose category matches.
Your content
The icon library
Wherever a setting asks for an icon, type one of these keys. They're crisp line icons that automatically take your brand colour. These are the ones built in:
car
sparkles
spray-can
bubbles
polisher
shower-head
droplets
shield-check
shield
badge-check
gem
award
star
thumbs-up
handshake
graduation-cap
book-open
users
clipboard-check
flask
wrench
paintbrush
window
car-front
van
truck
package
gift
layers
image
eye
sun
zap
clock
calendar
map-pin
navigation
phone
mail
globe
home
store
building
search
settings
life-buoy
lightbulb
question
alert
check
check-circle
plus
minus
arrow-right
chevron
close
headphones
shopping-bag
message-circle
pen-line
rocket
facebook
instagram
tiktok
youtube
Use your own icon anywhere
Want a custom icon, or to replace one of the above? Upload it once and reuse it everywhere by its key.
Content → Metaobjects → DTC Icon → Add entry.
Set the handle to a key. Use an existing key (e.g. shield-check) to replace that icon everywhere, or a brand-new name for a new one.
Upload your icon (a transparent PNG or SVG), then Save. Now type that key into any icon field.
Your content
News posts
Just type — the site styles it for you and adds it to the news slider on the homepage.
Content → Blog posts → Add blog post.
Write a title and your text in plain words, add a featured image (the cover), and keep the blog set to News.
Save. It appears in the homepage news slider and on the journal.
Selling
Gift cards
The gift card is a normal product with several amounts. Buyers can keep it or send it to someone; the recipient gets a branded page with a code and a QR to redeem in store.
AmountsEach amount is a variant on the gift card product — add or edit them in Products.
Wording & trust pointsEdit in the theme editor on the gift card page (the "DTC Gift Card" section).
RedeemingCustomers enter the code at checkout, or you scan the QR in store.
Design & setup
Colours, spacing & motion
One panel controls the whole site's feel. Change it here and every page follows.
Customize → the settings gear (bottom left) → DTC Design.
Accent / brand colourRecolours buttons, links, ticks and highlights across the whole site.
Accent hover colourThe slightly darker shade used when you hover a button.
Section spacingCompact, Normal or Spacious — how much breathing room between sections.
Scroll animationsThe gentle fade-in as you scroll. Turn off for no motion.
Content widthHow wide the content sits on large screens.
Customize › Theme settings › DTC Design
Accent / brand colour#F8B000
Section spacingNormal
Scroll animationsOn
Click the colour swatch to pick any colour; the whole site updates live.
Design & setup
Menus & navigation
The top menu and the footer links are managed in one place, and each link points at a real page, collection or product — not a typed web address.
Content → Menus. Open the main menu (or the footer menu).
Add menu item, type a name, then in the link box pick a page/collection/product from the list rather than typing a URL. Drag to reorder.
Save menu.
Always pick the destination from the list. That keeps links correct even if a page's web address ever changes, and avoids odd URLs.
Getting enquiries
The quote / booking popup
Every "Get A Quote" or "Book" button on the whole site opens the same popup — from a service page, a card, the blog or the phone bar. It even tells you which service the customer was looking at.
Knows the serviceOpen it from a service or product page and it shows "Enquiring about…" with that service, so you always know what they mean.
Fields & info panelEvery field is a block you can add, rename, reorder or remove. Edit in Customize → the DTC Enquiry Popup section.
Booking or email modeCustomize → gear → DTC Design. Booking = a free order lands in Orders. Email = a message to your inbox. See the next chapter.
On a phoneIt opens as a full-height sheet with the send button always in view — nothing to hunt for.
Don't miss a customer
Where enquiries & messages land
Every way a customer can reach you, and exactly where to find it. Check these daily so nothing slips through.
Quote / Book bookingCreates a free £0 order in Orders with every answer attached. No payment is ever taken — and an order can't land in spam.
Quote emailEmailed to your store email address instead of an order.
Contact formThe "Send Us A Message" form on the Contact page is emailed to your store email address.
Your store emailSet where those emails go in Settings → Store details → Sender email.
We recommend booking mode: requests arrive as orders you can't miss, mark as done, and search later. Make a habit of glancing at Orders each morning.
On a phone
The phone app bar & menu
Most of your customers are on a phone, so the site switches to a phone-first layout on its own. Two things are phone-only:
The bottom barA fixed bar with Menu, Call and a big Book a Quote button, always in reach wherever they scroll. Book a Quote opens the popup and knows the service they're viewing.
The slide-out menuTap Menu for the full navigation, a Get A Quote button and your contact details — all in the site's dark style.
Edit the barCustomize → the DTC Mobile Bar section — change the button label or phone number, or hide the Menu / Call buttons.
The Call button uses the number on the DTC Mobile Bar. Keep it the same as your real line and the footer number.
Get found
Titles & Google
Every product and page has a search title and description — the blue headline and grey text people see on Google. They're already written for you, but you can refine any of them.
Open a Product or page, scroll to Search engine listing and click Edit.
Keep the title short with the service + your town (e.g. "Window Tinting, Ilkeston & Derby") and the description to one clear sentence.
Good to know
What you can & can't change
Almost everything is yours to edit. A few pages are controlled by Shopify itself — you can still change their words, just not their full design.
Legal policies (Privacy, Terms, Refund, Shipping) — edit the text in Settings → Policies. Shopify won't let these use the custom page design, so we've skinned them to match.
Checkout — styled in Settings → Checkout.
Emails & the cart currency/format — in Settings.
Launch
Going live
Two steps and you're open to the world.
Online Store → Themes. On your theme click … → Publish (only needed if it isn't already live).
Online Store → Preferences, scroll to Password protection and turn it off.
Your website is live.
Handy
Where everything lives
A service's page contentProducts → the service → Metafields
A service's price / photosProducts → the service (top of page)
