Inline JavaScript In Head Wordpress Plugin - Rating, Reviews, Demo & Download

Inline JavaScript In Head Wordpress Plugin - Rating, Reviews, Demo & Download
No ratings yet
Free
Follow for free plugins, new theme releases and theme news

Plugin Description

In some cases you cannot wait for a JavaScript file to load, even if it is placed early in the <head> section of your template. You can benefit from better performance, if you place the JavaScript code directly inside a <script> tag into the header. This is where this plugin comes in: It provides a filter inline_javascript_in_head_handles, which takes JavaScript handles, dequeues those scripts and echos their code content inline into the head section instead of linking them via a script tag.

Please beware that placing lots of JavaScript code inline in the <head> section can be critical. First you lose caching benefits and second the general document size can increase easily. A general rule of thumb is that you should only consider JavaScript files for inline placement, which are critical and which have a file size lower than ~500 Bytes.

Example

`

add_action( ‘wp_enqueue_scripts’, ‘my_scripts’ );
function my_scripts() {
// Some critical script is enqueued
wp_enqueue_script( ‘js-detection’, get_template_directory_uri() . ‘/js/js-detection.js’ );
}

/**
* Define JavaScript handles to be echoed inline in the html head section via Inline JavaScript in Head plugin.
*/
add_filter( ‘inline_javascript_in_head_handles’, ‘my_inline_javascript_in_head_handles’, -20 );
function my_inline_javascript_in_head_handles( $handles ) {
$scripts = [ ‘js-detection’ ];

return array_merge( $handles, $scripts );

}
`

Screenshots

No screenshots provided


Reviews & Comments