The Gridbox Design System. Chapter 2: Typography Inheritance

Typography Inheritance System

Friends, we continue the series of updates "Gridbox Design System" and today we are happy to introduce Joomla website builder Gridbox 2.4.1 which comes with The Gridbox Typography Inheritance System and also includes important security fixes!

The Gridbox Design System. Chapter 2: Typography Inheritance

Before we start talking about new features in the Gridbox 2.4.1, we want to note - that the new update includes important security fixes, we strongly recommend you to update all your Gridbox websites to version 2.4.1.

Many thanks to Fiona Coulter from the VEL for her fantastic assistance, much appreciated!

Typography Inheritance

Inheritance - one of the basics principles of the CSS. Parent elements can pass style down to their children. Friends, we want to introduce you to the Gridbox Typography Inheritance System.

Typography Inheritance - Joomla website builder Gridbox

Changing the font-family on the body will consequently change the font-family for all child elements.

Managing Typography Inheritance

First, we need to set typography styles for the body. To do this, you need to open the theme settings and from the drop-down list "Typography" select "Base Font" and configure font styles for the body.

Base Font - Joomla website builder Gridbox

To start passing styles from theme to plugins, you need to open Typography settings of any Gridbox plugin, and for the font-family, you need to select "Inherit".

Inherit - Joomla website builder Gridbox

After that, the connection will be established, and if you change "Base Font" in the theme settings, the font will also change in the plugin.

If you install a fresh Gridbox 2.4.1 installation you’ll see that Gridbox Typography Inheritance System configured by default. Font-family in all Gridbox plugins comes with a value “Inherit”.

On the screen below you can view Typography Hierarchy which is configured by default.

Typography Hierarchy - Joomla website builder Gridbox

New Font Picker and Font Library

As you might have noticed, the "Font Family" field was divided into two fields: "Font Family" and "Font Weight".

By clicking on the field will be opened drop-down list with all available fonts from the library.

Font Picker - Joomla website builder Gridbox

Adding New Fonts

New fonts can be added using Gridbox Fonts Library. In the Joomla website builder Gridbox 2.4.1, Fonts Library presented as an independent tool, which you can find in the "Tools" drop-down menu.

Fonts Library - Joomla website builder Gridbox

Google Fonts and your Custom Fonts can be added in the same way as in the previous Gridbox versions.

To remove fonts, you need to select the fonts and click on the icon to delete.

Delete Fonts - Joomla website builder Gridbox

Typography trends are constantly changing, a few years ago was popular Raleway, then Montserrat, Poppins, etc. and if someday your customer decided to change the font-family on a website, you’ll be able to do it without the need to open each plug-in.


2.4.1 — 18.04.2018

  • Font Family Inheritance system
  • An issue with a slideshow delay on page loading
  • Deleting the default menu
  • Cross-site Scripting (XSS) vulnerability
  • SQL injection vulnerability
  • Unrestricted file upload vulnerability
  • Arbitrary file download vulnerability

Leave a comment

Share with your friends

Newsroom on your favourite platforms