I'm almost done creating my own wordpress theme and it will be my first theme that I'll be submitting to wordpress.org

I have used internal CSS in many pages because the styling is used for a particular post type. Is internal CSS allowed while developing a theme for wordpress? Or is there a strict rule that all the style must be a part of an external stylesheet only?

  • 3
    Never hard code scripts or style directly in templates. They are messy and a nightmare to remove/override with a plugin or child theme. Load styles and scripts conditionally or make use of the build in post class functionality. – Pieter Goosen Oct 14 '15 at 13:17
up vote 3 down vote accepted

This will not work when submitting your theme to wordpress.org, and this is one of the first things the theme reviewer will tell you to fix (I'm not even sure if these styles will pass the Theme Check test).

For every CSS style, fonts, additional scripts, etc., before sending your theme to wordpress.org for a review, you will have to enqueue these in your theme to pass the review. No exceptions.

what do you mean by internal? do you mean in the header? If it's in the header then you should be fine but it depends on how you add to the header.

What you would ideally be doing is adding it to the wp_head using the wp_head filter e.g.

function mytheme_styles() {
 // stuff here
}
add_filter('wp_head', 'mytheme_styles');

Do the check for the post type in there (using the WP conditionals) and you should be ok.

Another way is to have another CSS file which is enqueued when only on that posttype but would only use this way if the css is quite large.

Finally, you could also add it to the normal CSS file as WP does (or can) output the posttype into the body class, so you can do .posttype-name .element in the css.

I personally prefer putting it into the css files but it's down to how much css you are using.

  • By internal CSS, I mean within the PHP files, for example in the single.php file, I write CSS using <style></style> – Siddharth Thevaril Oct 14 '15 at 11:21
  • 1
    You should be adding it to the wp_head in a filter, I can't remember where I read it but you should never be hard coding <style> into a theme. – Gareth Gillman Oct 14 '15 at 11:28
  • For wordpress.org, only enqueue is allowed. – Bruno Kos Oct 14 '15 at 17:13

If you use body_class you can add plenty of handlers to the body tag, so you can direct css aimed at specific post types directly in your style.css file.

If there is a lot of css for that post type and you would like to keep it separate, put it in a css-file and enqueue it conditionally like this:

if ('books' == get_post_type()) 
  wp_enqueue_style ('books-style', get_template_directory_uri() . '/books-style.css');

Finally if it is just a snippet and you still don't want it in style.css there's wp_add_inline_style which you would use like this:

$tyle = '.books H1 {background:black;}';
wp_add_inline_style ('main-style', $style);

Where main-style is the handle attached to your style.css file

Your Answer

 
discard

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.