- This topic has 3 replies, 2 voices, and was last updated 11 months, 3 weeks ago by
David.
-
AuthorPosts
-
April 22, 2020 at 5:00 pm #1250104
Dean
Hi a;;,
I have a custom style sheet (dogwatch.css) that I want to appear after all other css. I am using a standard GPP theme, not a child/parent theme set up. I can get my custom stylesheet to appear using the snippets plugin, with this line of code in a snippet, with the snippet priority input set to ’10’:
wp_enqueue_style( 'dogwatch', get_template_directory_uri() . '/dogwatch.css',array(),'1.1','all');
In this case the dogwatch stylesheet shows up on line 31:
<link rel='stylesheet' id='dogwatch-css' href='https://dwdev.local/wp-content/themes/generatepress/dogwatch.css?ver=1.1' type='text/css' media='all' />
and the theme stylesheet shows up on line 52:
<link rel='stylesheet' id='generate-style-css' href='https://dwdev.local/wp-content/themes/generatepress/style.min.css?ver=2.4.2' type='text/css' media='all' />
Changing the snippet priority (0, 10, 99 etc) doesn’t alter the order.
If I change my snippet to wrap it inside a function it now comes after the theme css, BUT it’s at the bottom of the main page (inside the
<body>
element):add_action( 'wp_head','dw_custom_css' ); function dw_custom_css() { wp_enqueue_style( 'dogwatch', get_template_directory_uri() . '/dogwatch.css'); }
I thought that specifying
wp_head
as theadd_action
parameter would place my css into the<head>
, so I wonder why it didn’t do that?I tried using a GPP hook element to do this, again specifying
wp_head
and tickingexecute php
but this broke my site so I guess I don’t understand how hooks are supposed to work.My question is (finally!) – how do I inject my custom css into the header of my site and make sure it appears after the theme css?
My website is not live currently and I’m using local by flywheel to provide a “live link” URL – not sure how permanent the URL will be so please let me know if you need me to refresh it.
Cheers
DeanApril 23, 2020 at 4:40 am #1250988David
StaffCustomer SupportHi there,
try this method:
add_action( 'wp_enqueue_scripts', function() { // Add your wp_enqueue_style here }, 999 );
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/April 23, 2020 at 4:03 pm #1252294Dean
Brilliant! That worked, thank you.
April 24, 2020 at 1:16 am #1252759David
StaffCustomer SupportYou’re welcome
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.