0

There are several posts similar to this problem, but I need to still ask for help...

The need is to change the column heading for posts if the Archived Posts page is selected in the menu (normally 'Highlighted Posts' is displayed in the heading.)

This is illustrated in this screen shot; note the only difference is the text in the ::before::after element: Befor-After comparison

Here is the code in my child theme functions.php file:

function register_arch_posts_stylesheet() {
    wp_register_style( 'arch-post-stylesheet', get_stylesheet_directory_uri() . '/arch-post-stylesheet.css' );
}

add_action( 'init', 'register_arch_posts_stylesheet' );
function arch_posts_conditionally_enqueue_the_stylesheet() {
    // only enqueue on archived-posts page 
    if ( is_page( 'archived-posts' ) ) {
        wp_enqueue_style( 'arch-post-stylesheet' );
    }
}

add_action( 'wp_enqueue_scripts', 'arch_posts_conditionally_enqueue_the_stylesheet' );

And here is CSS in file arch-post-stylesheet.css:

.coolwp-posts-heading::after {
        content: "Archived Posts";    
}

But when I load the Archived Posts page, nothing happens; how can I verify the stylesheet is loading, and if loading, that the CSS is working? TIA....

3
  • "how can I verify the stylesheet is loading" - look in your browser debug tools Source or Network tabs. (You'll need to refresh the page if the Network tab is empty.)
    – Rup
    May 31, 2021 at 23:03
  • However I'd look for a way to conditionally change the text you're generating in the template. I'd expect there's a hook for it.
    – Rup
    May 31, 2021 at 23:04
  • You can't change that text with CSS. ::before and ::after would only let you add text before or after that text. To change this text you need to edit the template. Jun 1, 2021 at 3:49

1 Answer 1

0

If you want to load something on the archive page than, You should use is_archive() rather than is_page( 'archived-posts' ), and after that, you can use the keyboard command Ctrl + u to check view source of chrome. Thereafter, use command Ctrl + f to search 'arch-post-stylesheet'css handle' (Don't forget to remove quotes while searching).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.