How Can I Apply Different Fonts to my Promotions or Widgets?

You can apply hosted fonts to your Promotions or Widgets using CSS (Cascading Style Sheets). We recommend using Google Fonts, as all of these fonts are already hosted.

Applying a New Font to a Promotion

You will first want to locate the font you would like to import. This example will utilize the Regular 400 Quicksand font imported from Google Fonts.

Once you have located the font you would like to use, click on the + Select this style button to the right of the font.

You will then see a flyout open to the right. Within that flyout, select the Embed tab and then click on the @import option.

Now, you will want to copy the code provided in the box below @import: 

Next, you will want to paste the copied code into the Additional CSS option in the Design step of your promotion:

Once you have pasted the import code into your Additional CSS, you will also want to insert the CSS rules also specified in Google Fonts:

This will need to be placed within your Additional CSS by adding it to the body so it reads:

The total package will look like this:

Once this is done, you will need to specify the text within the promotion you would like to change, and add the font to that area. Here is an example of how to edit the Call to Action text within the Graphic Header template:

Applying a New Font to a Widget

To apply a Google Font to a text area of a Widget, you will follow the exact steps shown above. The only difference will be that you will need to specify the text within the Widget that you would like to change. Here is an example of how to edit the Header Text of your widget: