Coready Studio

Resume

A document, not a shop: your name and photo, then sections in two columns — lists, tags, dates. Black on white, and it prints on one sheet.

PortfolioLanding pageSuggested colours: MonochromeIts own header and footer

Header and footer

On every page of a website using Resume, around the components below.

Content

Hero

A centred headline over a soft panel, with a call to action.

hero
You can change:Image / logoEyebrowTitleSubtitlePrimary buttonSecondary buttonImage positionBackground

Hero split

A headline and call to action beside a large image.

hero-split
You can change:Image / logoEyebrowTitleSubtitlePrimary buttonSecondary buttonImage positionBackground

Slideshow

Photos that take turns, each with a headline and a line under it, and one pair of buttons.

slideshow
You can change:SlidesPrimary buttonSecond buttonSeconds per slideHeightWidthHeading level

Cover

A title and a line over a photo — a page's header, or a call to action with buttons.

cover
You can change:PhotoTitleTextPhone buttonPrimary buttonSecond buttonTint over the photoHeightWidthHeading level

Page cards

Cards for pages of your website — services, rooms, courses — each with its picture, name and a line about it.

page-cards
You can change:HeadingDescriptionPagesColumnsShow descriptionsLink on each cardButton under the cardsHeading level

Intro

A large heading, a short paragraph and a row of text links — no panel, no image.

intro
You can change:EyebrowHeadingTextLinksHeading level

Document

Show a PDF inline, with a download link.

file-embed
You can change:TitleFileViewer heightDownload link

Card grid

A heading + a responsive grid of cards (features, categories, steps, reviews…).

card-grid
You can change:HeadingDescriptionColumnsCardsCard images

Navigation

Page menu

A boxed list of links to your pages, with the page being read marked — for a sidebar.

page-menu
You can change:HeadingSame pages asPagesStay in view while scrolling

Breadcrumbs

The trail back to the home page. Works out where it is unless you tell it.

breadcrumbs
You can change:This page's nameStart from the home pageHome labelTrail

Commerce

Product grid

A grid of products from a product list, category, or manual selection.

product-grid
Loads its products in the browser, so it fills in a moment after the page appears.
You can change:HeadingProductsMax products

Catalog

Category list

Catalog navigation — the category tree or a flat list of top-level categories.

category-list
You can change:HeadingDisplay

Product listing

Products of the selected category, with sorting, view switch, and paging.

product-listing
You can change:EyebrowHeadingDescriptionGrid columnsPagingShow sort controlShow view switcherShow status lineShow inside a panelHeading level

Product

Product price

The price for the chosen quantity, options and variant.

product-price
You can change:Show unit priceShow the chosen variant

Quantity and buy button

The quantity stepper, the add-to-cart button and the minimum-order notices.

product-purchase
You can change:Show quantity stepperShow minimum-order noticeButton text

Price calculator

Options, quantity with its price breaks, the total and the buy button, in one panel.

product-calculator
You can change:HeadingShow headingShow price breaksChoose the first value of required optionsNote under the totalButton textStay in view while scrollingKeep the total in view on phones

Price table

Every quantity price of the product's options in one table, with the shopper's current choice highlighted. For reading, not choosing — place it beside a calculator or the options.

product-price-table
You can change:HeadingShow heading and caption

Size grid

The size × height grid, for products that have one.

product-variant-matrix
Shown empty here: no product in the shop this page renders against has a size × height grid. On a catalogue that does — workwear, footwear, print sizes — this draws the grid with a quantity box in every cell.
You can change:Heading

Contact

Contact details

Phones, emails, addresses, opening hours and socials, as cards.

contact-details
You can change:HeadingShow phonesShow emailsShow addressesShow opening hoursShow social linksPhones labelEmails labelAddresses labelOpening hours labelSocials label

Enquiry

An invitation to get in touch, with email, phone and catalog buttons.

contact-enquiry
You can change:HeadingDescriptionSecond paragraphShow email buttonEmail button textShow phone buttonPhone button textShow catalog buttonCatalog button textCatalog button link

Map

An embedded map. Uses the website's Google Maps link unless you give another.

contact-map
You can change:HeadingMap linkHeight

Blog

Blog

The article list for one of your blogs, with an optional category sidebar.

blog-index
You can change:Which blogHeadingEyebrowDescriptionShow category sidebarHeading levelMax articles

Blog list

Articles as a quiet list: date, title and a line of excerpt, divided by hairlines.

blog-list
You can change:Which blogHeadingHeading levelShow datesShow excerptsShow topicsMax articlesLink under the list

Profile

Profile header

Who this is: a label, your name or headline, one line under it, a square photo and a closing line.

profile-header
You can change:LabelName or headlineLine under itPhotoClosing lineShow today's dateHeading level

List

A heading and a list — as lines, short paragraphs or tags. Rows with a link become links.

item-list
You can change:HeadingItemsShow asFrame it

Details

A heading and label–value pairs: languages and levels, dates and roles, favourites.

details
You can change:HeadingRowsWrite each row as

Full-page presets

Whole pages, ready made. Each replaces the blocks you would otherwise arrange yourself — drop one on a page and you have the catalogue, the contact page or the product page the theme ships with.

Catalog

The whole catalog: categories, products, sorting and paging.

catalog
You can change:Products per page

Contact page

Contact details, opening hours, map and enquiry form in one block.

contact

Nothing to set up — it renders your own catalogue and contact details.

Theme home page

The theme's own landing page, as a single block.

home

Nothing to set up — it renders your own catalogue and contact details.

Theme product page

The theme's own product page: gallery, summary, options and buy button.

product-page

Nothing to set up — it renders your own catalogue and contact details.