add_section('roi_typography', array(
'title' => __('Typography', 'roi-theme'),
'description' => __('Configure font settings for your site.', 'roi-theme'),
'priority' => 30,
));
// Setting: Use Custom Fonts
$wp_customize->add_setting('roi_use_custom_fonts', array(
'default' => false,
'sanitize_callback' => 'roi_sanitize_checkbox',
'transport' => 'refresh',
));
$wp_customize->add_control('roi_use_custom_fonts', array(
'label' => __('Use Custom Fonts', 'roi-theme'),
'description' => __('Enable custom fonts instead of system fonts. System fonts load faster and improve Core Web Vitals.', 'roi-theme'),
'section' => 'roi_typography',
'type' => 'checkbox',
));
// Setting: Font Loading Strategy (only if custom fonts enabled)
$wp_customize->add_setting('roi_font_display', array(
'default' => 'swap',
'sanitize_callback' => 'roi_sanitize_select',
'transport' => 'refresh',
));
$wp_customize->add_control('roi_font_display', array(
'label' => __('Font Display Strategy', 'roi-theme'),
'description' => __('Controls how fonts are displayed during loading. "swap" is recommended for best performance.', 'roi-theme'),
'section' => 'roi_typography',
'type' => 'select',
'choices' => array(
'auto' => __('Auto', 'roi-theme'),
'block' => __('Block', 'roi-theme'),
'swap' => __('Swap (Recommended)', 'roi-theme'),
'fallback' => __('Fallback', 'roi-theme'),
'optional' => __('Optional', 'roi-theme'),
),
'active_callback' => 'roi_is_custom_fonts_enabled',
));
// Setting: Preload Fonts
$wp_customize->add_setting('roi_preload_fonts', array(
'default' => true,
'sanitize_callback' => 'roi_sanitize_checkbox',
'transport' => 'refresh',
));
$wp_customize->add_control('roi_preload_fonts', array(
'label' => __('Preload Font Files', 'roi-theme'),
'description' => __('Preload critical font files for faster rendering. Recommended for better LCP scores.', 'roi-theme'),
'section' => 'roi_typography',
'type' => 'checkbox',
'active_callback' => 'roi_is_custom_fonts_enabled',
));
}
add_action('customize_register', 'roi_customize_register_fonts');
/**
* Check if custom fonts are enabled
*/
function roi_is_custom_fonts_enabled() {
return get_theme_mod('roi_use_custom_fonts', false);
}
/**
* Add body class based on font settings
*/
function roi_font_body_class($classes) {
if (roi_is_custom_fonts_enabled()) {
$classes[] = 'use-custom-fonts';
} else {
$classes[] = 'use-system-fonts';
}
return $classes;
}
add_filter('body_class', 'roi_font_body_class');
/**
* Add preload links for custom fonts
*/
function roi_preload_custom_fonts() {
// Only preload if custom fonts are enabled and preload is enabled
if (!roi_is_custom_fonts_enabled()) {
return;
}
if (!get_theme_mod('roi_preload_fonts', true)) {
return;
}
// Example preload links - uncomment and modify when you have custom font files
/*
?>