Skip to content

Mark the reassurance icons as decorative - #1102

Merged
tblivet merged 4 commits into
PrestaShop:2.xfrom
boo-code:fix/reassurance-icons-decorative-alt-30619
Sep 18, 2026
Merged

tblivet merged 4 commits into
PrestaShop:2.xfrom
boo-code:fix/reassurance-icons-decorative-alt-30619

Conversation

@boo-code

@boo-code boo-code commented Sep 8, 2026

Copy link
Copy Markdown
Contributor
Questions Answers
Description? The theme overrides the three blockreassurance hook templates, and its copies carry no alt on the six img tags either, so the default PrestaShop 9 front office renders the reassurance icons with no alt attribute. Each icon sits next to the block title and description, so it is redundant to adjacent text and gets alt="", the same call as #1060 for the payment option logo.
Type? improvement
BC breaks? no
Deprecations? no
Fixed ticket? Fixes PrestaShop/PrestaShop#30619
Sponsor company None
How to test? Open a product page on a shop using this theme with the blockreassurance module enabled and read the rendered markup: the three img tags inside .reassurance__image now carry alt="". Verified on a 9.2 shop: before, <img class="svg img-fluid invisible" src="...security.svg">; after, the same tag with alt="". The rendered pixels are unchanged.

Related

Companion PR on the module itself, for shops using a theme that does not override these templates: PrestaShop/blockreassurance#818

The six img tags in the three blockreassurance overrides carry no alt
attribute, so SEO crawlers and HTML validators report them as missing and
screen readers fall back to announcing the file name.

Each icon sits next to the block title and description, which already carry
the meaning, so the correct value is an empty alt, as done for the payment
option logo in PrestaShop#1060.
@tblivet tblivet added this to the v2.1.1 milestone Sep 16, 2026
@tblivet
tblivet marked this pull request as ready for review September 16, 2026 10:00
@github-project-automation github-project-automation Bot moved this to Ready for review in PR Dashboard Sep 16, 2026
tblivet

This comment was marked as outdated.

@ps-jarvis ps-jarvis added the Waiting for QA Status: Action required, Waiting for test feedback label Sep 16, 2026
@ps-jarvis ps-jarvis moved this from Ready for review to To be tested in PR Dashboard Sep 16, 2026

@tblivet tblivet left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @boo-code, it all looks good!

I left a suggestion on those same lines, here's why: in the custom_icon statement the whole class attribute is wrapped in {if $block['is_svg']}, so a merchant who uploads a PNG or a JPG instead of an SVG ends up with an carrying no class at all and img-fluid is needed there. It's a small bug that can be fixed along with this PR 👍

Comment thread modules/blockreassurance/views/templates/hook/displayBlock.tpl Outdated
Comment thread modules/blockreassurance/views/templates/hook/displayBlockProduct.tpl Outdated
Comment thread modules/blockreassurance/views/templates/hook/displayBlockWhite.tpl Outdated

@tblivet tblivet left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have applied the changes, thank you @boo-code 🙏

@tblivet

tblivet commented Sep 17, 2026

Copy link
Copy Markdown
Contributor

🟢 Approved: the missing text alternative is fixed, and with the suggested change to the custom_icon lines the oversized icon is fixed too.

AI-assisted QA: an agent drove a real browser through the steps below and drafted this comment. Worth a sanity check.

Measured on PrestaShop 9.3.0, PHP 8.1.33, Hummingbird 2.1.0, blockreassurance 6.0.0, with all three changed templates rendering on one page (header, footer and product hooks all enabled, nine icons: three uploaded photos, three custom SVGs, three pack SVGs).

On the commit this branched from, then on this branch with the suggestion applied:

Reading Before After
icons served with a text alternative 0 of 9 9 of 9
icons announced to a screen reader as unlabelled 3 0
icons painted wider than their slot 3 of 3, a 2048px icon in a 48px slot 0 of 3
product page sideways scroll at 1280 wide 1496px 0px
front page, product and cart at 375 and 768 wide all six readings scrolled sideways all six clean

The alt attributes are the change as published. The last three rows are what the suggested class="img-fluid{if $block['is_svg']} svg invisible{/if}" adds: without it a merchant uploading a photo as a custom icon gets it painted at full size, which is a pre-existing defect this branch is one line away from fixing.

Preconditions, smoke pages, console errors and network errors were identical in both runs.

Before (big image overflow):
clip-03-the-reassurance-block-on-the-product-page

After:
clip-03-the-reassurance-block-on-the-product-page

@tblivet tblivet added QA with AI ✓ AI-assisted QA and removed Waiting for Author Waiting for QA Status: Action required, Waiting for test feedback labels Sep 17, 2026
@tblivet
tblivet merged commit 0101ff2 into PrestaShop:2.x Sep 18, 2026
6 checks passed
@github-project-automation github-project-automation Bot moved this from To be tested to Merged in PR Dashboard Sep 18, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

QA with AI ✓ AI-assisted QA

Projects

Status: Merged

Development

Successfully merging this pull request may close these issues.

5 participants