Contact concierge

The contact page: an editorial introduction, up to three contact topics, and Shopify’s native contact form on a soft background of line art or your own photograph.

Merchant-addable
No — template section
Settings
21
Block types
1
Max blocks
3
File
sections/contact-concierge.liquid

Used by default on: page.contact

Screenshots pending

Captures for Contact concierge at desktop and mobile widths are generated from a live store by npm run shots. They appear here automatically once that has run.

When to use it

The contact page template. It is available on page templates only.

Setting it up

  1. Under Content, write the Eyebrow, Heading, and Body text. A blank heading uses the page title. Show page content adds the text from the page in Online Store → Pages beneath the body text, and Response promise sets the reply time customers can expect.
  2. Add up to three Contact topic blocks, each with an icon, heading, and short line of text, such as Product guidance, Order care, and Partnerships.
  3. Under Form, set the Form heading and Submit button label. Messages go to the store contact email set in Shopify admin.
  4. Under Background, upload desktop and mobile images, or leave them empty to show the built-in Background artwork. Background veil keeps text readable over an image, and Show frosted form surface with Frosted surface opacity softens the form panel over a photograph.
  5. Color scheme defaults to Scheme 7 (stored as scheme-6) and Form color scheme to scheme-3, with 48px top and 72px bottom padding.

Where the content comes from

Section settings own the copy, background, and form labels. Contact topic blocks own the topics and their order. Shopify owns the contact form and where messages are delivered.

Notes and cautions

  • Keep the response promise to a time your team actually meets.

Section settings

Every setting on the section itself, in the order it appears in the theme editor. Group headings match the editor's own grouping.

Content

EyebrowText
ID
eyebrow
Default
Skin concierge
HeadingRich text (inline)

Uses the page title when left blank.

ID
heading
Default
Let’s make care personal.
Heading sizeDropdown
ID
heading_size
Default
Large
  • Smallsmall
  • Mediummedium
  • Largelarge
Body textRich text
ID
body_text
Default
<p>Share what is on your mind. We are here with thoughtful guidance for your skin, your order, and what comes next.</p>
Show page contentCheckbox

Shows content from Online Store pages beneath the body text.

ID
show_page_content
Default
On
Response promiseText
ID
response_promise
Default
A thoughtful reply within two business days.

Form

Form headingText
ID
form_heading
Default
How can we help?
Submit button labelText
ID
button_label
Default
Send your note

Background

Desktop background imageImage

16:9 aspect ratio recommended. The image focal point controls the crop.

ID
image
Mobile background imageImage

4:5 aspect ratio recommended. Uses the desktop background when left blank.

ID
mobile_image
Shown when
image is set
Background artworkDropdown

Shows built-in line art when you leave the background image empty.

ID
background_artwork
Default
Botanical branch
Shown when
image is empty
  • Nonenone
  • Botanical branchbotanical
  • Leafleaf
  • Mushroomsmushrooms
  • Dropletsdroplets
  • Sun and flowerssun
Background veilSlider

Adds the color scheme background over the image for readable text.

ID
background_overlay
Default
55
Range
0% to 90%, in steps of 5%
Shown when
image is set
Show frosted form surfaceCheckbox

Adds a soft glass effect when you select a background image.

ID
enable_glass
Default
On
Shown when
image is set
Frosted surface opacitySlider

Increase this for stronger contrast over detailed images.

ID
glass_opacity
Default
90
Range
75% to 100%, in steps of 5%
Shown when
image is set and enable_glass

Style

Color schemeColor scheme
ID
color_scheme
Default
scheme-6
Form color schemeColor scheme
ID
form_color_scheme
Default
scheme-3

Spacing

Top paddingSlider
ID
padding_top
Default
48
Range
0px to 120px, in steps of 4px
Bottom paddingSlider
ID
padding_bottom
Default
72
Range
0px to 120px, in steps of 4px

Blocks

Blocks are added, reordered, duplicated, and removed inside the section. Each type has its own settings.

Contact topic pathway

IconDropdown
ID
icon
Default
Ingredients
  • Nonenone
  • Ingredientsformula
  • Benefitsbenefits
  • Suitabilitysuitability
  • Testingtesting
  • Warningswarning
  • Usageusage
  • Sourcingsourcing
TopicText

Also appears as an option in the contact form.

ID
heading
Default
Product guidance
DescriptionText

Keep this concise. Long descriptions use up to two lines.

ID
text
Default
Personalized skincare advice