For example, Key Features would also work in cases when you want to change the font for a single instance of the Particle. You can also reference it in Span tags within text fields in the Gantry administrator. ![]() such as Icon Picker, Image Picker, Font Picker, Collections, and much more. Once you have done this, you should now be able to reload the page and see your changes. The Gantry 5 administrator benefits from unlimited undo/redo, to ensure that. Doing this will force Gantry to recompile the CSS including the changes you made in the custom.scss file. You need to Recompile CSS in the Styles administrative panel in the Gantry administrator. Because that font family is defined in the custom.scss file, it should pull the Bloody find and present it to the front end. Īs you can see, we set the h1 style to font-family: BloodyNormal. ![]() For example, if you wanted the title of a Particle to appear in the Bloody font, you would reference it in the Particle's Twig file. Once you have added the font to your theme's custom content directory, you can apply it to your site. Font Awesome icons are awesome, and theyre supported natively in Reiko. Font Picker enables you to browse hundreds of fonts, see real-time. Please ensure you download the Kit.Ĭreate your custom style sheet file, custom.scss, and add it to user/data/gantry5/themes/THEME_DIR/scss/.Īdd the following to the custom SCSS file: /* Adding Font BLOODY font-face('BloodyNormal', 'gantry-theme://fonts/BLOODY-webfont') įont-family: 'BloodyNormal',Helvetica,Arial,sans-serif Take advantage of the uniquely powerful Gantry 5 Color Picker and change your. Themes powered by Gantry 5 come with an industry-leading set of core features. In this example, we will explain how you can add the custom free font Bloody to your Gantry template.īloody is a free font that you can download at FontSquirrel. Here's a quick reference guide to the font weight numbers that are shown above in the Weight Font Picker enables you to browse hundreds of fonts, see real-time previews of your text, and use them in your site. If you haven't already created one, you will need to do so by adding it to font-face('gaspar', 'gantry-theme://fonts/gaspar/gaspar_regular/gaspar-regular-webfont', font-face('gaspar-italic', 'gantry-theme://fonts/gaspar/gaspar_italic/gaspar-italic-webfont', font-face('gaspar-bold', 'gantry-theme://fonts/gaspar/gaspar_bold/gaspar-bold-webfont', font-face('gaspar-bolditalic', 'gantry-theme://fonts/gaspar/gaspar_bolditalic/gaspar-bolditalic-webfont', 700) Font Weights
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |