Skip to main content
All CollectionsCalendar: (2) DesignFonts
Design: Fonts - Event details size
Design: Fonts - Event details size

Increase / decrease font size of event details.

Jason Alexis avatar
Written by Jason Alexis
Updated over a year ago

Customize the font size of your event details.

Here is an example.

Note the difference in font sizes of the details of the following items: Event Details, Time, and Location.

Default

Decrease in size

Increase in size


To find this design item...

Step 1: After you log in, click on Calendars (brown box below).

The Your Calendars page will open.

Step 2: Choose the calendar you wish to modify (brown box below).

Step 3: Click on Design (brown box below).

Step 4: Scroll down and click on Fonts (brown box below).

Step 5: Scroll down until you find the sub-section Sizes.

Step 6: Within this sub-section, look for Event details size.


To modify this design item...

Changing the size

There are three options: Default, Inherit, and Custom. We will walk through each one.

Default (image above)

Click on Default. This is the choice of the Display.Church application.

Inherit (image above)

Click on Inherit. In this option, the size is inherited from your website or other embeddable component.

Custom (image above)

Step 1: Click on Custom. It will show the default or inherited size (brown box below).

Step 2: If you hover on the capture line, you will see up and down arrows (brown box below). You can use them to increase or decrease the size. You can also just erase the size and type in a number.

Step 3: Now you need to define the type of measurement you want to use.

Click on the downward arrow (brown box above) to reveal a dropdown list of choices:

  • px - pixels (1px = 1/96th of 1in)

  • % - the measurement is relative to the font size of the parent element

  • em - the measurement is relative to the font size of the element (2em means 2 times the size of the current font)

  • rem - the measurement is relative to the font size of the root element

Step 4: Click Save at the bottom of the column to save your changes.

Did this answer your question?