OSD Social Media Sharing

Posted Thu, 19 Jan 2017 06:58:59 +0000

How to Add the Engage.Social Share Button to your Existing OSD ( OSD Social Media Sharing Integration ) plugin

In WordPress, plugins are used extensively to apply different features to your website. The advantages of using plugins as opposed to directly pasting HTML are well documented: Firstly, you can activate and deactivate a plugin with a simple click of a button, many plugins offer easy to understand UI so you need not be confused, and most importantly for share bars, they automatically give options to apply your share bars to every post or to every page.


OSD (OSD Social Media Sharing Integration) is one of the most popular Share Button providers, for your convenience, We have prepared easy to follow instruction for you to implement the Engage.Social Share button into your existing OSD (OSD Social Media Sharing Integration) installation.


  1. We need to add some code to your theme so that the widget script will function: Go to the ‘Appearance’ section on the WordPress sidebar and click the ‘Editor’ subsection. On the right-hand side there should be a list of PHP files, find ‘Footer.php’ and click it to open it.


    If footer.php is not on the right-hand side, then you are probably in a Child Theme. You can check this as on the right-hand side it will say ‘Child theme inherits parent theme, XXXX’ where XXXX is the parent theme. Open the Parent theme and click Footer.php.

  3. Anywhere within the top part of this file copy and paste the following code:

    window.onload = function () {
    var url = "//widget.engage.social/js/enshare.js";
    jQuery.getScript( url, function() {
    var nzshare = '<div class="osd-sms-icon-button osd-no-custom-icon"><img style="cursor: pointer; float: left; display: block;" src="//engage.social/images/smart-share-icons/share_round_c32.png" title="Social Influencer" class="ssba_newzlink_share" alt="Social Influencer"></div>';
    jQuery('.ssba_newzlink_share').click(function () {
    return false;


This is will add our button, and connect it the sharing widget.


If you don’t have permission to edit the footer.php then please install and activate scripts n styles plugin.

Plugin url: //wordpress.org/plugins/scripts-n-styles/

After installation plugin Please goto Tools -> scripts n styles -> Scripts(end of the body tag): Paste widget code.

This is will add our button, and connect it the sharing widget.


All items in red are customizable, they are in order:

Image icon: Change the URL to the URL of the icon you intend to use to represent the sharing button.

Button Placement: In the code above we are placing our share button after the OSD Facebook share button. To place the Engage.Social button after a different button you must child number ( .osd-sms-wrapper>div:nth-child(4) ) with the number of the different button.


Unique business widget ID:

The ‘XXXXXXXXXXXXXXXXXXXX’ is the Widget ID. This 20 letter/number combination string represents your unique widget ID which must be generated through the social share widget. This controls where the information is retrieved for the Trending and Analytics subheadings of the widget.

To generate this string you must use the Manage Widget interface in Engage Social that allows you to configure the widget. Copy the Widget ID generated for your account, as shown below, before you paste the above script.


Once you have copied the script, click update file and you should be all done, with a fully working button!

by Daphne    -    Thu, 19 Jan 2017 06:58:59 +0000
Rate this article on a 1-5 scale
1 (not useful) to 5 (very useful)