How to use your own resources in the sharing module

Explore the benefits of Jetpack

Learn how Jetpack can help you protect, speed up, and grow your WordPress site. Get up to 50% off your first year.

Explore plans

The sharing module includes an “advanced” option, allowing you to use your own JavaScript and CSS files instead of the files added by Jetpack by default.

To get started, go to Settings > Sharing in your dashboard, and check the “Advanced” checkbox at the bottom of the page.

Then, you can add your own libraries by adding the following code in a functionality plugin or in your theme’s functions.php file:

function tweakjp_add_sharing_js() {
    wp_enqueue_script( 'sharing-js', WP_SHARING_PLUGIN_URL . 'sharing.js', array( ), 4 );
    $sharing_js_options = array(
	    'lang'   => get_base_recaptcha_lang_code(),
	    'counts' => apply_filters( 'jetpack_sharing_counts', true )
    );
    wp_localize_script( 'sharing-js', 'sharing_js_options', $sharing_js_options );
}
add_action( 'wp_enqueue_scripts', 'tweakjp_add_sharing_js' );

function tweakjp_add_sharing_css() {
    wp_enqueue_style( 'sharing', WP_SHARING_PLUGIN_URL. 'sharing.css', false, JETPACK__VERSION );
}
add_action( 'wp_enqueue_scripts', 'tweakjp_add_sharing_css' );

Once you’ve checked the option, you will be able to manually enqueue your own sharing js and css files.

You’ll note that Jetpack uses the WP_SHARING_PLUGIN_URL constant to build the path to load the libraries. You will have to change that constant by your own when re-enqueueing the sharing libraries.

You’ll also notice that you must localize the script and pass over lang and counts values to the sharing.js script.  A working example is included above.

Reference

This entry was posted in Code snippets, Tips & Tricks and tagged . Bookmark the permalink.

Jeremy Herve profile
Jeremy Herve

Jetpack Mechanic 🚀 at Automattic. WordPress, board games, TV Series, music.

Explore the benefits of Jetpack

Learn how Jetpack can help you protect, speed up, and grow your WordPress site. Get up to 50% off your first year.

Explore plans

Have a question?

Comments are closed for this article, but we're still here to help! Visit the support forum and we'll be happy to answer any questions.

View support forum
  • Enter your email address to follow this blog and receive news and updates from Jetpack!

    Join 112.8K other subscribers
  • Browse by Topic