Skip to content

Instantly share code, notes, and snippets.

@jcamp
Created August 13, 2018 16:40
Show Gist options
  • Save jcamp/0be65b11857024eb3a888afeb00c4485 to your computer and use it in GitHub Desktop.
Save jcamp/0be65b11857024eb3a888afeb00c4485 to your computer and use it in GitHub Desktop.
Wordpress enqueue styles with child styles (takes into account Bootstrap in this case load bootstrap and then override)
<?php
// Basically we need to make sure we load ALL our stylesheets for our child theme AFTER bootstrap
// that way we can override bootstrap without using crappy !important overrides, etc.
// This sample uses the transportex theme but just replace that for your own theme.
function my_theme_enqueue_styles() {
$parent_style = 'transportex-style'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.
$theme_colors_style = 'transportex_color';
// enqueue the parent theme with a dependancy of bootstrap in this case as it overriding stuff!
wp_enqueue_style( $parent_style,
get_template_directory_uri() . '/style.css',
array( 'bootstrap' )
);
// enqueue child theme style making sure that it comes after bootstrap.
wp_enqueue_style( 'child-style',
get_stylesheet_directory_uri() . '/style.css',
array( $parent_style, 'bootstrap' ),
wp_get_theme()->get('Version')
);
// these are just for a particular theme - overriding the colours - get the parent colours then override them.
wp_enqueue_style($theme_colors_style, get_template_directory_uri() . '/css/colors/default.css');
wp_enqueue_style( 'child_colors',
get_stylesheet_directory_uri() . '/default.css',
array( $parent_style ),
wp_get_theme()->get('Version')
);
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment