Jump to content

Leaderboard

Popular Content

Showing content with the highest reputation since 05/15/2024 in all areas

  1. Some CC users may find this little code hack handy. I found a solution after it was flagged as an accessibility issue by Google. It allows you to add a title and/or description to an svg icon , in this instance the svg home icon seen in the mobile skin or on small screens, improving the user experience for people with accessibility issues. Find this original code in template element.breadcrumb.php <a itemprop="item" href="{$STORE_URL}"> <span class="show-for-small-only"> <svg class="icon"><use xlink:href="#icon-home"></use></svg> </span> <span class="show-for-medium-up" itemprop="name">{$LANG.common.home}</span> </a> Edit to include the information for aria-describedby mark up: <a itemprop="item" href="{$STORE_URL}"> <span class="show-for-small-only"> <svg class="icon" aria-describedby="svg-titlehome1 svg-deschome1" role="img"><title id="svg-titlehome1">home</title><desc id="svg-deschome1">home</desc><use xlink:href="#icon-home"></use></svg> </span> <span class="show-for-medium-up" itemprop="name">{$LANG.common.home}</span> </a> The result of the additional code is the word 'home' appearing on hover over the home SVG icon in the mobile skin. I've also made the same code addition to the home svg icon in box.navigation.php however you will need to change the aria-describedby title and desc to unique / different ID names in a second instance for it to work with both templates.
    1 point
  2. These {$var} entities are for Smarty, the template rendering engine, and are evaluated before the finished HTML is sent out of the web server. Using the More button causes javascript (at the browser) to request, receive, and use only a specific portion of the next page, which gets appended to the end of the scrollable products area. This specific portion of the incoming HTML may have the page number somewhere in it, but it will not be tied to {$page}. That is, having added {$page} to a different template, or a new place in the content template, when Smarty replaces it with a actual number (at the server), that new number won't show if it is outside of the portion of the finished HTML that the javascript uses.
    1 point
×
×
  • Create New...