How to Conditionally Load AddToAny Share Buttons for Better Performance
Content
Many WordPress site owners use the AddToAny Share Buttons plugin to add social sharing functionality. However, a common concern is that the plugin's JavaScript and CSS files load on every page of a site, even when the share buttons are only needed on specific pages like blog posts. This can impact page load times and overall site performance.
Why AddToAny Loads on Every Page
By default, the AddToAny plugin loads its core scripts site-wide. This is primarily to ensure compatibility with dynamic content loading techniques, such as infinite scroll or content loaded via Ajax. Without the scripts being available globally, share buttons would not appear on content that is loaded after the initial page load.
Common Solutions for Conditional Loading
Based on community discussions, here are the most effective methods to control where AddToAny's assets are loaded. These solutions involve adding PHP code to your theme's functions.php file or a functionality plugin like "Code Snippets".
1. Disable Scripts on the Homepage
If you do not display share buttons on your homepage, you can prevent the scripts from loading there with this code:
// Disable AddToAny core script on homepage
function addtoany_disable_script_on_homepage($script_disabled) {
if ( is_home() ) {
return true;
} else {
return $script_disabled;
}
}
add_filter( 'addtoany_script_disabled', 'addtoany_disable_script_on_homepage' );
2. Load Scripts Only on Single Posts
To restrict AddToAny to only load on single post pages, use the following code. Important: This will disable the plugin's ability to load on dynamically inserted content.
add_action( 'wp_enqueue_scripts', function() {
// Allow only on single posts (of any post type)
if ( is_singular() ) return;
// Remove AddToAny core script, CSS, and JS
add_filter( 'addtoany_script_disabled', '__return_true' );
wp_dequeue_script( 'addtoany' );
wp_dequeue_style( 'addtoany' );
}, 21);
3. Move Scripts to the Footer
For a perceived performance boost, you can move the plugin's scripts to the footer of your pages without disabling them.
// Move AddToAny script(s) to footer.
add_action( 'wp_enqueue_scripts', function() {
// AddToAny's main script.
wp_register_script( 'addtoany-core', false, array(), false, true );
// AddToAny plugin's jQuery script.
wp_register_script( 'addtoany-jquery', false, array( 'jquery' ), false, true );
}, 21);
Important Considerations
- Dynamic Content: Disabling the core script site-wide (as in Solution #2) will break share buttons on content loaded via Ajax, infinite scroll, or similar methods. Only use this method if you are certain your site does not use these features.
- Testing: Always test these changes on a staging site before applying them to your live website.
- Plugin Updates: Code added to your
functions.phpfile will remain after a plugin update. However, if you change your theme, you will need to re-add the code to the new theme's functions file.
By implementing these conditional loading techniques, you can significantly improve your site's performance while maintaining social sharing functionality where it's needed most.
Related Support Threads Support
-
Loading on Front Pagehttps://wordpress.org/support/topic/loading-on-front-page/
-
Provide a Options in Backend for move js on footerhttps://wordpress.org/support/topic/provide-a-options-in-backend-for-move-js-on-footer/
-
How to prevent load into Divi layouts?https://wordpress.org/support/topic/how-to-prevent-load-into-divi-layouts/
-
Load a2a on ajax pageshttps://wordpress.org/support/topic/load-a2a-on-ajax-pages/
-
Fade-in and Out with scrollhttps://wordpress.org/support/topic/fade-in-and-out-with-scroll/
-
Won’t load until page refreshhttps://wordpress.org/support/topic/wont-load-until-page-refresh/
-
load script only on postshttps://wordpress.org/support/topic/load-script-only-on-posts/
-
defer javascripthttps://wordpress.org/support/topic/defer-javascript-3/
-
Loading from globalhttps://wordpress.org/support/topic/loading-from-global/
-
move the script to the footerhttps://wordpress.org/support/topic/move-the-script-to-the-footer/
-
run plugin only on postshttps://wordpress.org/support/topic/run-plugin-only-on-posts-2/
-
Exclude preload on front page?https://wordpress.org/support/topic/exclude-preload-on-front-page/
-
Only load script on pages where it is usedhttps://wordpress.org/support/topic/only-load-script-on-pages-where-it-is-used/
-
Works only in post / lazy load and short code inserthttps://wordpress.org/support/topic/works-only-in-post-lazy-load-and-short-code-insert/
-
Filter to load plugin only on pages using Add to Any?https://wordpress.org/support/topic/filter-to-load-plugin-only-on-pages-using-add-to-any/
-
Load addtoany external scripts requests only on postshttps://wordpress.org/support/topic/load-addtoany-external-scripts-requests-only-on-posts/
-
Java specific for homepagehttps://wordpress.org/support/topic/java-specific-for-homepage/
-
Defer Add to Any JShttps://wordpress.org/support/topic/defer-add-to-any-js/