Pattern Paste
Subscribe

Core Patterns Contact

Catalogue accessStandard

Contact offices

Four equal office bays hang from one continuous currentColor hairline, each opened by a replaceable WordPress photograph above its city, time zone, address, hours and direct lines.

The grid reflows into pairs on a tablet and a single column on a phone. A closing rule holds the shared delivery note.

All patterns

Loading patterns…

Theme
Preview size
Look

Takes your theme’s colours and type.

Twenty Twenty-Five·1280px

Manrope typefacergb(255, 255, 255) ground1280px viewport

Start here

What to change first

  1. Replace each sample photo with its office or neighbourhood. Use the Image block's Replace control and update the descriptive alternative text.
  2. Edit the city, time zone, address, hours and direct lines in each bay.
  3. Duplicate or delete a bay as needed. The base grid fits the available space; the paired variation uses columns that can be edited in List View.
  4. Link email addresses with mailto: and telephone numbers with tel: if they should be tappable. Edit or remove the shared delivery note.

The signature moment

The same shape, four times, under one unbroken rule

Every bay has the same image crop and content order. Adjacent top borders meet because the grid has no horizontal gap; padding inside each bay separates the pictures and facts. One closing rule holds the shared delivery note. No office gets greater weight than another.

Theme handoff

What comes from where

From your theme

Typeface, heading sizes, base and contrast colours, and vertical spacing presets. Rules use currentColor. Heading sizes have clamp fallbacks; the narrow address and contact lines keep their own reading-size clamp.

Set by this pattern

The full-width band has a 1240px inner measure. A grid with 16rem minimum tracks keeps four offices across when they fit, pairs at tablet widths, and a single column on a phone. Each bay keeps its own top border when the grid reflows. Horizontal padding is fluid. The photo fills the bay's content width at 4:3, with cover cropping and a consistent gap before the city name.

Full pattern notes

Why it works, and how it is built

Open a topic for the complete design reasoning, editing guidance and implementation notes.

Design rationaleComposition, intent and nearest alternatives

Overview

A photographic office directory. Matching 4:3 frames open four equal bays, followed by each city's time zone, address, hours and direct contact details. The photos are included examples, ready to replace with the buyer's own rooms.

The signature moment: the same shape, four times, under one unbroken rule

Every bay has the same image crop and content order. Adjacent top borders meet because the grid has no horizontal gap; padding inside each bay separates the pictures and facts. One closing rule holds the shared delivery note. No office gets greater weight than another.

Make it yoursVariations and the edits to make first

The variation

Offices in pairs gives the same four images and offices two rows of two, with larger city names. Its core columns stack below 782px. The photos remain 4:3, so the bigger frames give each office more presence.

Forest and apricot keeps the four bays on warm paper, with forest text, apricot details and Georgia city names.

What to change first

  1. Replace each sample photo with its office or neighbourhood. Use the Image block's Replace control and update the descriptive alternative text.
  2. Edit the city, time zone, address, hours and direct lines in each bay.
  3. Duplicate or delete a bay as needed. The base grid fits the available space; the paired variation uses columns that can be edited in List View.
  4. Link email addresses with mailto: and telephone numbers with tel: if they should be tappable. Edit or remove the shared delivery note.
Theme behaviourInheritance, fixed decisions and contrast

What it inherits from your theme

Typeface, heading sizes, base and contrast colours, and vertical spacing presets. Rules use currentColor. Heading sizes have clamp fallbacks; the narrow address and contact lines keep their own reading-size clamp.

What it decides for itself

The full-width band has a 1240px inner measure. A grid with 16rem minimum tracks keeps four offices across when they fit, pairs at tablet widths, and a single column on a phone. Each bay keeps its own top border when the grid reflows. Horizontal padding is fluid. The photo fills the bay's content width at 4:3, with cover cropping and a consistent gap before the city name.

Contrast and display type

Headings qualify as large text at 3:1; address lines, contact details and labels are held to 4.5:1. Colour chains end in WordPress's guaranteed base colours. Address and contact lines use clamp(0.9375rem, 1vw, 1rem) so compact office bays remain readable without the theme's medium size overwhelming the measure.

Technical notesBlock mechanics, responsive behaviour and constraints

Included images and core blocks

The photographs come from the reviewed WordPress collection in assets/wordpress-images.json. Their public HTTPS URLs travel in the copied Image blocks without source attachment IDs. The preview and pasted section use the same photos. These are illustrative workspace details, not photographs of the fictional addresses in the sample copy.

Core group, image, heading and paragraph blocks make the base. The paired variation also uses columns and a spacer. No plugin, custom CSS or JavaScript. Text sits on the theme's ground, never on the photos.

Questions

Contact offices: common questions

Does Contact offices need a plugin?

No. It is built only from core WordPress blocks (group, heading, image and paragraph), so it pastes into the block editor with nothing to install.

Will Contact offices match my theme?

Choose by variation. Offices and Offices in pairs take your theme’s palette; Forest and apricot brings its own colours.

How many variations does Contact offices have?

3: Offices, Forest and apricot and Offices in pairs. Each is its own markup; choose one in the toolbar above the preview before you copy.

Can I use my own images?

Yes. Sample images stay in the copied blocks. Replace them in WordPress; pasting does not upload them to your Media Library.

Is Contact offices free?

It is included with a subscription, with every Core Pattern and variation. 62 Core Patterns are free to copy without one.

The markup

16KB of core-block markup, 4 blocks (group, heading, image, paragraph), and nothing else: paste it into the block editor and it becomes editable blocks wearing your theme.

Subscribe to copy it, £49 a yearWhat you copy is yours forever. Not for you? We refund within 14 days.

Back to Core Patterns