To add a Custom Font using the method given here, you should have the Oshine Child theme installed and activated. Upload the oshine_child.zip from the Buyers Package that you downloaded in the WordPress Dashboard and Activate the Child Theme.
1. Download the Custom Font files in all the required formats. Create a Folder named ‘custom-fonts’ in the Child Theme and place the font files in this folder.
2. Generate the Fonts CSS file and name it ‘fonts.css’. Place this file in a folder named ‘fonts’ within the root folder in the Child theme. Ensure the font sources are pointed to files with the custom-fonts folder –
Ex –
@font-face { font-family: 'Font Family'; src: url('../custom-fonts/font-name.eot'); src: url('../custom-fonts/font-name.eot?#iefix') format('embedded-opentype'), url('../custom-fonts/font-name.woff') format('woff'), url('../custom-fonts/font-name.ttf') format('truetype'), url('../custom-fonts/font-name.svg#webfont') format('svg'); }
3. Add the following functions in ‘functions.php’ file in the Child Theme
<?php //FUNCTIONS TO ENQUEUE FONT FILES if (!function_exists('be_themes_child_theme_setup') ){ function be_themes_child_theme_setup() { wp_register_style( 'redux-external-fonts-addl', get_stylesheet_directory_uri() . '/fonts/fonts.css' ); wp_enqueue_style( 'redux-external-fonts-addl' ); } add_action( 'after_setup_theme', 'be_themes_child_theme_setup' ); } //FUNCTION TO ADD CUSTOM FONTS TO TYPOGRAPHY FILEDS IN THE OPTIONS PANEL if (!function_exists('be_themes_add_custom_fonts')){ function be_themes_add_custom_fonts($custom_fonts){ //REPLACE THE ARRAY WITH THE CUSTOM FONTS THAT YOU ADD $addl_fonts = array( "Font Name Bold" => "Font Name Bold", "Font Name Regular" => "Font Name Regular" ); return array_merge($custom_fonts, $addl_fonts); } add_filter('be_themes_custom_font_filter' , 'be_themes_add_custom_fonts'); } ?>