ThemeShaper Forums » Thematic

Pros & Cons of modifying style.css versus (a copy of) default.css?

(5 posts)
  • Started 4 years ago by puffmoike
  • Latest reply from sober
  • This topic is resolved

Tags:

  1. puffmoike
    Member

    In the comments in style.css Ian has written:

    It's better to actually copy over default.css into this file (or link to a copy in your child theme) if you're going to do anything outrageous.

    Firstly, is there an implicit suggestion that one would then edit default.css?

    And secondly what 'outrageous' circumstances is Ian envisaging? Might 'outrageous' simply mean anything more than just changing a background colour here and there?

    More generally, what are the consequences of making changes in style.css versus modifying a copy of default.css? Both now, and down the track when either Thematic or WP are updated.

    As somebody who is new to WordPress and Themeshaper (and not an expert in CSS by any stretch) it seems easier to make modifications to a copy of default.css than it is to write new code into style.css.

    For instance, I wanted to change the shade of blue used for link colours in just the body text:

    • When I changed the #HEX value Ian defined for a:link in default.css I achieved my desired result.
    • However if I copied the CSS code for a:link from default.css into style.css and then changed the value lots of links in places other than the body text also inherited the colour change. It had the undesirable effect of overriding Ian’s carefully created CSS hierarchy.

    Obviously there are ways to code around this particular problem, but I’m left wondering which approach will be the most efficient over time. Am I creating a whole lot of pain for myself in the future if I modify a copy of default.css?

    Any thoughts, suggestions, or directions towards existing info greatly appreciated,
    Michael

    Posted 4 years ago #
  2. puffmoike
    Member

    Anybody? Please.

    What are the consequences of modifying a copy of default.css versus adding to style.css?

    Posted 4 years ago #
  3. puffmoike-

    I'm not sure I'd consider that there would be consequences to

    modifying a copy of default.css versus adding to style.css

    as much as there would be workflow differences.

    Staring at the beginning, I'll try and give you my point of view on your questions.

    1. I think the implication is to make all changes to css in the child theme directory. So if your going to use and edit the default.css then you're going to need to make the changes local to your child theme directory.
    2. I can't speak for Ian but I interpret his statement to mean -> It's going to be simpler and more efficient to design and debug child styles by putting as much of the code as possible into the style.css. Simpler because debugging the cascade across 2 stylesheets can get complicated and more efficient because whats the sense in @import-ing the default.css and then proceeding to rewrite a big chunk of the code you just imported.
    3. As for the general question of 'what are the consequences' if Thematic or WP are updated down the road. As long as you make your changes in your child theme directory then upgrading the Thematic Theme will not risk destroying any of your child theme's files.
    4. If you upgrade your WordPress install it depends on how you go about it… http://codex.wordpress.org/Upgrading_WordPress
      1. Using the auto-upgrader in WP admin is non-destructive to theme files. Although you should first backup backup of wp-config.php file , wp-content directory and database just in case something unexpected happens.
      2. If you manually upgrade WordPress and overwrite the wp-content directory all bets are off and you've just screwed the pooch.
        If you're new to WordPress and you have to do a manual upgrade first implement your backup routine and read the codex documentation thoroughly before upgrading.
        If WordPress gets updated and you have successfully upgraded there is always the possibility that changes to the WP core will affect your third-party plugins and/or thematic and thus impact your child theme.
    5. It sounds like you've got an understanding for how css works and your creating your child theme in the right manner. Beyond that you've got to weigh your understanding of these concepts against what the simplest and most efficient method is for you to accomplish your goals.

      For example: My approach to styling a Thematic child theme:

        Design Compartmentally.

        1. Use @imports for Thematic's reset.css, typography.css, images.css, and a "layout" .css
        2. Copy over the default .css to my style.css and make a child local copy of the plugins.css Design and debug to get the desired look editing these two files only
        Deploy Efficiently : When I'm done with the design I'll…

        1. Review whether my changes have drastically rewritten any of the @imported stylesheets
        2. If they have then i'll remove the @import and check for default settings I might be missing from those stylesheets and add them to my style.css where necessary
        3. In the end I'll likely end only having @imports for Thematic's reset.css and typography.css and for my child local plugins.css because I will have merged the default and layout styles into my style.css.
          For a personal site design that I was maintaining I'd even fold the reset.css and typography.css in as well.

      This works for me. By efficiency, I mean to try and reduce the # of http requests to as few as possible while respecting the flexibility and modularity that the design and maintenance of the design require.

      My answer is that there is no best practice that suits all cases for everybody all the time.
      Finding the workflow that works for you is key.

      Good Luck- Gene

    Posted 4 years ago #
  4. puffmoike
    Member

    Gene,

    That is a brilliant response. You've taken the core of my question and explored it in a fashion that has probably saved me making numerous follow-up questions. It's a great insight into how somebody who really understands what is going on would go about coding.

    On first read your process and explanations make perfect sense. I'm going to mull over them, but I suspect my workflow will start looking a whole lot like yours...

    Thank you very much.

    Posted 4 years ago #
  5. sober
    Member

    I have no option but to admit that "eh hr" has nothing less than an encyclopedic knowledge about thematic and child themes. He has always been a help to me also.

    Posted 4 years ago #

RSS feed for this topic

Reply

You must log in to post.