CODEWITHSUNDEEP
csswordpress
phpNoob
phpNoob

Reputation: 249

style.css not applying on wordpress theme?


I am having this problem where style.css is not being applied to Wordpress theme.
Please note that I have copied my custom stylesheet replacing the default one. So when I inspect element no css is appearing in developer tools. What could be causing this?
I am using Twentyseventeen theme.

Edit:Found the solution actually I was replacing the entire header with my custom header code due to which wp_head() was overwritten which I suppose calls all the css and js in header.

Upvotes: 1

Views: 5873

Answers (4)

Lakshmi G
Lakshmi G

Reputation: 1

You should not replace entire wp header with your custom header. You can place your custom header related css and js files etc. before wp_head() hook being called. And also check the below things.

1. Check weather the below line of code is there or not in your theme function.php file

// Theme stylesheet.

wp_enqueue_style( 'twentyseventeen-style', get_stylesheet_uri() );

2. Check the your theme stylesheet is having comment section or not. It should be like the below..

/* Theme Name: Twenty Seventeen Theme URI: https://wordpress.org/themes/twentyseventeen/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Seventeen brings your site to life with header video and immersive featured images. With a focus on business sites, it features multiple sections on the front page as well as widgets, navigation and social menus, a logo, and more. Personalize its asymmetrical grid with a custom color scheme and showcase your multimedia content with post formats. Our default theme for 2017 works great in many languages, for any abilities, and on any device.
Version: 1.1 License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentyseventeen Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready This theme, like WordPress, is licensed under the GPL. Use it to make something cool, have fun, and share what you've learned with others.
*/

Upvotes: 0

Phill Healey
Phill Healey

Reputation: 3180

You shouldn't replace the themes CSS file or add CSS to the included CSS file(S) for the following reasons:

  1. WordPress uses the default style.css file purely for getting info about the theme
  2. The file will get overwritten by any theme updates

However, you should create your own css file and then tell WordPress to load that file. You can do this by adding the following code to your *theme's functions file or by creating a custom plugin for doing any customisations such as this.

For example:

wp_enqueue_style( 'style', get_stylesheet_uri() );

*Note any customisations added to a themes functions file would also get overridden by any updates to the theme.

More info here:https://developer.wordpress.org/themes/basics/including-css-javascript/

Upvotes: 1

phpNoob
phpNoob

Reputation: 249

Found the solution actually I was replacing the entire header with my custom header code due to which wp_head() was overwritten which I suppose calls all the css and js in header.

Upvotes: -1

Ptrckk
Ptrckk

Reputation: 66

You should not replace the CSS file. When updating the theme, it will get replaced with the original and you will lose your customizations.

What you should do is creating a child theme. In a child theme you can make your customizations, without any trouble when updating the default theme.

See: https://codex.wordpress.org/Child_Themes

Edit: Since a previous version of Wordpress there is the possibility to add custom CSS to a theme. But I'm not sure how reliable this will be in the future. You can try it, but I still recommend a child theme.

If you want to use the build-in function of Wordpress take a look here: http://www.wpbeginner.com/plugins/how-to-easily-add-custom-css-to-your-wordpress-site/

Upvotes: 1

Related Questions