Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialDavid Warren
1,803 PointsTrouble adding a CSS link in Wordpress
Hello, Ok. So I am beginning to feel like a real idiot. No matter how I try to link my css page to my header, it will not work. I need help.
This is where my file is in my fireftp: "/public_html/mbtlive/wp-content/themes/canvas/roll.css"
And I'm trying to use this code, added in the header.php file in wordpress to link the front end of my website to the stylesheet.
<?php
add_action( 'wp_enqueue_scripts', 'safely_add_stylesheet' );
/**
* Add stylesheet to the page
*/
function safely_add_stylesheet() {
wp_enqueue_style( 'prefix-style', plugins_url('style.css', __FILE__) );
}
?>
Would someone walk me through this, please. :)
Thanks!
5 Answers
Abhay Sharma
8,287 PointsHello David, You'll have to use this code in functions.php file not the header.php file. also in
function safely_add_stylesheet() {
wp_enqueue_style( 'prefix-style', plugins_url('style.css', __FILE__) );
}
You will use
function safely_add_stylesheet() {
wp_enqueue_scripts( 'prefix-style', plugins_url('style.css', __FILE__) );
}
Hope this helps !
Abhay Sharma
8,287 Pointsdid you added
add_action( 'wp_enqueue_scripts', 'safely_add_stylesheet' );
after ? So in full it will be
function safely_add_stylesheet() {
wp_enqueue_scripts( 'prefix-style', 'style.css', get_template_directory_uri().'/roll.css');
}
add_action( 'wp_enqueue_scripts', 'safely_add_stylesheet' );
David Warren
1,803 PointsOh Duh! I should've figured that out. Thanks!
David Warren
1,803 PointsOk. I added the code below to my functions.php, and got a 500 internal error.
function safely_add_stylesheet() {
wp_enqueue_scripts( 'prefix-style', 'style.css', get_template_directory_uri().'/roll.css');
}
add_action( 'wp_enqueue_scripts', 'safely_add_stylesheet' );
So I changed it to this:
function safely_add_stylesheet() {
wp_enqueue_scripts( 'prefix-style', 'style.css', get_template_directory_uri().'/roll.css');
}
add_action( 'wp_enqueue_scripts', 'safely_add_stylesheet()' );
and I got this reply: Warning: call_user_func_array() [function.call-user-func-array]: First argument is expected to be a valid callback, 'safely_add_stylesheet()' was given in /home/andrew/public_html/mbtlive/wp-includes/plugin.php on line 406
Abhay Sharma
8,287 PointsMy bad I didn't noticed the 'style.css' you had try the below code:
function safely_add_stylesheet() {
wp_enqueue_scripts( 'prefix-style', get_template_directory_uri().'/roll.css');
}
add_action( 'wp_enqueue_scripts', 'safely_add_stylesheet' );
David Warren
1,803 PointsI'm still getting that internal error. :(
P.S. Thanks for the help. I'm out of my depth here. I've kept trying to avoid using an extra stylesheet, but at this point its become pivotal.
Abhay Sharma
8,287 PointsWell it takes few more things to make it work.
- Your header.php file must have wp_head(); before the </head>
- You should still have a style.css included to your theme with the comments about the theme name etc.
David Warren
1,803 PointsI've checked both of those.
When I use this script, I get an internal error 500 message over the whole front end of my site.
function safely_add_stylesheet() {
wp_enqueue_scripts( 'prefix-style', get_template_directory_uri().'/roll.css');
}
add_action( 'wp_enqueue_scripts', 'safely_add_stylesheet' );
Any other ideas?
David Warren
1,803 PointsI know this is wrong, or at least untidy. It might give me problems in the future. But for now... it works.
This is what I did.
function roll_css() {
echo '<link rel="stylesheet" type="text/css" href="http://mbtlive.mybooktherapy.com/wp-content/themes/canvas/roll.css">';
}
add_action( 'wp_head', 'roll_css' );
Abhay Sharma
8,287 PointsIt's a make an error day for me, There was another problem with it try the below code
function safely_add_stylesheet() {
wp_enqueue_script( 'prefix-style', get_template_directory_uri().'/roll.css');
}
add_action( 'wp_enqueue_script', 'safely_add_stylesheet' );
the function is wp_enqueue_script not scripts .
David Warren
1,803 PointsThat took care of the internal error! (Nice catch)
However, now the page is no different, no matter the css I write in the roll.css (I.E. I'm pretty sure the stylesheet isn't making it all the way to the page.)
Do I need to put the wp_enqueue_script() hook somewhere?
What would that look like?
Abhay Sharma
8,287 Pointstry view source in browser to see if the file is included properly. Also if you are overwriting any styles from another file then it should be included after that file.
Zac Gordon
Treehouse Guest TeacherTry using an underline _ instead of - in the handle
Zac Gordon
Treehouse Guest TeacherAlso, is roll.css in a sub folder or your main directory? Sorry if you already answered that!
David Warren
1,803 PointsDavid Warren
1,803 PointsThanks, that's a start...
But you're dealing with a real dunderhead. How do I code the "FILE"?
Abhay Sharma
8,287 PointsAbhay Sharma
8,287 PointsCheck in your theme wp-content/YOUR THEME folder if you already have a functions.php file. If not then you can create one in Sublime Text or any text editor you are using and add your code and save it as functions.php
Abhay Sharma
8,287 PointsAbhay Sharma
8,287 PointsI guess I misunderstood your above question, here what you will replace plugins_url('style.css', FILE) with
David Warren
1,803 PointsDavid Warren
1,803 PointsThanks! I really appreciate your help! That is exactly what I needed.
David Warren
1,803 PointsDavid Warren
1,803 PointsHmm... so I added that below code into my functions.php, and it didn't take.
Any idea what went wrong?