Ariade for Shopify documentation

Ariade is an accessible Shopify theme built to WCAG 2.2 AA. This guide explains how to set up every part of the theme in the Shopify theme editor. It is written for store owners; no coding is needed.

Before you start: duplicate your theme. In Shopify admin go to Online Store > Themes, open the menu (…) next to Ariade and choose Duplicate. Make changes on the copy, preview them, then publish. If something goes wrong you can switch back in one click.

1. Install and first steps

  1. Add Ariade from the Shopify Theme Store: Online Store > Themes > Add theme.
  2. Duplicate it (see above) and click Customize on the copy.
  3. Upload your logo in Theme settings > Logo and favicon. Also upload a white or light logo for the dark footer in the Footer section.
  4. Enter your phone, email and opening hours in Theme settings > Contact. They appear in the top bar, the footer and the cart, so customers can always reach a person.
  5. Create the menus the theme uses (Content > Menus): main-menu (header), footer (footer columns), and optionally shop-by-need, used to order the "Helps with" tags.
  6. Create these pages (Online Store > Pages) and pick the matching template in the page's Theme template box: Contact (contact), Accessibility statement (accessibility), Wishlist (wishlist), Store locator (stores), About (about) and My account (account).
  7. In Theme settings > Accessibility, link your contact page, sign language page and accessibility statement.

2. Theme settings

Open Customize > Theme settings (the gear icon).

Logo and favicon
Logo, logo width and the small browser-tab icon.
Colors
Six colors in pairs: page background, text and links; card background; button background and button text. The defaults pass WCAG 2.2 AA. While you edit, a warning appears in the preview if any pair falls below AA (4.5 to 1 for text, 3 to 1 for button and field outlines). Only you see this warning, never your customers. Fix every warning before you publish.
Typography
Heading and body fonts from Shopify's font library. Choose fonts with clear letter shapes; avoid thin or decorative fonts for body text.
Contact
Phone, email and opening hours, plus links to your contact and sign language call pages.
Accessibility
Shows or hides the Accessibility settings button (AA) in the header. Customers can turn on larger text, a dyslexia-friendly font, reduced motion, high contrast and paused videos. Choices are saved on their device. Also links your accessibility statement.
Product cards
Show star ratings, "Helps with" tags and the quick Add to cart button on product cards.
Cart
Cart drawer or cart page, the free shipping goal shown as a progress bar, and order notes.
Journal
Blog tags to treat as categories (Shopify blogs have no categories). They are shown first and highlighted on cards and articles.
Social media
Links for Facebook, Instagram, YouTube, TikTok, X, Pinterest, Threads, LinkedIn and WhatsApp. Leave a field empty to hide that icon.

3. Sections

Add sections with Add section in the editor. Every section is keyboard accessible and announces changes to screen readers; you only need to fill in the content.

Sections in Ariade and how to set them up
SectionHow to set it up
Top barShort message, optional sale end date (a fixed "ends in" time, never a ticking countdown), and Call, Email and Sign language links from Theme settings.
HeaderChoose the main menu. Items with sub-items open accessible drop-down menus. Search, accessibility settings, wishlist, account and cart are built in.
Hero with videoHeading, text, two buttons and an image or a short muted video. The video has a visible Pause button and never plays when customers ask for reduced motion.
Benefits stripUp to four short promises with icons, for example free shipping or 30-day returns.
Collection tilesChoose collections, for example by need (See better, Hear better). Each tile shows an image and a short description.
Featured productsChoose a collection and how many products to show.
Featured productChoose one product. Blocks: kicker, title, price, description, variant picker, buy buttons, link to the product page, and app blocks.
Collection guideHelps customers choose inside a collection, with tiles that link to searches or collections.
Image with textImage, heading, text and button. Always write a description for the image.
Image with stepsAn image with numbered steps, for example how you test products.
TestimonialsCustomer quotes with name and detail.
Rich textHeading, text and button, left or center aligned.
Call to action panelA highlighted panel with heading, text and up to two buttons.
Help rowsRows of help topics with icons and links, for the contact and help pages.
NewsletterEmail sign-up with a clear label and a success message.
Events teaser, Upcoming eventsShow upcoming workshops and webinars from your Events blog.
Related articlesLatest or related posts from a blog.
About header, About story, Promises, Steps, About in numbersSections for an About page: story, values, process and key figures.
Store locatorStores as blocks with address, time zone and opening hours.
Product reviews, Questions and answersOn product pages. Reviews come from the Customer review entries (see Built-in features); questions are blocks you write.
Product recommendations, Recently viewedRelated and complementary products from Shopify, and the customer's recently viewed products.
Theme showcaseOptional demo section that presents theme features. Remove it from your home page if you do not need it.
Custom LiquidPaste app snippets or other Liquid code. Give any embedded iframe a title and keep headings in order.
AppsA place for app blocks on any page.
FooterHelp panel with photo and buttons, newsletter, menu columns, payment icons, white footer logo, social icons, and the Follow on Shop button (shown when Shop Pay is on).

4. Page templates

Product
Blocks you can reorder: breadcrumbs, "Helps with" tags, title, vendor and SKU, rating, price with savings, tax note with Shop Pay Installments, variant picker (color swatches and option pills), stock and pickup, buy buttons, trust list, description and accordions, and app blocks. Below it: reviews, questions and answers, recommendations and recently viewed products.
Collection
Filters and sorting come from Shopify's free Search & Discovery app (by Shopify). On phones filters open in an accessible dialog.
Search
Tabs for All, Products, Guides and Pages, with the same filters on the Products tab, and suggestions when nothing is found.
Cart
Quantity steppers, Save for later, order note, "Make it easier to use" delivery options, free shipping progress and unit prices.
Blog, article and events
Reading time, table of contents, Listen, Print and Share, categories and tags, and accessible comment forms. Use a blog named Events with the events template for workshops and webinars.
Contact, About, Accessibility statement, Store locator, Wishlist, My account, 404, Password, Gift card
Each has its own template and editable sections. The Accessibility statement template includes a known-limits table and a "Tell us about a barrier" form.

5. Built-in features (no apps needed)

"Helps with" filter

Create a product metafield custom.helps_with (list of single line text) and add values such as Low vision or Arthritis. Then add it as a filter in Search & Discovery.

Product reviews

Reviews are entries of the Customer review type in Content > Metaobjects (name, rating, title, review, date, verified buyer, helped with). Link them to a product in its Reviews field. Set the product's standard Rating and Rating count fields so stars appear on product cards. Review apps can still add their own blocks to the Reviews section.

Wishlist

Customers save products with the heart button. The Wishlist page shows the date added, price drops since saving, and a Share list link. Lists are kept on the customer's device.

Email me when it is back

Sold-out products show a form that sends the request to your contact form inbox with the product name and link. Add a product metafield custom.restock_date (date) to show "Back in stock around [date]".

My account page

With Shopify's customer accounts, create a page using the account template and add it as the first item of the menu customer-account-main-menu. Signed-in customers see their orders, order details, addresses and access settings in your theme's design. Sign-in and editing of the profile and addresses stay on Shopify's secure pages, which use your colors and fonts from Settings > Checkout > Customize.

Store locator

Add stores as blocks with address, time zone and opening hours. "Open now" and "Opens tomorrow" are worked out in each store's own time zone.

6. Keeping your store accessible

Ariade handles structure, keyboard use and contrast. Your content matters too:

  • Image descriptions: write alt text for every product and section image (Products > image > Add alt text). Describe what matters for a shopper. Leave it empty only for purely decorative images.
  • Headings: use headings in order in product descriptions and pages (Heading 2, then Heading 3). Do not use bold text instead of headings.
  • Link text: write links that make sense on their own, such as "Read the size guide", not "click here".
  • Videos: add captions, and an audio description or transcript for videos that show important information.
  • Colors: fix every warning the theme editor shows before you publish.
  • Accessibility statement: keep your statement page up to date, including known limits and other ways to order.

7. Frequently asked questions

Is Ariade really WCAG 2.2 AA compliant?

The theme code is built and tested to WCAG 2.2 AA with automated tools (axe, WAVE, Lighthouse), keyboard-only use, screen readers and 400% zoom. Your store as a whole also depends on your content (images, videos, apps) and on pages hosted by Shopify such as checkout. See Keeping your store accessible.

Do I need apps for reviews, wishlist or filters?

No. Reviews, wishlist and back-in-stock requests are built in. Filters use Search & Discovery, a free app made by Shopify.

Why can't the theme change the look of the sign-in and checkout pages?

Shopify hosts these pages for security. The theme brands them with your colors, fonts and logo through Shopify's checkout settings, but their layout is set by Shopify.

Can I change the colors?

Yes, in Theme settings > Colors. The editor warns you if a color pair falls below the contrast customers need.

Does it work in other languages?

Yes. All theme text is translatable, and English and French are included. Add languages in Settings > Languages and translate with Shopify's Translate & Adapt app.

How do I update the theme?

When a new version is released, Shopify shows an update notice in Online Store > Themes. Updating adds a new copy with your settings; check it, then publish.

Can I edit the code?

You can, but changes to code are not covered by support and may affect accessibility. Always work on a duplicate.

8. Support policy

  • How to reach us: use the Ariade support form. Include your store URL and a description of the problem. To send screenshots, reply to the confirmation email you receive.
  • Response time: we reply within 2 working days. Support hours are Monday to Saturday, 9 am to 9 pm India Standard Time (IST, UTC+5:30).
  • What is covered: help with theme settings and sections, bugs in the theme's own code, and accessibility questions about the theme.
  • Not covered: custom code changes, problems caused by edited theme code, third-party apps, and pages hosted by Shopify (checkout, sign-in, accounts).
  • Accessibility issues: a WCAG failure in the theme's own code is treated as a bug and fixed in a free update.
  • Updates: bug fixes and Shopify platform updates are free for the life of the theme.

9. Release notes

Version 0.2.0 (October 2026)

  • All page templates, including a designed My account page for Shopify customer accounts.
  • Built-in reviews, wishlist and back-in-stock requests.
  • Color settings with a contrast check in the theme editor.
  • Custom Liquid and Featured product sections, Follow on Shop, filters on search, unit prices in the cart.