I just realized that my site has not been using the local files of bootstrap and was getting theme via CDN. I've now been trying to figure out how to switch from CDN to using the local files, but every time I attempt to switch them my whole site becomes messed up. I have the bootstrap css files in a css folder as well as the js files in a js folder. Can anyone help me get bootstrap from my local files?
This probably seems like an easy question however I'm still pretty new at this, so I'm completely lost.
what I had before in my functions.php...
function learningWordPress_resources() {
wp_enqueue_style('style', get_stylesheet_uri());
wp_enqueue_script( 'bootstrap-js', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css', array('jquery'), '3.3.7', true );
wp_enqueue_style( 'bootstrap-style', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css' );
}
add_action('wp_enqueue_scripts', 'learningWordPress_resources');
what I tried to switch it too...
function learningWordPress_resources() {
wp_enqueue_style( 'bootstrapstyle', get_template_directory_uri() . '/css/bootstrap.min.css' );
wp_enqueue_style( 'bootstrapthemestyle', get_template_directory_uri() . '/css/bootstrap-theme.min.css' );
wp_enqueue_script( 'bootstrap-script', get_template_directory_uri() . '/js/bootstrap.min.js', array(), true );
}
add_action('wp_enqueue_scripts', 'learningWordPress_resources');
I think you need to load three files: css, javascript, and your local style.css file:
Here is what I do on my Legal Firm Website - you can view the source yourself.
function btc_scripts() {
wp_enqueue_style( 'bootstrap-style', get_template_directory_uri() . '/css/bootstrap.min.css', array(), '3.3.5' );
wp_enqueue_style( 'btc-style', get_template_directory_uri() . '/style.css' , array ('bootstrap-style'),'1.0.1');
wp_enqueue_script ( 'bootstrap-js', get_template_directory_uri() . '/js/bootstrap.min.js', array('jquery'), '3.3.5', false);
}
add_action( 'wp_enqueue_scripts', 'btc_scripts' );
Related
I'm absolutly new to wordpress theme development and I am having some issues
enqueuing my javascript file.
// Enqueue script
wp_enqueue_script( 'personaltheme-script', get_template_directory_uri() . '/dist/assets/js/bundle.js', array(), '1.0.0', true);
}
add_action( 'wp_enqueue_scripts', 'personaltheme_script');
What am I doing wrong here? My styling seams to work so far:
function personaltheme_style(){
wp_enqueue_style( 'personaltheme-stylesheet',
get_template_directory_uri() . '/dist/assets/css/bundle.css',
array(), '1.0.0', 'all');
}
add_action( 'wp_enqueue_style', 'personaltheme_style');
Does anybody know how to solve this problem?
Thanks in advance!
Try to register your script before:
function az_register_script(){
// Register script
wp_register_script('personaltheme-script', get_template_directory_uri() . '/dist/assets/css/bundle.css', 'array()', '1.0.0', true);
// Enqueue script
wp_enqueue_script( 'personaltheme-script' );
}
add_action('wp_enqueue_scripts', 'az_register_script');
I Hope it helps!
I trying to create some admin pages for tutorial for WordPress. I have added standard css and js files with function that is wp_enqueue_style. It worked, but in enqueue.php file, commands doesn't work.
My codes in enqueue.php:
<?php
function theme_load_admin_scripts($hook){
if('toplevel_page_theme_option' != $hook){
return;
}
wp_register_style('theme_admin', get_template_directory_uri() . '/css/theme.admin.css', array(), '1.0.0', 'all');
wp_enqueue_style('theme_admin');
wp_enqueue_media();
wp_register_script('theme-admin-script', get_template_directory_uri() . '/inc/js/theme.admin.js', array('jquery'), '1.0.0', true);
wp_enqueue_script('theme-admin-script');
}
add_action('admin_enqueue_scripts', 'theme_load_admin_scripts');
?>
use admin_init
add_action('admin_init', 'theme_load_admin_scripts');
https://codex.wordpress.org/Plugin_API/Action_Reference/admin_init
I want to load jquery files using wp_enqueue_script in wordpress. below is the code in my function.php file, which is not working, can anyone mention where is the error, thanks
function load_myfiles() { // load external file
wp_deregister_script( 'jquery' );
wp_register_script( 'jquery', get_template_directory_uri() . '/js/jquery-1.11.1.min.js' );
wp_register_script( 'bootstrap-js', get_template_directory_uri() . '/js/bootstrap.js' );
wp_enqueue_script('jquery'); // enqueue the external file
wp_enqueue_script('bootstrap-js'); // enqueue the external file
}
add_action( 'wp_enqueue_scripts', 'load_myfiles' );
I am creating a wordpress childtheme. I have style.css in the childtheme and I am using this:
wp_enqueue_style( 'parent-style-bob', get_template_directory_uri() . '/style.css' ); to bring in the style.css from the parent - 2016 in this case. This is working fine as far as I can tell.
I now want to add a separate responsive css style sheet that is AFTER my childtheme/style.css (for development purposes)
If I add this to my function wp_enqueue_style( 'responsive-bob', get_stylesheet_uri() . '/styles-responsive.css' ); it comes in BEFORE my childthemes css file.
How do i get the order right please?
Here's the whole function:
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style-bob', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'responsive-bob', get_stylesheet_uri() . '/styles-responsive.css' );
}
You can "wait" for the child style to load and then load your stylesheet, ie, make your stylesheet dependant on the child style. The child style handle will be twentysixteen-style
You can do the following
wp_enqueue_style( 'responsive-bob', get_stylesheet_directory_uri() . '/styles-responsive.css', array( 'twentysixteen-style) );
I'm trying to convert HTML static website to WordPress. I'm stuck at the very beginning, where I need to load all my styles from css folder in my function.php
<?php
// Loading styles
add_action( 'wp_enqueue_scripts', 'load_styles' );
function load_styles() {
wp_enqueue_style( 'animate', get_template_directory_uri() . '/css/animate.css' );
wp_enqueue_style( 'font-awesome', get_template_directory_uri() . '/css/font-awesome.css' );
wp_enqueue_style( 'font-awesome2', get_template_directory_uri() . '/css/font-awesome2.css' );
wp_enqueue_style( 'framework', get_template_directory_uri() . '/css/framework.css' );
wp_enqueue_style( 'owl', get_template_directory_uri() . '/css/owl.theme.css' );
wp_enqueue_style( 'style', get_template_directory_uri() . 'style.css' );
}
?>
Here are all my files located in the following directory:
And then I'm trying to inspect element in Google Chrome I got a bunch of errors that are saying the same thing: Failed to load resource: the server responded with a status of 404 (Not Found)
In my header.php I'm calling <?php wp_head(); ?> right before the </head> TAG. In my index.php file I'm calling <?php get_header(); ?>
I tried to move add_action( 'wp_enqueue_scripts', 'load_styles' ); to the bottom;
I tried to set permissions for my folders in Filezilla to 777;
I tried to use get_stylesheet_uri() instead of get_template_directory_uri();
And I don't know what I supposed to do next.
You've probably already figured this out but it looks like you missed /css/ before your style.css
It should look something like this:
wp_enqueue_style( 'style', get_template_directory_uri() . '/css/style.css' );