I am using the Twitter Bootstrap theme with WordPress for my site. My problem is that I want to make a custom navbar menu for my site and don’t want to use the bootstrap default menu. Thats why I created a custom menu, but now my problem is that I don’t know where to add my css files. I have added them into wordpress/wp-content/themes/the-bootstrap/css/
but I don’t know where or how to call them in header.php
or in function.php
.
There are already 2 CSS files in wordpress/wp-content/themes/the-bootstrap/css
which are:
bootstrap.css
and bootstrap.min.css
.
Here are my 4 css files which I want to include:
<link rel="stylesheet" href="css/base.css" type="text/css" charset="utf-8">
<link rel="stylesheet" href="css/mac.css" type="text/css" charset="utf-8">
<link rel="stylesheet" href="css/nav.css" type="text/css" charset="utf-8">
<link rel="stylesheet" href="css/productbrowser.css" type="text/css" charset="utf-8">
If you want to call them in your
header.php
you will need to get the full url to the css file. You can useget_template_directory_uri()
to do so:You could put them in
header.php
, but that’s technically wrong.You should include them either in the theme functions or a custom plugin using the WordPress
wp_register_style()
andwp_enqueue_style()
functions so that if any other sources uses these same files, they’re only included once.wp_register_style() documentation
wp_enqueue_style() documentation
Here’s an example.
In your header.php
Not exactly an answer to your question, but can you combine any of those stylesheets into one file? Calling that many separate files slows down page load times.
1- Put this in your template(yourtheme/something.php):
2- Go to yourmain css file (yourtheme/style.css) and put:
this will include any style.css you want.