WordPress.org

Ready to get started?Download WordPress

Forums

How to make child theme NOT load native style.css? (8 posts)

  1. acrobatlegend
    Member
    Posted 9 months ago #

    Is there a way to make a child theme NOT load the original style.css?

    For example, in twentytwelve, I would like to take twentytwelve/style.css and copy the whole thing to twentytwelve-child/style.css. Then, I can have the whole thing in front of me and edit it in my child directory. This is what I am currently doing, but I understand that wordpress loads first the original stylesheet and then the child stylesheet. I would like to avoid loading an extra style sheet to keep things simpler and faster.

    Is what I am saying possible? Thanks =)

  2. Andrew
    Forum Moderator
    Posted 9 months ago #

    You can just avoid using the '@import' line. Child Theme style.css files don't have to import the parent theme's styles in.

  3. leejosepho
    Member
    Posted 9 months ago #

    Just be sure to add the Template: twentytwelve line.

  4. acrobatlegend
    Member
    Posted 8 months ago #

    ohhh that makes things much better! Thanks guys. =D

  5. acrobatlegend
    Member
    Posted 8 months ago #

    Is there any way to test how fast loading time is with @import and without?

  6. leejosepho
    Member
    Posted 8 months ago #

    From what I have read, the speed difference is negligible. However, it is certainly more efficient to only have one sheet being called, and there are at least some things that cannot be done when @import is used.

  7. Andrew
    Forum Moderator
    Posted 8 months ago #

    I don't know if you can accurately test that, you'd have to have very controlled conditions.

    Not using the @import line is going to be faster though, as one less HTTP request is used.

  8. leejosepho
    Member
    Posted 8 months ago #

    @webdizajn: More sites than you might believe mix LINK and @import: wordpress.com, nytimes.com, about.com, and adobe.com to name a few. It’s true that if you only have one stylesheet, using @import is the same as LINK. But if you have more than one stylesheet, loading them with multiple @import rules within another stylesheet can lead to blocking in the same way as the (newly added) Many Links example demonstrates.

    @Antti, DaveM, and Josh: I just updated the post with the LINK with @imports example to show how using @import from within a LINKed stylesheet adds one more roundtrip to the overall page load time, and may hinder progressive rendering.

    http://www.stevesouders.com/blog/2009/04/09/dont-use-import/#comment-529

    https://www.google.com/search?q=should+not+be+using+%40import

Reply

You must log in to post.

About this Topic