1

I need unregister this enqueue style of wp_footer() hook and add it to the top of site with hook wp_head(), this is possible?

I'm optimizing my theme to validate in W3C, and one of the requirements of W3C is that all styles are within the tag <head></head>... I am using an specific plugin called Crayon Syntax Highlighter, and this plugin are inserting a style at the bottom of the page (probably using wp_footer() hook).

The name/id of script is crayon: enter image description here

I've tryed all this functions but no success:

wp_deregister_style( 'crayon' );
wp_dequeue_style( 'crayon' );
remove_action( 'wp_enqueue_style' , 'crayon' , 10 );

wp_deregister_style( 'crayon-css' );
wp_dequeue_style( 'crayon-css' );
remove_action( 'wp_enqueue_style' , 'crayon-css' , 10 );
Improve this question

2 Answers 2

Reset to default
3

If you look at the source code, you can see that wp_enqueue_style( 'crayon' ) is called in Crayon::enqueue_resources() which itself is called either from either Crayon::the_content() or Crayon::wp_head(). The code in Crayon::wp_head is:

if (!CrayonGlobalSettings::val(CrayonSettings::EFFICIENT_ENQUEUE) || CrayonGlobalSettings::val(CrayonSettings::TAG_EDITOR_FRONT)) {
  CrayonLog::debug('head: force enqueue');
  // Efficient enqueuing disabled, always load despite enqueuing or not in the_post
  self::enqueue_resources();
}

Which will enqueue the style only when certain settings are enabled. Otherwise, the style will only be enqueued from the_content filter which fires after wp_head has already been output.

So your two options are:

  1. Have the CSS enqueued on all pages in the header
  2. Have the CSS enqueued only on necessary pages but in the footer
Improve this answer
1
  • 1
    Option 1! Thanks! On options panel, have a miscellaneous options called: ´Try loading CSS Crayon and JavaScript only when needed´, so I disable this and style back to head, thanks!
    – rafaelfndev
    Feb 2, 2018 at 22:03
1

Hmmmm.. the question is not very clear to me, if you could provide a little more info about your issue (like the specific files and scripts you need to modify) would be great. From what i understood, i'll try to help you. First, avoid plugins unless you really really need them. Now, you might be trying to move render-blocking JavaScript and CSS out of the tag, that's because when you start loading a page through your browser, the first scripts you download are those between the tag, by moving those scripts to your footer (footer.php or /public_html/wp-content/themes/yourtheme/footer.php) the Web page will start rendering all the data that needs to be visualized first, beginning from the top of the page and at last those scripts in the footer.php file. I bet Crayon Syntax Highlighter is causing the issue, just try to put this <!-- W3TC-include-js-head --> before the closing </body> tag.

If you want to use wp_enqueue_scripts look at this example

function themeslug_enqueue_style() {
    wp_enqueue_style( 'core', 'style.css', false ); 
}

function themeslug_enqueue_script() {
    wp_enqueue_script( 'my-js', 'filename.js', false );
}

add_action( 'wp_enqueue_scripts', 'themeslug_enqueue_style' );
add_action( 'wp_enqueue_scripts', 'themeslug_enqueue_script' );

I hope this helps, good luck dude. :)

Improve this answer
1
  • The solution is what the Nathan Johnson says... Thanks anyway for help!
    – rafaelfndev
    Feb 2, 2018 at 22:04

Your Answer

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

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