Borrowing it
Nothing to install: this file belongs to jonathanmoore/kona-theme. Take a copy, put it at the same path in your own repository, and replace the rules that are about this project with yours.
curl -O https://raw.githubusercontent.com/jonathanmoore/kona-theme/main/.claude/skills/shopify-liquid-a11y/SKILL.mdgit clone --depth 1 https://github.com/jonathanmoore/kona-themeWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/jonathanmoore/kona-theme/shopify-liquid-a11y)<a href="https://agentmods.dev/skills/jonathanmoore/kona-theme/shopify-liquid-a11y"><img src="https://agentmods.dev/badge/skills/jonathanmoore/kona-theme/shopify-liquid-a11y/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/jonathanmoore/kona-theme/shopify-liquid-a11y"><img src="https://agentmods.dev/badge/skills/jonathanmoore/kona-theme/shopify-liquid-a11y.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00068 | $0.03631 |
| Opus 5 | $0.00034 | $0.01816 |
| Sonnet 5 | $0.00014 | $0.00726 |
| Haiku 4.5 | $0.00007 | $0.00363 |
Grade A, and why
shopify-liquid-a11y scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 9d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 461 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Accessibility for Shopify Liquid Themes
Core Principle
Every interactive component must work with keyboard only, screen readers, and reduced-motion preferences. Start with semantic HTML — add ARIA only when native semantics are insufficient.
Decision Table: Which Pattern?
| Component | HTML Element | ARIA Pattern | Reference |
|---|---|---|---|
| Expandable content | <details>/<summary> |
None needed | Accordion |
| Modal/dialog | <dialog> |
aria-modal="true" |
Modal |
| Tooltip/popup | [popover] attribute |
role="tooltip" fallback |
Tooltip |
| Dropdown menu | <nav> + <ul> |
aria-expanded on triggers |
Navigation |
| Tab interface | <div> |
role="tablist/tab/tabpanel" |
Tabs |
| Carousel/slider | <div> |
role="region" + aria-roledescription |
Carousel |
| Product card | <article> |
aria-labelledby |
Product card |
| Form | <form> |
aria-invalid, aria-describedby |
Forms |
| Cart drawer | <dialog> |
Focus trap | Cart drawer |
| Price display | <span> |
aria-label for context |
Prices |
| Filters | <form> + <fieldset> |
aria-expanded for disclosures |
Filters |
Page Structure
Landmarks
<body>
<a href="#main-content" class="sr-only focus:not-sr-only focus:fixed focus:top-0 focus:left-0 focus:z-50 focus:bg-contrast focus:text-primary focus:p-4">
{{ 'accessibility.skip_to_content' | t }}
</a>
<header role="banner">
<nav aria-label="{{ 'accessibility.main_navigation' | t }}">...</nav>
</header>
<main id="main-content">
<!-- All page content inside main -->
</main>
<footer role="contentinfo">
<nav aria-label="{{ 'accessibility.footer_navigation' | t }}">...</nav>
</footer>
</body>
- Single
<header>,<main>,<footer>per page - Multiple
<nav>elements must have distinctaria-label - All content must live inside a landmark
What ships with it
2 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 9d ago First seen · 461 lines · 68 tokens per session scan A c969dffe75d9
shopify-liquid-a11y is a skill published in the GitHub repository jonathanmoore/kona-theme (6 stars, last pushed 4mo ago), licensed MIT. It adds 68 tokens to every session and 3,631 once invoked, about $0.0003 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
shopify-theme-development
Build and customize Shopify themes using Liquid templating, JSON sections, dynamic blocks, and theme app extensions for added functionality.
shopify-hydrogen
Build a custom Shopify storefront using the Hydrogen React framework with Remix routing and deploy it to Shopify's Oxygen edge hosting.
shopify-metafields
Store custom data on any Shopify resource — products, orders, customers — using typed metafield definitions accessible from Liquid and the Storefront API.
shopify-theme-builder
Build a complete, clean, Online Store 2.0 Shopify theme from a guided requirements interview. Use when a user wants to build, generate, scaffold, or design a Shopify theme, Shopify sections, JSON templates, Liquid, section groups, or a fully theme-editor-controllable storefront (including bilingual / RTL Arabic…
vuestrata-module-organization
Use when deciding where new files belong and how module boundaries should be preserved.
vuestrata-auth-contract-checks
Use when auth changes could create drift between runtime, env keys, mocks, UI copy, and docs.