Archived topic
Disable style sheet for certain pages and posts
11 replies · Started by Marcel on November 6, 2019
Hello,
I would ask what if there is an option to disable the style sheet for certain pages and posts. I use a child theme, and I would like to use custom HTML and CSS in some pages and posts. Even I use the Simple CSS plugin on those pages and apply custom CSS, the final result is weird. I know for sure there is a solution for that, please just give me a short guide. Thank you!
Hi there,
the correct way would be to save the styles in a separate style sheet and use the wp_enqueue_scripts hook:
https://developer.wordpress.org/reference/functions/wp_enqueue_style/#comment-340
But this would require you to add a condition to where the code should be loaded.
Simplest method would be to use a Hook element and add a link to the style sheet in the WP_head for those specific pages:
<link rel="stylesheet" id="my-custom-style-sheet" href="full_url_to_my_custom_styles" type="text/css" media="all">
David, thank you! So, to understand I should create a custom CSS file and store it on my child theme folder, where function.php and style.css already exist and name it according to the example given above (my-custom-style-sheet.css)? Image attached.
And, the full URL to my-custom-style-sheet would be: my-website.com/wp-content/themes/generatepress_child/my-custom-style-sheet.css?
Thats correct accept you change the ID="my-custom-style-sheet" and the style sheet file name to whatever you like as long as it is unique.
Hello David,
Please guide me on this puzzle:
- should I put also my HTML into a Hook element and add a link to the style sheet in the WP_head for a specific page
OR
- just add a link to the style sheet in the WP_head for a specific page and put my HTML into that page (using a custom HTML Gutenberg block, for instance...)? Image here.
Thank you!
The second option
Perfect. It is working. Now, if I would to use wp_enqueue_scripts (the correct way), should I include it on my function.php or using a hook? Could I have a hypothetical snippet from your side, let say for a style sheet with the ID="my-custom-style-sheet" and adding a condition to where the code should be loaded, let say for the page with ID= 101? Thank you!
wp_enqueue_scripts would go in the function.php. Tom provides an example of conditional enqueue here:
Thank you, David. Should I first use "wp_dequeue_style" first, for better results or it is not necessary?
wp_dequeue_style is only required if you need to remove an existing style sheet. As you're adding rather then replacing it is not required.
Thank you, David!
You're welcome
