Slider Revolution supports a wide range of Google Fonts. But you can also use apply a custom webfont.
Special Note:
If the webfont you wish to use is already being loaded by your WordPress Theme, skip to Part 2 or Part 3 below.
Part 1
For this example, we’ll use the Open Sans font from FontSquirell. After visiting that link, click the Webfont Kit tab, and then click the Download @font-face kit button:
Next, unzip the downloaded file, and then open the html file named How_to_use_web_fonts.html, and review the information in this document.
Next, click the download’s webfont folder, and then click on the opensans_bold_macroman folder. Inside this folder, you’ll see the following font files:
Next, using an ftp program, upload the fonts to your website. For this example, we’ll create a new directory called webfonts inside the wp-content directory. So the fonts would be uploaded via ftp here:
wp-content/webfonts/
Next, open the “stylesheet.css” file in a text editor:
and modify the urls to be absolute, so they’re loaded from the wp-content/webfonts/ directory. Here’s an example:
@font-face {
font-family: 'open_sansbold';
src: url('http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.eot');
src: url('http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
url('http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.woff') format('woff'),
url('http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.ttf') format('truetype'),
url('http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.svg#open_sansbold') format('svg');
font-weight: normal;
font-style: normal;
}
Next, copy this CSS to your computer’s clipboard, and paste it into your Module's Custom CSS section.
Part 2
To officially apply the font to one of your Text Layers, select the Layer on the editing stage and then add a unique class inside the Attributes section.
And then open the Custom CSS modal and apply the font to the class, using the "!important" declaration.
Part 3
Navigate to Global Settings and locate the "Enable custom font selection in editor" option
Insert the "font-family" name into the text box.
Example: CustomA, CustomB
Then the "font-family" will appear in the "Text Layer" > Style > "font-family" dropdown list
