Provide webfonts integration for SilverStripe CMS allowing fonts inside HTMLEditorField and frontend.
- silverstripe/framework ^4.0
Composer is the recommended way of installing SilverStripe modules.
$ composer require gorriecoe/silverstripe-webfonts
Define the TypeKitID in config.yaml
gorriecoe\Webfonts\View\Webfonts:
TypeKitID: '######'
One of the following can be used in page template:
$TypeKitScript: Returns javascript embed code.$TypeKitStyle: Returns style link code.$TypeKitID: Returns the Typekit kit ID.$WebFontLoader: Returns web font loader embed code.
<head>
<title>Example.com</title>
{$TypeKitScript}
</head>Define the GoogleFonts in config.yaml
gorriecoe\Webfonts\View\Webfonts:
GoogleFonts:
- 'Droid Sans'
- 'Droid Serif:bold'
One of the following can be used in page template:
$GoogleFonts: Returns style link code.$WebFontLoader: Returns web font loader embed code.
<head>
<title>Example.com</title>
{$GoogleFonts}
</head>Define the FontsComID in config.yaml
gorriecoe\Webfonts\View\Webfonts:
FontsComID: '######'
One of the following can be used in page template:
$FontsCom: Returns javascript link code.$FontsComID: Returns the Font.com project ID.$WebFontLoader: Returns web font loader embed code.
<head>
<title>Example.com</title>
{$FontsCom}
</head>Define the options as listed above in config.yaml
gorriecoe\Webfonts\View\Webfonts:
TypeKitID: '######'
GoogleFonts:
- 'Droid Sans'
- 'Droid Serif:bold'
$WebFontLoader returns web font loader embed code is the recommended variable used in page template for handling multiple font providers.
<head>
<title>Example.com</title>
{$WebFontLoader}
</head>Define the CustomFonts in config.yaml
gorriecoe\Webfonts\View\Webfonts:
CustomFonts:
'MyFont:Bold,Italic': '/fonts.css'
'FontAwesome': '//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css'
$WebFontLoader can be used in page template to return web font loader embed code.