Skip to main content

Update Existing Front Elements to Scaling Fonts

Updating Existing Font Elements to Scaling Fonts in Zenu Web Builder for many devices

Updated over 2 months ago

Zenu has introduced scaling fonts to help your website text look great across all devices, whether visitors are viewing on a phone, tablet, or desktop.


What Are Scaling Fonts?

Previously, fonts in Web Builder were sized in pixels (px), a fixed unit that doesn’t automatically adjust to different screen sizes.

Scaling fonts, however, use rem (root em) units. These scale dynamically with your site’s base font size, making your typography responsive and consistent across all devices.


Step 1: Access Your Font Elements

  1. Go to Site Design.

  2. Click Elements.

  3. Find the font element you want to update.

  4. Click the ellipsis (•••) next to the element name, then select Edit.


Step 2: Enable Scaling Fonts

In the settings window:

  1. Find the dropdown labelled Use Scaling Fonts.

  2. Set this option to Yes.

This enables scaling for the selected font element.


Step 3: Set Your Scaled Font Size

Next, choose a value for your Scaled Font Size.

Here’s how it works:

  • A scaled font size of 1 equals your Global Base Font size.

  • If your Global Base Font is 16px, then:

    • 1 = 16px

    • 2 = 32px

    • 0.75 = 12px, and so on.


Step 4: Preview and Save

Before finalising your changes, take a look at the Text Preview to see how your font appears with the new settings.

If everything looks good:

  1. Adjust any additional style settings as needed.

  2. Click Save to apply your updates.

Your font element will now scale automatically with screen size, ensuring a smoother and more professional user experience.

Did this answer your question?