0

Since the google speed insights report suggests adding a

< link rel="preload" href="/lity.css" as="style" />

to speed up the loading of the following resources

https://www.myoutlet.lt/wp-content/plugins/gdpr-cookie-compliance/dist/styles/lity.css

on the website https://www.myoutlet.lt

The website is based on the Avada theme.

I am wondering how could I possibly achieve that!

More concretely, I've thrown a glance to the header.php file of both the main and the child theme, but since they are coded in PHP I can't really figure out on my own how to add any HTML to it.

There should be for sure a way to inject HTML into the webpage by means of recurring to some php-function in the header.php file. As a junior SEO I acquired some technical understanding, but I'm very far from being a developer.

The one who will show me the way will earn my eternal gratitude! Thank you very much in advance for any valuable hint.

May the force be with you, Roman

P.S.: I have to achieve this manually, without any plugins (the website is already quite slow on itself!)

Improve this question
1

The hook you're looking for is wp_head.

functions.php

add_action( 'wp_head', 'se343581_add_preload_tag', 5);
function se343581_add_preload_tag()
{
    echo '<link rel="preload" href="'. 
         plugins_url('/gdpr-cookie-compliance/dist/styles/lity.css') .
         '" as="style">';
    //
    // -- if added in plugin file --
    // echo '<link rel="preload" href="' . plugin_dir_url( __FILE__ ) . 'some_subdir/file_name.css" as="style">';
}
Improve this answer
8
  • Let's be a little bit more precise, please. To which file should I add the snippet you posted? functions.php or rather header.php? Will this alone do the job or have I to add anything else elsewhere? – Roman Jul 24 '19 at 13:32
  • I've tried to do what you told me in the header.php file, but it did not work out! I need a more descriptive intro.. not all of us are born programmers x) – Roman Jul 24 '19 at 13:43
  • You can add this code to functions.php or to plugin main file. – nmr Jul 24 '19 at 13:46
  • I have to perform this workaround through the functions.php ; so, let's get clear on it: I have added this snippet to the very bottom of the functions.php add_action( 'wp_head', 'se343581_add_preload_tag', 5); function se343581_add_preload_tag() { echo '<link rel="preload" href="/lity.css" as="style">'; } – Roman Jul 24 '19 at 13:54
  • And it is still not working. Where can I define the path you posted, namely home_url('wp-content/plugins/gdpr-cookie-compliance/dist/styles/lity.css') ... I can HTML/CSS but not PHP – Roman Jul 24 '19 at 13:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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