Important: Adobe Typekit Custom Fonts are not working currently in ShortPoint, until we fix this, please check the workaround you can do here.
Custom Web Fonts for SharePoint is finally here
Add custom web fonts from Google Fonts, Fonts.com, Adobe Typekit and others to SharePoint and Office 365 sites using ShortPoint branding and site customization feature.
ShortPoint Branding and Site Customization Feature already include 800 of the most popular web fonts on the internet. And now, you can add your own fonts as well.
Before you start
- This feature is part of ShortPoint version 5.1.x.x which has been released 12, April 2017, as well as of all the following versions.
- It is supported in SharePoint 2013 and 2016 On Premise, SharePoint Online, Office 365 and Hybrid
- This article will show you how to add custom fonts from Adobe Typekit to your SharePoint and Office 365 sites
Step 1: Select and Add Your Fonts to Kit
- Go to Adobe Typekit Website.
- Search for your desired web font.
- Then you have to add the font to one of your Kits.
To know more about how to add Typekit fonts to your kit, read the following article from Adobe: Add fonts to your website .
Make sure to:
- Add your SharePoint or Office 365 domain to Kit Settings - Domains. For more info, click here.
- You should publish your changes.
Step 2: Copy The Script Links from Embed Code in the Kit Settings
- Navigate to your Typekit Kits.
- Click on the Kit you would like to use:
Click on Embed Code:
Copy the Default embed code:
Step 3: Add New Fonts to your SharePoint site
- Open ShortPoint Theme Builder: Site Settings - ShortPoint Dashboard - Site Customization - Customize my site.
- ShortPoint ThemeBuilder will be activated.
- Go to Utilities - Custom Fonts - TypeKit.
- Paste the Default embed code in the field.
- Click Apply.
That's it! The new fonts from your Adobe Typekit will appear automatically in Fonts & Typography section in ShortPoint Theme Builder.
Step 4: Use the new Fonts to brand your SharePoint Sites
- Go to Fonts & Typography section in ShortPoint branding tool.
- Then navigate to any font settings, for example, Base where you can change the default font for the whole site.
- You will find your new fonts in the fonts list under Custom Fonts category:
That's it :) Happy with your work? Just hit the Publish button.