Styling Category Pages in News-Pro2

[achuka]

I am setting up some page templates to display different types of book posts and want to link to a different custom.css for each template (so that I can style each section of the site independently), but so far I am having trouble overriding the call to the default style.css in the child theme (tweaked from the parent StudioPress theme).

I have been trying variations on...
<link rel=”stylesheet” type=”text/css” href=”yourdomain.com/wp-content/themes/your-theme/custom.css” media=”all”/>
added to the category-specific page template...

Any advice / examples will be very gratefully received!

http://www.achuka.co.uk/blog

[Victor Font]

There are a few ways to add custom page-level style sheets. While you can use a link to connect to a style sheet, the correct way to do this in WordPress is with wp_enqueue_style. Look in your theme's functions.php for the function that loads the style sheet. If you wrap the style sheet load in a conditional:

if (is_page('999') ) {
    wp_enqueue_style(...custom_style_sheet);
} else {
    wp_enqueue_style(...normal_style_sheet);
}

Or, you can enqueue the style sheet directly in the page templates you are creating.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[achuka]

Thanks Victor.

In this (News Pro) theme, the regular stylesheet is not called directly by functions.php

Rather, functions.php invokes lib/init.php from the parent Genesis folder

containing the line
//* Load CSS
require_once( GENESIS_CSS_DIR . '/load-styles.php' );

For obvious reasons I'm reluctant to make any changes to the parent Genesis theme and only want to customise the child theme...

I'll try adding the enqueue coding suggested above the functions.php file and see if it has an effect...

Michael

[Victor Font]

In that case, it's a little easier. This is what you use:

add_action( 'wp_enqueue_scripts', 'load_page_style' );
function load_page_style() {
    if ( is_page('999') ) {
        remove_action( 'genesis_meta', 'genesis_load_stylesheet' );
        wp_enqueue_style(...custom_style_sheet);
    }
}

What this does is remove the main genesis style sheet and load the custom style sheet for the page with ID 999. Of course you have to change the page ID or use an array of page id numbers.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[Author]

Posts