Copyright © 2025 by WP CODE SNIPPETS
Mika MAtikainen
Apr 15, 2020 · 4 min read
Front-end Scripts and Styles
[code lang=”php”]
function theme_styles() {
wp_enqueue_style( ‘bootstrap_css’, get_template_directory_uri() . ‘/css/bootstrap.min.css’ );
wp_enqueue_style( ‘main_css’, get_template_directory_uri() . ‘/style.css’ );
wp_enqueue_script( ‘bootstrap_js’, get_template_directory_uri() . ‘/js/bootstrap.min.js’, array(‘jquery’), ”, true );
wp_enqueue_script( ‘theme_js’, get_template_directory_uri() . ‘/js/theme.js’, array(‘jquery’, ‘bootstrap_js’), ”, true );
}
add_action( ‘wp_enqueue_scripts’, ‘theme_styles’ );
[/code]
This is a commonly-used hook and one that you learn quite early in WordPress development. It allows you to generate a URL stylesheets and JavaScript files on the front-end of your theme. This is the preferred method of linking to CSS and JS, rather than hardcoding the links in your theme header.