![]() The rest of the setup occurs directly in Beefree. Simply copy and paste this into the CSS URL field for Beefree. ![]() In order to use a Google Font in Beefree, start by copying just the HREF content from the widget. Google Fonts provides a rich catalog of web fonts free of charge and ready to use. The icon will change to a □ indicating the delete action.Ī confirmation message will display to reduce the chances of accidental deletion. You can view the existing settings for your font at any time by clicking on the font card within your settings. To delete an existing custom font move the mouse cursor over the ✔ mark. If you want to edit the settings, we recommend you delete and re-import the font. You can now use your custom font in the builder from anywhere within this workspace. The preview also includes the number of weights included for your custom fonts. ![]() This section is always at the top of your font settings. Once you click Submit, the new custom font will be added at the bottom in the Custom fonts section. It's important to add a web-safe font, such as Arial for sans-serif fonts or Times New Roman for serif fonts.įont Stack: 'Lobster', Georgia, Times, serif Remember that Gmail and other email clients will not display web fonts. We recommend building a font stack with some fall-back choices. Use the dropdown menu to select a font stack from fonts already available in Beefree. This is the font-family stack (CSS syntax) that will be applied to the text paragraphs. If you want to remove any styles, you need to modify your stylesheet. Anything listed here will be available for you to use in the builder. Here we list all of the font weights we found on your stylesheet. By default, we'll select the first font listed in the stylesheet. You must use the dropdown to select which font you want to import. This section only populates if you input a CSS URL referring to more than one font. If the stylesheet is valid, some new fields will populate. You'll see a message that says Checking your data. Once you insert your CSS URL, we perform some checks to make sure it's a valid stylesheet. See below for more about how to easily use Google fonts with Beefree. Google Fonts already provides web fonts that work in the builder and most email clients. ![]() This can cause problems in the Beefree user interface. If the CSS contains additional styles, the host application is likely to inherit them. It's a best practice to use a dedicated CSS sheet. Also, Policy CORS must be enabled in the host to deliver the font files. This URL must be delivered on the HTTPS protocol, with a valid SSL certificate. Litmus has a detailed guide as well.Īs you can see from the list above, there are a couple of very popular email clients missing from the list. Android (default mail client, not Gmail app)Ĭampaign Monitor has an in-depth guide to using Web fonts in email if you want to learn more about this topic.Unfortunately, not all email clients support Web fonts. Note that you can only leverage fonts that are available through the web, called Web fonts. You can use them when designing both emails and pages. Maybe you just want to experiment with new font styles!īeefree allows you to add custom fonts to your Beefree account. Or perhaps you are working with a client that uses a specific font for their communication. For example, you may need to follow strict branding guidelines in your company. There are times when you may need to use a font that is not already available in Beefree. This article applies to the Team and Enterprise plans.
0 Comments
Leave a Reply. |