Contact travel routes, Pattern Paste Canonical: https://patternpaste.com/pattern/contact-travel-routes.html Core Patterns (https://patternpaste.com/patterns/) Contact (https://patternpaste.com/patterns/contact/) Catalogue access Standard # Contact travel routes A getting-here section for an event or venue on an inverted slab: the postcode at display size as the headline, then three ruled routes, each an origin, its journey time as a large figure and three numbered steps, a strip of practical notes on taxis, parking and the ride home, and a maps link. ## All patterns Search patterns Loading patterns… Start here ## What to change first - The postcode and the address line. - The three routes: the origin, the time and the steps. - The taxi number (01632 960 488 is a reserved example number) and the parking and ride-home notes. - The maps link. It searches OpenStreetMap for the postcode; paste your own map link instead if you have a pin for the gate. The signature moment ## The postcode is the headline, and every route ends at it On an inverted slab, the postcode at display size, then three ruled columns, each an origin as a label (From London, By car, From the airport), its journey time as a large figure and three numbered steps. A strip of practical notes follows (taxis, overnight parking, the ride home) and one maps link. On a phone the routes stack and each figure is about 40px. Theme handoff ## What comes from where ### From your theme - Typeface. - Palette. - Buttons. ### Set by this pattern - The postcode. - The routes. 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 getting-here section for a place guests travel to once: a wedding, a retreat, a venue in the country. The postcode is what everyone types into a car or a taxi app, so it is the headline, and each route below is timed from where people start. It sits in the contact section beside cta-call-now (the phone number is the headline, a closing ask), contact-getting-here (an address card on the room) and service-areas-columns (towns served). ### The signature moment: the postcode is the headline, and every route ends at it On an inverted slab, the postcode at display size, then three ruled columns, each an origin as a label (From London, By car, From the airport), its journey time as a large figure and three numbered steps. A strip of practical notes follows (taxis, overnight parking, the ride home) and one maps link. On a phone the routes stack and each figure is about 40px. Make it yoursVariations and the edits to make first ### What to change first - The postcode and the address line. - The three routes: the origin, the time and the steps. - The taxi number (01632 960 488 is a reserved example number) and the parking and ride-home notes. - The maps link. It searches OpenStreetMap for the postcode; paste your own map link instead if you have a pin for the gate. Theme behaviourInheritance, fixed decisions and contrast ### What it inherits from your theme - Typeface. The base states no font family. - Palette. An inversion: your contrast ground with base text, labels and rules, so it reads as a slab in any theme. - Buttons. One underlined text link in the text colour. ### What it decides for itself - The postcode. A display size off the ladder, about 72px on a phone and 11rem from 1280 up. It has no spaces to wrap on beyond the one in the middle, so keep it a postcode or a short place name. - The routes. A grid of 20rem minimum columns: three across on a wide screen, two on a tablet, one on a phone. Technical notesBlock mechanics, responsive behaviour and constraints ### The Vow look Part of the Vow Pattern Set, a couple's whole wedding website in one design language: wisteria white ground #f7f5fb, a wisteria band #ebe6f3, card white #ffffff and a midnight slab #1f2240; midnight ink, dusk #555a78 for secondary copy, peony #a8365a labels on light grounds and pale peony #f2b8c9 on the slab, wisteria hairlines #d9d3e6. Headings and names are Didot at 400 (Bodoni MT, Hoefler Text, Baskerville, Times New Roman, serif), body, labels and buttons Gill Sans (Seravek, Trebuchet MS, sans-serif). Cards and buttons are square; the primary button is a filled midnight rectangle, the secondary an underlined peony link. Every text pair is measured on the ground it is painted on. Take the base for your theme's colours, or the look's Use my theme chip. ### Notes - Core blocks only: group, heading, paragraph, list, buttons, button. No plugin, nothing to keep updated. Questions ## Contact travel routes: common questions Does Contact travel routes need a plugin? No. It is built only from core WordPress blocks (button, buttons, group, heading, list, list-item and paragraph), so it pastes into the block editor with nothing to install. Will Contact travel routes match my theme? Choose by variation. Postcode and routes takes your theme’s palette; Vow brings its own colours. How many variations does Contact travel routes have? 2: Postcode and routes and Vow. Each is its own markup; choose one in the toolbar above the preview before you copy. Is Contact travel routes free? It is included with a subscription, with every Core Pattern and variation. 62 Core Patterns are free to copy without one. Which WordPress version does it need? Requires a block theme on WordPress 7.0. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type. 16KB of core-block markup, 7 blocks (button, buttons, group, heading, list, list-item, paragraph), and nothing else: paste it into the block editor and it becomes editable blocks wearing your theme. Subscribe to copy it, £119 a year (https://patternpaste.com/account/#plan) What you copy is yours forever. Not for you? We refund within 14 days. Back to Core Patterns (https://patternpaste.com/patterns/) Catalogue access ### £119 a year All patterns, variations and theme downloads. What you copy is yours forever. Not for you? We refund within 14 days. Subscribe, £119 a year (https://patternpaste.com/account/#plan) Sign in (https://patternpaste.com/account/) Everything you copy is yours to keep, forever, on any site; access to the rest of the library runs while you subscribe. Not for you? Tell us within 14 days of a payment and we refund you. After that, cancelling stops the next renewal and access runs to the end of the year you have paid for. Prices are in pounds and are the full price in the UK, the US and eleven other countries; elsewhere the checkout adds your local VAT or sales tax. The terms name every country. #### Pair with FAQ Emergency triage list An emergency page section for a trade: a header with a legend of three verdict tags, then seven ruled rows sorted by urgency, each the problem as a card title, what to do now, and a verdict tag at the right: ring now, book it, or ring the gas line first. States no colour and no font of its own. (https://patternpaste.com/pattern/emergency-triage-list.html)Footer Composed signoff Three still slogan rows above a studio footer with contact, navigation and legal details. (https://patternpaste.com/pattern/footer-composed-signoff.html)Hero Hero aperture An opening section on your theme's own paper: a tracked line, a display headline, one short paragraph on a reading measure, and then a picture that stops short of the edge on every side. The signature is the margin: the image is a window cut in the page rather than a band across it, and the paper around it is what you notice. A small opaque plate in the picture's bottom-right corner carries the caption, so no type ever sits on the photograph. The still-image version includes an example photograph; select your own clip for the video version. States no colour and no font of its own. (https://patternpaste.com/pattern/hero-aperture.html) #### Before you paste Requires a block theme on WordPress 7.0. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type. How we test patterns (https://patternpaste.com/how-we-test/) ## Specifications Section Contact Access Subscription Plugin None, core blocks only Variations 2 Colour From your theme or its own palette Type From your theme or its own type Motion None Blocks button, buttons, group, heading, list, list-item, paragraph Presets color 4, spacing 1, font-size 1 WordPress 7.0+ Continue exploring ## Next in Contact Explore all 10 Contact patterns (https://patternpaste.com/patterns/contact/) Shot in Twenty Twenty-Five Contact No plugin needed ### Contact split A contact section with no form in it: the left sixty per cent is almost empty, holding a tracked label, one display invitation and a single action, and the right forty per cent is packed, three stacked groups of address, hours and direct lines hanging off one vertical hairline. Contact Preview pattern (https://patternpaste.com/pattern/contact-split.html) Shot in Twenty Twenty-Five Contact No plugin needed ### Hours week table Opening hours as a timetable. Contact Preview pattern (https://patternpaste.com/pattern/hours-week-table.html) Shot in Twenty Twenty-Five Contact No plugin needed ### Service area postcodes A where-we-come section for a local trade: a short reading column beside a grid of 24 postcode tiles, each a district in bold figures over its town. Contact Preview pattern (https://patternpaste.com/pattern/service-area-postcodes.html)