All Collections
Calendar: (2) Design
Fonts
Design: Fonts - Card event summary
Design: Fonts - Card event summary

Increase / decrease the font size of your event summaries in your calendar view.

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

Customize the font size of your event summaries as they appear in your calendar view.

Here is an example.

Notice that the summary changes size as we change the px value (turquoise arrows in images below).

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 Card event summary.


To modify this design item...

Changing the size

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

Default

Click on Default. This is the choice of the DisplayChurch.Events application.

Inherit

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

Custom

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

Step 2: If you hover on the capture line, you will see up and down arrows (brown box in image above). 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 (gold box in image 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?