To add custom fonts on Drupal 8, follow these steps:
1. Upload the font files to a folder in your Drupal site’s file directory. You can create a new folder named “fonts” inside the “themes” folder.
1. Create a new CSS file in your Drupal site’s theme. You can name it “fonts.css”.
1. In the CSS file, add the following code to import the font files:
@font-face {
font-family: ‘Font Name’;
src: url(‘../fonts/fontname.woff’) format(‘woff’), /_ Add all font file types (eot, ttf, svg) _/
}
Note: Replace “Font Name” with your desired font name, and “fontname.woff” with the filename of your font file.
1. Save the CSS file and add it to your Drupal site’s theme. You can do this by editing the theme’s .info.yml file and adding the following line:
stylesheets: all: css/fonts.css: {}
1. Clear the Drupal site’s cache by navigating to Configuration > Development > Performance and clicking “Clear all caches.”
1. Use the custom font in your Drupal site’s theme by adding the font-family property to your CSS styles. For example:
body {
font-family: ‘Font Name’, sans-serif;
}
Note: Ensure that the font file is licensed for web use and properly credited if necessary.
