=== Ariade === Contributors: anblik Author: Shivaji Mitra Company: M/S. Anblik Requires at least: 6.6 Tested up to: 7.1 Requires PHP: 7.4 Stable tag: 1.7.96 License: GPLv2 or later License URI: https://www.gnu.org/licenses/gpl-2.0.html Ariade - a WCAG 2.2 AA Full Site Editing (FSE) WordPress block theme for accessible professional-services and business websites. == Description == Live demo: https://showcase.ananyoo.com/ Ariade ships accessible header navigation, predesigned, conformant page patterns, and an accessible footer toolkit: a newsletter band, theme-styled social links (a core Social Icons block turned into brand-magenta discs that match the footer contact icons, keyboard/focus friendly, no icon font) and W3C / accessibility verification badges laid out on one clean line - plus a ready-made "Footer: Connect" pattern that drops the whole Connect column in. The free Ariade Header and Menu plugin adds the theme's simple accessible drop-down menu header (keyboard operable, disclosure pattern, ARIA, Escape-to-close, mobile drawer), and the Ananyoo accessibility plugins add a screen-reader-tested carousel, forms and login. Built by M/S. Anblik (https://ananyoo.com). == Accessibility == Ariade targets WCAG 2.2 Level AA and carries the accessibility-ready tag. It is built with semantic HTML, named landmarks (a "Primary" navigation and a "Pagination" navigation), a skip link, keyboard-operable components (header navigation, mobile menu, FAQ accordions), a visible two-tone focus indicator on every control (inverted on dark backgrounds), contrast-checked text and form-field borders, underlined links in content, named pagination links ("Page 2", "Page 3, current page"), screen-reader status messages on the search results and no-results pages, focus management around the comment form (Reply, Cancel reply, after posting), and screen-reader text wherever a visual-only cue is used (ratings, icons, plan buttons). Images used purely for decoration carry an empty alt. The theme does not open links in new windows and does not use autoplaying media or animation beyond reduced-motion-safe transitions. The theme was audited manually against the WordPress accessibility-ready requirements and WCAG 2.2 AA (NVDA, JAWS, keyboard, 200 and 400 percent zoom, text spacing, colour contrast) on a WordPress Theme Unit Test install, and every theme finding was fixed before this version. The Sitemap page is built from core blocks (Page List, Categories and recent posts) with an ordered H1 > H2 heading structure and list semantics. A richer auto-populated Sitemap block is available in the Ariade Header and Menu plugin. Automated tools cover only part of WCAG, so manual keyboard and screen-reader testing (NVDA, JAWS, VoiceOver) on a production install is still recommended. == Installation == 1. Upload the ariade folder to /wp-content/themes/ (or install the .zip via Appearance > Themes > Add New > Upload Theme). 2. Activate through Appearance > Themes. 3. Set a static front page (Settings > Reading > "A static page") to use the Ariade homepage layout, or the front-page template renders it automatically. == Ariade branding switch == Out of the box the theme is neutral: your logo or site title in the header, no theme mark in the hero, and a plain footer with your site title, tagline, page list, latest posts and one small "Theme: Ariade" credit. The showcase look (bundled Ariade logo when no site logo is set, brand mark in the hero, and the footer with the newsletter band and Theme / Plugins / Company columns) is still in the theme for demo sites. To switch it on, add this line to a small plugin or to a child theme's functions.php: add_filter( 'ariade_branding', '__return_true' ); The footer template part renders the pattern ariade/footer, which picks the right footer for the switch. If you have edited the footer in the Site Editor, use "Reset" on the Footer template part so the theme version loads again. == Newsletter setup (Mailchimp, MailerLite, Brevo, etc.) == The footer (branding switch on) ships a visual newsletter band with an email input and Subscribe button. That block is a DESIGN PLACEHOLDER and does not submit anywhere on its own -- themes on wordpress.org are not permitted to integrate with third party services or store subscriber data, so the actual signup is handled by a plugin of your choice. The theme styles the plugin form automatically so it inherits the footer visual (gradient band, white pill input, white pill button). We recommend the free Mailchimp for WordPress plugin (500,000+ installs, GPL, actively maintained). The theme has been tested against its output. The same slot works with MailerLite, Brevo, Constant Contact and Sendinblue plugins in the same way -- any form plugin that outputs a standard shortcode or block can replace the placeholder. Step by step for Mailchimp for WordPress: 1. Install the plugin from Plugins > Add New. Search for "Mailchimp for WordPress" by ibericode. Activate it. 2. In your Mailchimp account, create an API key (Account > Extras > API keys) and copy it. 3. In WordPress, go to Mailchimp for WP > Mailchimp, paste the API key and save. The plugin will list your audiences. 4. Go to Mailchimp for WP > Form. Create a form, pick the audience, adjust the labels if you like. Save. Note the form ID shown on the form list. 5. Go to Appearance > Editor > Template Parts > Footer. Find the newsletter HTML block (the visual placeholder with the Email address label and Subscribe button). Delete that HTML block. In its place add a Shortcode block and paste [mc4wp_form id="XX"] using your form ID. 6. Save the template part. The footer form now submits to Mailchimp with the theme's visual language applied automatically. The theme styles .mc4wp-form inside .site-footer to match the placeholder exactly -- white pill input, white pill submit button, uppercase eyebrow label, response messages coloured to fit the gradient band. If you use a different plugin, add its wrapper class to your child theme with the same rules; the source rules live under the "Mailchimp for WordPress (mc4wp) integration" comment in /assets/css/theme.css. Contact form: the contact page patterns include a similar placeholder slot. We recommend the free Ananyoo Accessible Forms plugin (https://wordpress.org/plugins/ananyoo-accessible-forms/) for a WCAG 2.2 AA form with labels, focus states and announced errors. Drop its shortcode or block in place of the placeholder paragraph the pattern ships with. == Cover images == Recommended size for a blog post cover (featured image): 1600x900 pixels, 16:9. The blog cards (posts loop) and the default single-post header (aurora) both show covers in a 16:9 box, so a 16:9 cover is never cropped anywhere in the theme. Any other shape is centred and trimmed by object-fit: cover, so keep logos, badges, faces and text inside the middle 80 percent of the picture; that also protects the image when social networks crop the preview to 1.91:1 (1200x630). Your SEO plugin can set a separate share image if the cover carries a badge near an edge. To use another ratio site-wide, open Site Editor > Templates > Single Posts, select the Featured Image block and change its Aspect ratio; the editorial (21:9), split and cover single-post layouts keep their own framing. == Fonts == Barlow Semi Condensed and Geist are bundled in /assets/fonts and registered through theme.json (fontFace), so no font is loaded from Google Fonts or any other remote server. Nothing leaves the visitor's browser to fetch a font. == Copyright == Ariade WordPress Theme, Copyright 2026 Shivaji Mitra (M/S. Anblik) Ariade is distributed under the terms of the GNU GPL v2 or later. This theme bundles the third-party resources listed below; every one of them is GPL-compatible. == Images / illustrations == All images in assets/images are original works by the theme author, Shivaji Mitra (M/S. Anblik, https://ananyoo.com), and are released under CC0-1.0 / GPL-2.0-or-later: * Photographic images (hero-*.webp, portrait-*.webp, product-*.webp) were created by the theme author using Adobe Firefly (Adobe's commercially safe image models). * Remaining vector artwork (*.svg) is original flat illustration by the theme author. No third-party or stock photography is bundled in the theme. == Bundled fonts == * Barlow Semi Condensed - Copyright 2017 The Barlow Project Authors (https://github.com/jpt/barlow). Licensed under the SIL Open Font License 1.1 (assets/fonts/OFL-BarlowSemiCondensed.txt). * Geist - Copyright 2023 Vercel, in collaboration with basement.studio. Licensed under the SIL Open Font License 1.1 (assets/fonts/OFL-Geist.txt). * Card artwork (assets/img/card-art/art-1.svg to art-6.svg) - Copyright 2026 Shivaji Mitra, M/S. Anblik. Drawn for this theme and released under GPLv2 or later, the same licence as the theme. == Changelog == = 1.7.96 = * Accessibility: footer columns are now tied to their headings. Each column gets role="navigation" (all links) or role="group" (for example contact details) and aria-labelledby pointing to its heading (WCAG 1.3.1). = 1.7.95 = * Generator meta tag now reads "Ariade WordPress theme by Ananyoo". = 1.7.94 = * Developer credit in the document head: an author meta tag (Shivaji Mitra, Ananyoo) and a generator meta tag (Ariade theme by Ananyoo). Nothing is shown on the page. A child theme can change or remove them with the ariade_credit_meta filter. = 1.7.93 = * The content image reset (max-width 100%, height auto) now uses :where(), so it no longer overrides plugin image sizing. It stretched the background images of the Accessible Carousel overlay slides far past the slide height inside page content. = 1.7.92 = * Footer background uses the --ink token instead of a fixed #0E1B36, so it follows the theme.json palette like the rest of the theme. Ariade itself looks the same. = 1.7.91 = * The brand gradient on the menu button, drawer and a few hover states now reads the "brand" gradient preset from theme.json, so a child theme can recolour it. Ariade itself looks the same. = 1.7.90 = * Header: below 1080px, when the desktop menu is hidden, the search, account and menu buttons now stay on the right edge. Before this they sat next to the logo when the brand was short. = 1.7.89 = * The colour and font tokens at the top of assets/css/theme.css now read the theme.json presets first (for example --ink uses --wp--preset--color--ink), with the Ariade values kept as fallbacks. A child theme that sets its own palette or fonts in theme.json now changes every component. The default Ariade look is unchanged. = 1.7.88 = * Added the accessibility-ready tag after a full manual WCAG 2.2 AA audit of the theme on a Theme Unit Test install. The Accessibility section of this readme describes what the theme provides. No other change. = 1.7.87 = * Classic gallery: a focused thumbnail keeps its full size (the focus ring rule was shrinking it to the image's natural size). = 1.7.86 = * Classic [gallery] shortcode galleries now lay out in their column grid (two columns on phones) with rounded, equal-size thumbnails and styled captions; they used to stack in one column. = 1.7.85 = * About patterns (mosaic, chapters, editorial): team cards show a placeholder person icon until a portrait is added, instead of an empty space. = 1.7.84 = * About spine pattern: "In numbers" and "The team" redesigned as clean cards (accent top bar and large figure for the numbers; portrait or a placeholder person icon, name and role for the team). = 1.7.83 = * Milestone pills (About spine, Service detail journey): more side padding so the label never touches the rounded edge. = 1.7.82 = * About spine pattern: a team tag without a portrait no longer squeezes the name and role into the picture column. = 1.7.81 = * Accessibility retest fixes: pagination links are named "Page N" on comment pagination and search results too; a classic-editor table with no caption is named after the heading above it (aria-labelledby); focus ring on classic gallery links; an inverted focus ring (navy inner, white outer) on navy and gradient backgrounds so it is visible there; pricing buttons read "Choose first plan", "Choose second plan", "Choose third plan"; round team and milestone badges become pills that grow with their text instead of breaking words. = 1.7.80 = * Testimonials ledger: quote text at 1.19rem. = 1.7.79 = * Testimonials ledger: larger faded quotation mark (6.5rem). = 1.7.78 = * Testimonials ledger: rows sit flush without the flow gap between them, each row has a large faded quotation mark in its top-left corner, and the quote text no longer carries quote characters. = 1.7.77 = * Testimonials ledger: stars use the same 1.3rem size as the other testimonial patterns (a meta-text rule was shrinking them). = 1.7.76 = * Testimonials ledger: a row whose portrait image is not set yet no longer squeezes the quote into the 64px picture column; the quote takes the wide column. = 1.7.75 = * Testimonial patterns: stars enlarged to 1.3rem and the "5/5" value to .95rem. = 1.7.74 = * Testimonial patterns: stars at 1rem and the "5/5" value at .85rem bold, so the rating is readable at a glance. = 1.7.73 = * Testimonial patterns: the star rating now also shows a visible "5/5" beside the stars, as asked in the accessibility audit; screen readers still hear "Rated 5 out of 5". = 1.7.72 = * Audit follow-up: the category filter placeholder is now disabled in all cases, and pricing plan buttons take their name from the plan heading only. = 1.7.71 = * Accessibility fixes from the manual WCAG 2.2 AA audit of the theme: visible two-tone focus ring on category and tag pills, gallery image links, buttons and the search field; focused pills keep 4.5:1 text contrast; pagination links named "Page N" with the current page marked; the category filter placeholder is disabled; avatars get an empty alt; search results and no-results pages announce a status message; comment Reply, Cancel reply and posting manage keyboard focus; the 404 page has a single H1; "Tell us about your project" is one heading; FAQ questions are headings inside the summary; pricing plan buttons have unique names and the comparison table a caption; the spotlight pricing heading is readable on the dark card; inserted text no longer looks like a link; step numbers meet 3:1; round badges grow with their text; form field borders meet 3:1; content images always fit at 200 and 400 percent zoom; the grid/list switch stays available on phones (reflow). = 1.7.70 = * Performance: the two fonts nearly every page uses (Geist for body text, Barlow Semi Condensed Bold for headings) are preloaded, so text paints sooner and no longer shifts when the font arrives. Change the list with the ariade_preload_fonts filter. * Performance: a page with a Cloudflare Turnstile form (contact or support forms) no longer loads the whole blog stylesheet (about 75 KB). The Turnstile rule only applies inside comment forms, which still load it. = 1.7.69 = * WooCommerce: on variable products the Add to cart button now sits beside the quantity field, as on simple products, instead of dropping below it. = 1.7.68 = * Fix: WooCommerce shop, category and product pages had lost the space between the breadcrumb, title, intro band and filters (a rule meant for full-width homepage sections was removing the gap from every block). Spacing is back; full-width sections are unchanged. = 1.7.67 = * Comments: the date link inherits the meta row colour instead of a fixed grey, so it keeps 4.5:1 on dark child themes (WCAG 1.4.3). * Comments: when WordPress moves the reply form next to a comment, it is placed inside the comment's list item rather than directly in the list, keeping the list markup valid (WCAG 1.3.1). = 1.7.66 = * Landmarks: when a child theme's header or footer part already has its own
or