Custom code to Decrease font size if visitor is viewing regular Wix editor website from a tablet

Show and tell
,
1

Hello,

I was checking if there is an option to change the font size if the user is viewing a website built with regular editor from a tablet.

The following code successfully makes the all font size from the page smaller with 2px. Feel free to adjust it per your requirements.

<script>
document.addEventListener("DOMContentLoaded", function() {

    var minWidth = 768; // minimum pixel width for tablets
    var maxWidth = 1024; // maximum pixel width for tablets

    // Check if the screen width is within the tablet range
    if (window.innerWidth >= minWidth && window.innerWidth <= maxWidth) {
        // Select all text elements on the page
        var allTextElements = document.querySelectorAll('body *');

        // Loop through each element and decrease its font size
        allTextElements.forEach(function(element) {
            // Get the current font size
            var currentFontSize = window.getComputedStyle(element).fontSize;
            // Calculate the new, smaller font size (reduce by 2px)
            var newFontSize = parseFloat(currentFontSize) - 2 + 'px';
            // Set the new font size
            element.style.fontSize = newFontSize;
        });
    }
});
</script>
1 Like
2

This is great, thanks for sharing this!