I made changes to the back to top button, specifically to add <span class="sr-only">Back to top</span> for screen readers. I added this span to > templates/t4_bs5_blank/language/en-GB/en-GB.tpl_t4_bs5_blank.ini :
T4_BACK_TO_TOP = "<a href='javascript:' id='back-to-top'><span class="sr-only">Back To Top</span><i class='fa fa-chevron-up'></i></a>"

It's not adding it on the frontend. I have cleared cache, I've visited the site from different browsers just to be sure it isn't a cache issue and the span tag is not being added.

Is there another place that I should be editing the back to top button?

Thank you for your help.

Hi @bamhost,

You should replace the double quotes in the sr-only position with single quotes.

T4_BACK_TO_TOP = "<a href='javascript:' id='back-to-top'><span class='sr-only'>Back To Top</span><i class='fa fa-chevron-up'></i></a>"

To modify the "Back to Top" button on your website, follow these steps:

  1. Inspect the button's code by right-clicking on it and selecting "Inspect" or using F12 to open the browser's developer tools. Look for the HTML structure, class/id, and any specific JavaScript controlling the button's visibility, functionality, or animation.

  2. Check your theme or plugin settings for built-in customization. Look in the theme settings, appearance settings, or customizer for options related to the button's position, size, icon, or behavior.

  3. Modify CSS to style the button by changing its size, color, position, and target the correct element.

  4. Modify JavaScript for behavior by checking for a script that is making the page scroll to the top when the button is clicked.

  5. Check for plugin conflicts by temporarily disabling other plugins and updating the plugin to the latest version.

  6. Clear the cache and refresh your page after making changes to the CSS, JavaScript, or HTML. If you have added custom JavaScript to handle the button functionality, ensure it is compatible with your current setup and doesn't prevent changes.

  7. Test your changes on multiple browsers and devices to ensure the button appears and functions as expected.

In conclusion, to modify the "Back to Top" button, start by inspecting the code, making changes in CSS for appearance, and adjusting JavaScript for functionality. Ensure no plugin conflicts are affecting its behavior.

cssyeah - thank you very much for your response. I tried using single quotes already, it didn't work either.

eloanwearhouse - While I appreciate your response, your response has absolutely nothing to do with what I asked or needed help with. I'm well aware of how to do everything you listed out.

I really hate to have to use jQuery just to add that span to the back to top button. I should be able to do overrides to the language file...I have done just that for more years than I can count.

Hi @bamhost,
I tried on my local and It works fine. Can you share us your website information? I will help you check this issue.

Write a Reply...
You need to Login to view replies.