Add custom.css and or font with code or header link. Best practice?

[dev]

I know some folks say that a custom.css is not needed with Genesis child themes, but we use them anyway for reasons too involved to discuss here.

We have always used the link in the Genesis Theme Options "header" box:

<link rel='stylesheet' id='optimal-theme-css'  href='http://xxxxxx/custom.css?ver=1.0.0' type='text/css' media='all' />

but I'm now seeing people suggesting we use code in functions.php like this:

add_action( 'wp_enqueue_scripts', 'maj_load_custom_css' );
function maj_load_custom_css() {
    wp_enqueue_style( 
        'custom-css', 
        CHILD_URL . '/custom.css', 
        array(), 
        PARENT_THEME_VERSION 
    );
}

Is one way any more efficient than the other? What is the 'best practice' now.

Same kind of question for adding Google fonts. It used to be a link in 'header' and now its code? How come?

Thanks.

Dev

[Sridhar Katakam]

I think enqueueing is the way to go whether it is custom css or Google fonts.

---

Genesis Tutorials | Follow me on Twitter

[dev]

Thanks, but can you give me some technical reason for why you think enqueueing is more efficient than the "link" method?

Dev

[Sridhar Katakam]

You may find the answer in http://code.tutsplus.com/articles/how-to-include-javascript-and-css-in-your-wordpress-themes-and-plugins--wp-24321. Scroll down to "So, Why Doesn't Everyone Already Do Things This Way?" section.

---

Genesis Tutorials | Follow me on Twitter

[dev]

Thanks. The code method works fine for both .css and fonts. I'll do it this way from now on.

[Author]

Posts