Joshua David Nelson

<p>This small plugin moves scripts to the footer. Note that this only works if you have plugins and a theme that utilizes <code>wp_enqueue_scripts</code> correctly.</p>
<p>You can disable the plugin on specific pages and posts directly via the post/page edit screen metabox.</p>
<p>You can disable the plugin on specific archive pages (blog page, search page, post type and taxonomy archives) via the settings page.</p>
<p><strong>Everything Broken?</strong> Try placing jQuery back into the header via Settings > Scripts to Footer, “Keep jQuery in the Header” checkbox. If that doesn’t work, refer to the walkthrough below for using the <code>stf_exclude_scripts</code> filter for the script that is causing the issue.</p>
<p>Check out the <a href="https://github.com/joshuadavidnelson/scripts-to-footer/wiki" rel="nofollow ugc">documentation</a> on <a href="https://github.com/joshuadavidnelson/scripts-to-footer" rel="nofollow ugc">GitHub</a> or some quick walkthroughs below.</p>
<h4>Keeping specific Scripts in the Header</h4>
<p>As of version 0.6 you can now keep specific scripts in the header. Note: this will print any scripts they depend on as well (if you want to keep <code>jquery-effects-core</code> in the header, you’ll also get <code>jQuery</code> in the header, so no need to add both).</p>
<p>Specifically for jQuery, see the settings page option, as it is a common request we’ve built it into the settings.</p>
<p>For any other scripts, use this filter:</p>
<pre><code>add_filter( 'stf_exclude_scripts', 'jdn_header_scripts', 10, 1 );
function jdn_header_scripts( $scripts ) {

    $scripts[] = 'backbone'; // Replace 'backbone' with the script slug

    return $scripts;
}
</code></pre>
<p>You will need the correct script slug, which is used when the script is registered, and the script will only be printed into the header <em>if it’s enqueued</em>. Check out the scripts that come registered <a href="https://codex.wordpress.org/Function_Reference/wp_enqueue_script#Default_Scripts_Included_and_Registered_by_WordPress" rel="nofollow ugc">out-of-the-box with WordPress</a>.</p>
<p><strong>Note:</strong> As of version 0.6.3, <a href="https://codex.wordpress.org/Conditional_Tags" rel="nofollow ugc">conditional tags</a> will work with the <code>stf_exclude_scripts</code> filter.</p>
<h4>Custom Post Type Support</h4>
<p>If you’re comfortable with code you can use the <code>scripts_to_footer_post_types</code> filter to change the post types this applies to (it only applies to pages and posts by default). For example, if you have a custom post type called “project” you could add support for this metabox via the post type filter like this:</p>
<pre><code>function stf_add_cpt_support( $post_types ) {

    $post_types[] = 'project';

    return $post_types;
}
add_filter( 'scripts_to_footer_post_types', 'stf_add_cpt_support' );
</code></pre>
<h4>Excluding Pages/Posts/Templates Via Filter</h4>
<p>You can either use the checkbox option to disable the plugin’s action on a specific page/post, or you can utilize a filter. The filter also passes the post/page id, if there is one (archive templates don’t have ids!).</p>
<p>For example, for the “page” post type:</p>
<pre><code>function stf_exclude_my_page( $exclude_page, $post_id ) {

    if ( is_front_page() ) {
        $exclude_page = 'on'; // this turns on the "exclude" option
    }

    return $exclude_page;
}
add_filter( 'stf_page', 'stf_exclude_my_page' );
</code></pre>
<p>Replace <code>stf_page</code> with <code>stf_post</code> for posts, or the slug of your custom post type. For instance, a post type called “project” can be filtered with <code>stf_project</code>.</p>
<h4>More Documentation</h4>
<p><a href="https://github.com/joshuadavidnelson/scripts-to-footer/wiki" rel="nofollow ugc">See the plugin’s wiki</a>.</p>
<h4>Development / Contributing</h4>
<p><a href="https://github.com/joshuadavidnelson/scripts-to-footer" rel="nofollow ugc">View this plugin on GitHub</a>.</p>
<h4>Support</h4>
<p>Please feel free to open a <a href="https://github.com/joshuadavidnelson/scripts-to-footer/issues" rel="nofollow ugc">Github Issue</a> to report conflicts or goto <a href="https://wordpress.org/support/plugin/scripts-to-footerphp" rel="ugc">the WP.org support forum</a>. If there is something wrong with Scripts-to-Footer, we’ll update it. However, if it’s a another plugin or theme we can only contact the developer with the issue to attempt to resolve it.</p>


Scripts To Footer

Your plugin deserves lots of love and support, added to favourite. I will make sure to recommend it as much as possible. Thank you so much dear Developer.

Reliable, I can trust, happily using since 2 months

Move your scripts to the footer to help speed up perceived page load times and improve user experience.

TechWebUX

Aleksandar Urošević

<p><strong>Head & Footer Code</strong> plugin helps you add custom code snippets (JavaScript, CSS, or HTML) to the page even if you are not a programmer. It could be within the <code><head></code> (site verification code for various services, custom styles, meta or Webfont link), right after opening <code><body></code> (pixel tracking, analytics or heatmap code) or just before closing <code></body></code> tag.</p>
<p>Go to <strong>Tools</strong> → <strong>Head & Footer Code</strong> in WordPress Dashboard. Insert custom code to HEAD, BODY or FOOTER section (depending on what you have to do).</p>
<p>All magic is done by hooking to WordPress hooks <code>wp_head</code>, <code>wp_footer</code> and <code>wp_body_open</code>.</p>
<blockquote>
<p>💡 Trial Head & Footer Code plugin on a free dummy website before you add it on your project: <a href="https://tastewp.com/new/?pre-installed-plugin-slug=head-footer-code" rel="nofollow ugc">Test It Now!</a></p>
</blockquote>
<p>Various code snippets are supported, including but not limited to:</p>
<ul>
<li>Google Analytics 4</li>
<li>Google Tag Manager</li>
<li>Google Ads Conversion</li>
<li>Lite Analytics</li>
<li>Facebook/Meta Pixel</li>
<li>Hotjar</li>
<li>FullStory</li>
<li>Google site verification</li>
<li>Bing site verification</li>
<li>Yandex site verification</li>
<li>Alexa site verification</li>
</ul>
<h3>Homepage in Blog Posts mode</h3>
<p>If your WordPress shows the latest blog posts on the homepage, you can also add specific code only for the homepage on <strong>Tools</strong> → <strong>Head & Footer Code</strong> (there will be section <strong>Head, body and footer code on Homepage in Blog Posts mode</strong>)</p>
<h3>Article specific code</h3>
<p>To insert custom code specific for individual article (post, page or custom post type), use article-specific Metabox while editing post/page/custom post type (check out <a href="https://wordpress.org/plugins/head-footer-code/#screenshots" rel="ugc">Screenshots</a>). There choose if that specific code appends to site-wide code defined on <strong>Tools</strong> → <strong>Head & Footer Code</strong>, or to replace it.</p>
<h3>Category specific code</h3>
<p>You can also define a Category specific code on each individual category.</p>
<p>Other taxonomies (tag and custom taxonomy) do not have available their specific code, but for them a Global code is used instead.</p>
<h3>Video guide</h3>
<p><iframe loading="lazy" title="Head Footer Code: How To Install, Configure and Use" width="750" height="563" src="https://www.youtube.com/embed/Gd41Dv09UC4?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></p>
<h3>Do you need our support?</h3>
<p>If <strong>Head & Footer Code</strong> does not work on your project, please let us know by <a href="https://wordpress.org/support/plugin/head-footer-code/#new-topic-0" rel="ugc">raising a new support ticket</a> in the <a href="https://wordpress.org/support/plugin/head-footer-code/" rel="ugc">Community Forum</a> and describe what does not works and how to reproduce the issue. We will make sure to resolve the issue as soon as possible.</p>
<p>If you find <strong>Head & Footer Code</strong> useful for your project, please <a href="https://wordpress.org/support/plugin/head-footer-code/reviews/#new-post" rel="ugc">review plugin</a>.</p>
<h3>Features</h3>
<ul>
<li><strong>Multisite</strong> and <strong>PHP 8.3</strong> compatible!</li>
<li>Set site-wide custom content for:
<ul>
<li>head page section (before the <code></head></code>)</li>
<li>body section (after the <code><body></code>) – <strong>Requires WordPress 5.2!</strong></li>
<li>footer page section (before the <code></body></code>)</li>
</ul>
</li>
<li>Homepage in Blog Posts mode:
<ul>
<li>set homepage specific custom code for head, body and/or footer</li>
<li>toggle homepage specific custom code on paged Homepage (page 2, 3, a nd so on)</li>
</ul>
</li>
<li>Set article specific custom code for:
<ul>
<li>head page section (before the <code></head></code>)</li>
<li>body section (after the <code><body></code>) – <strong>Requires WordPress 5.2!</strong></li>
<li>footer page section (before the <code></body></code>)</li>
</ul>
</li>
<li>Set category specific custom code for head, body and/or footer of the page</li>
<li>Choose priority of printed custom code to head/body/footer sections (lower number mean far from <code></head></code> and <code></body></code> and closer to <code><body></code>, higher number means closer to <code></head></code> and <code></body></code> and farther to <code><body></code>)</li>
<li>Choose which post types will have enabled article specific head/body/footer fields</li>
<li>Choose should article specific head/body/footer code be appended to site-wide code, or will replace site-wide code</li>
<li>View on Posts/Pages/Custom Post Types listing if article has defined any article specific custom code</li>
<li>Site-wide section is located under <strong>Tools</strong> > <strong>Head & Footer Code</strong></li>
<li>If you have set WP_DEBUG constant in <code>wp-config.php</code> to <code>true</code>, you’ll see site-wide and article specific entries in page source code wrapped to comments.</li>
<li>[NEW] allow unprivileged user roles Editor and Author to manage article-specific code on single site and multisite (disabled by default)</li>
</ul>
<h3>Data stored in database</h3>
<p>General settings (HEAD, BODY, FOOTER global code and priority, Homepage code and behaviour) saves in WordPress option <code>auhfc_settings</code>.<br />
Each post/page/custom post type specific HEAD, BODY and FOOTER code and behaviour saves to post meta <code>_auhfc</code>.<br />
Each category specific HEAD, BODY and FOOTER code and behaviour saves to taxonomy meta <code>_auhfc</code>.</p>
<p>During the Uninstall process all these data has been deleted from the database.<br />
In case you wish to reinstall plugin, <strong>DO NOT UNINSTALL IT</strong> although <strong>Deactivate</strong>, then delete the directory <code>/wp-content/plugins-head-footer-code</code> and then reinstall plugin.</p>
<h3>Permissions on Multisite WordPress</h3>
<ol>
<li>Access to <strong>Global</strong>: only Super Admin and Administrator</li>
<li>Access to <strong>Article specific</strong>: Super Admin, Administrator; <strong>optional</strong>: Editor and Author</li>
<li>Access to <strong>Category specific</strong>: only Super Admin and Administrator</li>
</ol>


Head & Footer Code

This plugin is what exactly I'm looking for to add custom javascript and CSS codes to specific pages without inserting them inside the template.

A must have plugin

Easy add site-wide, category and article specific custom code before the closing </head> and </body>, or after opening <body> tag.

Scripts To Footer vs Head & Footer Code