Showit Tutorial: Adding Custom Fonts to Showit

Fonts are the biggest design factor when designing your website. Even though Showit offers free Google Fonts for commercial use, you may want to spruce up your design with a custom font. When designing client websites, I always use at least one custom font to personalize the design & make the website stand out. In this post, I’ll be showing you how to upload custom fonts to Showit, and how to convert it into a .WOFF file if needed. The great thing about Showit is that there is no coding required to add a unique font to your website!

Disclaimer: This post includes affiliate links. If you go through them to make a purchase, I will earn a commission. Keep in mind that I only share about companies that I truly believe in and use myself!For my details on affiliate links, please visit my terms of use.

Finding Custom Fonts

You’ll need to find a custom font you like. If you’re working with a brand designer, they may have a custom font in your brand guidelines which you’ll need the proper Webfont licensing to use on your website. If you’re on the search for a unique font, here are some of my go-to websites!

When purchasing a font, you’ll need to purchase a Webfont License. This ensures you’re legally able to use the font on your website (trust me, they check). You’ll receive a .WOFF file immediately after purchasing.

Purchased the font, but there’s no .woff file?

If you know you have the Webfont license but there’s no proper file format received, you can convert it into a .WOFF yourself in minutes! Head over to FontSquirrel’s webfont generator, upload the font file you received, click “Expert” in order to check off .WOFF as the option, and download the converted font file.

Uploading the Custom Fonts to Showit

Now that you have your custom font .WOFF files, you can add custom fonts to Showit. Open your website on the Showit editor, and click Media Library on the top left-hand side menu. You’ll upload the .WOFF files onto your Assets library.

Adding The Font To Your Showit Design

Click “Design Settings” on the top left-hand side menu. You’ll see a Fonts tab at the top, and an area for Custom Fonts. Click the drop-down option next to “Library WOFF”, select your desired custom fonts, type the font name & add the font to your active font list. Upon pressing save, your custom fonts will now be available in the editor to use!

There You Have It!

You can either go back to the Design Settings to use it as a Site Style (affects your entire website), or use it directly through the Editor under text styles. Like this post? You might like my blog posts about Top 4 Website Design Font Mistakes To Avoid.

If you prefer to have a design that’s already made for you & comes with fonts already built in, you’ll love my Showit website templates.

Disclaimer: This post includes affiliate links. If you go through them to make a purchase, I will earn a commission. Keep in mind that I only share about companies that I truly believe in and use myself!For my details on affiliate links, please visit my terms of use.