How-tos

Short answers to the questions that come up most while you build this site.

Start here

This page is about how to do things in this theme. Everything on the site is built from the theme’s own patterns — ready-made chunks of page you drop in and type over — so the section on patterns below is the one worth reading properly. Nothing you do is permanent: every page keeps a full history under Revisions, and the Site Editor can reset anything you customise.

Posts or pages?

Pages are the fixed parts of the site — Home, Our work, the four media pages, Contact. They sit in the menu, they have no date and no category, and you edit them when something changes.

Posts are dated entries that stack up. On this site that means the written stories. Each post gets a featured image and the Written stories category, and the Written stories page builds its own grid from them — publish another post in that category and it appears there on its own. You never add a post to the menu.

A permanent section of the site → page
A story, a reflection, anything dated → post
Something that belongs in the menu → page
Something that should appear in a list automatically → post, with the right category

For more on the difference, see Understanding the difference between posts and pages on Learn WordPress.

Putting a pattern on a page

A pattern is a ready-made chunk of page — a banner, a bio row, a gallery, a set of cards. This theme ships 88 of them, already styled to match. Building a page mostly means stacking patterns and typing over them; you rarely start from a blank block.

Open the page: Pages in the sidebar, then click its name. (If you are looking at the page on the site, Edit Page in the top black bar is faster.)
Click where the new section should go, so the cursor sits between two existing blocks.
Click the blue + at the top left, then choose the Patterns tab.
Pick a category down the left: Portfolio Banners, Recent Project Showcase, Gallery, Contact, Text, List, Posts, Header, Footer — or Pages for whole pre-built pages.
Click a pattern to drop it in. It arrives with placeholder text and images.
Type over the text. Click each image and use Replace to swap in your own.
Use Preview → Preview in new tab and check it on the real site.
Click Update.

Patterns arrive as ordinary blocks, not linked copies — edit one as much as you like and nothing else on the site changes.

For more on patterns in general, see Using block patterns on Learn WordPress.

Which pattern should I use?

Top of a page → Background Image and textbox or Large Banner Image and text (Portfolio Banners)
A whole page to start from → About me, Scenic, Front page gallery or Simple Resume (Pages)
A photo beside a paragraph → Heading and paragraph with image on the right (Text)
A person → Small portrait and text, Portrait and Text or Name and Circle Portrait with links (Portfolio Banners)
A grid of linked items → List with Heading, 4 items and descriptions (Text)
Photographs → Gallery with columns and heading, Gallery with 3 tall images, Gallery with instagram inspired squares (Gallery)
Contact details → Get in touch, Contact Me or Contact (Contact)
A list of posts → List of posts, 1 column or More posts (Posts)

Three things that trip everyone up

Use the Page No Title template on any page that starts with its own banner. By default a page prints its title above the content, so a page with a banner ends up saying its name twice. In the page sidebar, under Page → Template, choose Page No Title. Every page on this site does that.

The Contact Me pattern arrives unreadable. A few patterns carry styling classes (is-style-section-3, -4, -5) that this build of the theme no longer registers, so they do nothing. Where a pattern was relying on one for light text you get dark text on a dark background. The fix takes seconds: select the outer Group block and set Styles → Colour → Text yourself. The Contact page shows it done.

Photos in banners are backgrounds, not image blocks. In the banner patterns the picture belongs to a Cover block. Select the Cover — the List View icon at the top left makes this much easier — and use Replace in its toolbar. If you cannot find the image anywhere, you have the wrong block selected.

Working in the Site Editor

This is a block theme, which means the header, footer, colours, fonts and menu are all edited in one place: Appearance → Editor. Everything there is site-wide — change it once and it changes on every page. Use the ordinary page editor when you only want to change one page.

Styles — the whole site’s colours and type

Open Styles (the half-filled circle). The theme ships eleven colour variations — TRU, Evening, Noon, Dusk, Afternoon, Twilight, Morning, Sunrise, Red Afternoon, Red Dusk, Vibrant — and a set of typography presets. Clicking one restyles the entire site instantly, and you can click back. Try these before you start recolouring individual blocks; nine times out of ten a variation gets you closer than hand-editing will.

Templates — the layout behind each kind of page

Under Templates you will find 404, All Archives, Blog Home, Index, Page No Title, Pages, Search Results and Single Posts. A template controls every page of that kind, so editing Single Posts changes all your posts at once. To use a different template on one page, do not edit the template — change Page → Template in the page sidebar instead.

Template parts — the header and footer

Patterns → Template Parts holds the Header, the Footer and a Sidebar. These appear on every page. The footer on this site has been customised; if you make a mess of one, open it and choose ⋮ → Clear customizations to put the theme’s original back.

The menu — it is a block, not a settings screen

There is no Appearance → Menus in a block theme. The menu is a Navigation block inside the header. Open Appearance → Editor → Navigation, or click the menu in the header while editing, then use + to add a page, a custom link or a submenu. Drag items to reorder them; the arrow beside an item opens its settings. Custom links can point at a spot on a page — /#team jumps to the team section on the front page.

For more, see Setting up your pages, posts, site logo and navigation menu on Learn WordPress.

Everyday editing

Editing text, links and buttons

Click into any text and type. To make a link, select the words and press ⌘K (Ctrl+K on Windows), then paste an address or search for one of your own pages. Write internal links as paths — /contact/ rather than the full web address — so they keep working if the site is copied.

For more, see Creating posts and pages with the WordPress block editor on Learn WordPress.

Replacing an image

A picture lives in one of three places. An Image block: click it, then Replace in the toolbar. A Cover block (most banners): select the Cover, then Replace. A featured image on a post: the sidebar, under Post → Featured image. Whichever it is, fill in the Alt text field with a sentence describing the photo.

For more, see Using the Media Library on Learn WordPress.

Adding a new page

Pages → Add New. Give it a title and a short slug in the sidebar (field-notes, not Field Notes Page 2). Set Page → Template → Page No Title if you are starting with your own banner. Publish, then add it to the menu in the Site Editor.

For more, see Nesting and using blocks on Learn WordPress.

Adding media

Video — embed it, don’t upload it

Put the film on TRU MediaSpace (media.tru.ca), open it there, and use Share → oEmbed. Copy the short link (media.tru.ca/id/0_xxxxxxxx…), add an Embed block here and paste it. WordPress recognises TRU MediaSpace and builds the player. Use the oEmbed link, not the long address in your browser bar — that one comes out as a plain link. The Video stories page shows this, the Embed-code alternative, and a YouTube example.

For more, see Embedding media and third-party content on Learn WordPress.

Audio and transcripts

Add an Audio block, upload an MP3 or M4A, and write a caption. Then add a Details block underneath, set its summary to “Read the transcript”, and paste the transcript inside — exactly like the collapsible sections on this page. The Audio stories page is the worked example. A transcript is how a deaf or hard-of-hearing audience gets your story, and it makes your work searchable.

Photo galleries

Use a Gallery block, or start from one of the theme’s gallery patterns and swap the pictures. Keep the images in one gallery similar in shape — mixing tall and wide photographs makes the grid ragged. The Photo gallery page uses two different patterns so you can see the difference.

Files that will not upload

This site does not accept .webp files — export JPEG or PNG instead. Keep photographs under about 2000 pixels wide and run them through an optimiser before uploading; a photo straight off a camera can be several megabytes and makes the page slow for everyone. Video should not be uploaded at all — embed it.

Before you publish

Accessibility. Alt text on every image, one sentence describing what is in it. A transcript under every recording and captions on every video. Headings in order: one H1 per page (usually the banner title), then H2 for sections and H3 beneath them — never pick a heading level because you like the size. Link text that makes sense on its own: “read our flood coverage”, not “click here”. Check text over photographs actually contrasts with what is behind it.

For more on heading order, see How to use headings for accessibility and SEO on Learn WordPress.

Writing. Front-load the point of each section; people scan before they read. Keep paragraphs short. Write headings in the page’s own words so they work as signposts.

Consistency. Reuse the same banner pattern across your inside pages rather than a different one each time — that is most of what makes a set of pages feel designed. Check every page at tablet and phone width before you call it done.

More help

Learn WordPress is the WordPress community’s own free training site. Because this is a block theme, the Site Editor lessons apply here directly:

The theme itself is Red Dragon Portfolio, a student-designed theme from Reclaim Hosting.

Credits and reuse. Written for this template and shared under a Creative Commons Attribution-NonCommercial 4.0 licence — reuse or adapt it for another course, with credit, for non-commercial purposes. The lessons linked above are published by the WordPress community at learn.wordpress.org and remain under their own terms; nothing on this page is copied from them.