Recently, I had to add some custom CSS to a certain page and I found it useful to share how to do it with and without plugins.
There are many ways to conditionally enqueue a stylesheet to a certain page or post. I’ll explain how to do that by using a simple plugin and by writing a snippet for the people who want to do their stuff without plugins.
Add Custom CSS to a Page or Post using a Plugin
I’ve found this super easy plugin, WP Add Custom CSS. You can use it to add custom CSS to the whole website. Also, you can use it to add conditional styles to individual posts, pages, and custom post types.
Once installed and activated, you will find a custom CSS box added to your dashboard when you edit any of your posts or pages.
Add Custom CSS to a Page or Post Without Plugins
First, you will need to add your custom CSS to a
.css file. Preferrably in a child theme. In the following example, I added the custom CSS to
Then, I used this snippet in my child theme’s
functions.php file. You’ll need to change PAGE_ID to your actual page ID or page name.
Again, you can replace
is_page() with your desired conditional tag. For posts, you can use
is_single(). For a specific page template, you can use something like
is_page_template( 'templates/about.php' ) and so on.
I hope you find this useful. If you have any feedback please feel free to use the comments section below. Thanks for reading!