Theme CSS

Theme’s CSS code is divided into a few files, loaded in order specified. All these files are in css catalog. You have to remember that order of these files is very important and its change may cause unpredictable changes of theme’s look because of using moving from general styling to detailed styling in CSS code.

The list of CSS files used in a theme is presented below (order according to recommended order of loading these files):

  1. normalize.css – CSS code unifying page’s elements styling in all browsers
  2. template.css – the most important CSS file responsible for page’s layout styling , basic typography, widget styling, etc.
  3. wp.css – CSS rules which are responsible for WordPress elements styling, e.g. a comments form , comments themselves or posts elements.
  4. shortcodes.*.css (optional) – a group of CSS files responsible for typography elements styling inserting to posts with Shortcodes.
  5. stuff.css – it includes styling of additional theme’s elements sucha s breadcrumbs or font-size switcher.
  6. wp.extensions.css – CSS rules connected with styling of standard widgets available with WordPress.
  7. extensions.css (optional) – a CSS file which you have to add yourself in the case when you want to style additional widgets. In the case of small changes in widget styling, we recommend to use override.css file instead of this file.
  8. tablet.css – CSS rules used while displaying a page on tablet devices.
  9. mobile.css – CSS rules used while displaying  a page on smartfon devices.
  10. ie*.css – a file or a group of CSS files used for correcting page’s look in an Internet Explorer browser.
  11. style*.css – a file or a group of CSS files used for changing coloring or general style of a theme – they are loaded automatically by a mechanism responsible for theme’s coloring.
  12. error.css – CSS rules used while displaying a error page.
  13. rtl.css –  CSS rules for language written in a Right-To-Left (RTL) direction.
  14. font-awesome.css – The full suite of Retina ready pictographic icons, e.g. for widget titles.
  15. override.css (optional) – you may add your own rules in this file which will overwrite existing rules in previous files – a perfect solution for theme modification without modifying the remaining CSS files.

Additionally, CSS code used in a theme itself, you will also find in a templates catalog where there are CSS files loaded on chosen styles of subpages, e.g. needed for correct work of a gallery.

Leave a Comment

Your email address will not be published.