How to fix nested interactive on PrestaShop
Remove or restructure nested interactive elements so that no focusable control (button, link, input, etc.) is placed inside another interactive control, and never rely on tabindex="-1" or aria-hidden="true" to hide an inner interactive element from assistive technologies.
Steps for PrestaShop
- In your PrestaShop back office, go to Design → Theme & Logo → [your theme] and use FTP or the Theme Editor to locate the affected template file (commonly themes/<yourtheme>/templates/catalog/_partials/miniatures/product.tpl or checkout/).
- Open the .tpl (Smarty) file and search for nested interactive elements.
- Refactor: replace one of the two interactive elements with a `<span>` or `<div>`, preserving visual styles.
- Clear PrestaShop's Smarty cache under Advanced Parameters → Performance → Clear Cache, then verify the fix.
What is nested interactive?
WCAG Success Criterion 4.1.2 requires that every user interface component has a name, role, and value that assistive technologies (like screen readers) can reliably understand. A "nested interactive" violation occurs when one interactive element — such as a `<button>`, `<a>`, `<select>`, or `<input>` — is placed inside another interactive element in the HTML. For example, putting a `<button>` inside an `<a>` tag, or an `<a>` link inside a `<button>`. HTML forbids this nesting, browsers handle it inconsistently, and screen readers and keyboard navigation can behave unpredictably. Adding `tabindex="-1"` or `aria-hidden="true"` to the inner element does NOT reliably hide it from assistive technology — screen readers can still discover and announce it, creating a confusing or broken experience.
Keyboard-only users and screen-reader users (a significant and legally protected segment of shoppers) can get stuck, confused, or blocked from completing a purchase when interactive controls are nested. In many jurisdictions — including the US (ADA), EU (EN 301 549), and UK (Equality Act) — inaccessible ecommerce stores face real legal exposure including complaints, audits, and lawsuits. Beyond legal risk, a broken checkout button or unclickable product link directly costs you conversions and revenue. Google also uses accessibility signals as a quality indicator, so fixing these issues can modestly improve crawlability and organic rankings over time.
See the complete Nested interactive guide for every platform and the full background.
Not sure if your PrestaShop store has this?
Run a free SEOLZ scan — we’ll find nested interactive and every other issue across your whole site.
Scan my site free