As you may have heard, we have had to disable the services that were providing social and share-this-page functionality for us (See GDPR, Jetpack, and your devcenter). Currently we do not have a site- or theme-wide way to do this.

BUT…The IBM web design system we support in our sites, V18, has a simple, per-page solution that I’ve made an example of in one of our devcenter blogs:

https://developer.ibm.com/cics/2018/07/12/osgi-demystified-2-1-osg-sigh/

See that at the bottom of that page, there are now (IBM, default) share icons:

And that the code for this is just a one-liner you can put anywhere you want:

<div class="ibm-sharethispage"></div>

See more on this page: http://northstarexamples.mybluemix.net/v18/elements/sharethispage/

HTH
I/O

4 comments on"Where did my share icons go?"

  1. Ian_Larner July 18, 2018
    here

    If you don’t want to manually add the div to every page, you can inject it with Javascript (ideally the devcenter.js for the site).

    Here is what is the extract from the devcenter.js for the Integration community. It adds the share div and links to “Follow us” mechanisms like Twitter, LinkedIn, and Youtube:

    // Add social sharing icons (links) before footer at bottom of page
    $( “footer#themeFooter” ).before( ‘Follow us on:Visit us on Twitter Visit us on LinkedIn Visit us on Youtube‘ );

    See the footer of pages in https://developer.ibm.com/integration/

    Regards,
    IanL

    • Ian_Larner July 27, 2018
      here

      The JS extract does not display properly in the above comment. You can see the extract if you view the selection source.

      Trying a second attempt below to get the JS extract to display properly:

      // Add social sharing icons (links) before footer at bottom of page<br>
      $( “footer#themeFooter” ).before( ‘Follow us on: <a href=”https://twitter.com/IBMintegration” rel=”nofollow”>Visit us on Twitter</a> <a href=”http://www.linkedin.com/groups/IBM-Integration-BUS-IIB-3088494″ rel=”nofollow”>Visit us on LinkedIn</a> <a href=”https://www.youtube.com/playlist?list=PLzpeuWUENMK3ys97oN0uDunr3Ii5H5ljN” rel=”nofollow”>Visit us on Youtube</a>‘ );

      • Ian_Larner July 27, 2018
        here

        Third time a charm?

        // Add social sharing icons (links) before footer at bottom of page
        $( “footer#themeFooter” ).before( ‘<hr /><div class=”ibm-followuson”><p class=”ibm-bold”>Follow us on:</p><p class=”ibm-icononly”><a href=”https://twitter.com/IBMintegration” class=”ibm-twitter-mono-link hidebackground”>Visit us on Twitter</a> <a href=”http://www.linkedin.com/groups/IBM-Integration-BUS-IIB-3088494″ class=”ibm-linkedin-mono-link hidebackground”>Visit us on LinkedIn</a> <a href=”https://www.youtube.com/playlist?list=PLzpeuWUENMK3ys97oN0uDunr3Ii5H5ljN” class=”ibm-youtube-mono-link hidebackground”>Visit us on Youtube</a></p></div><div class=”ibm-sharethispage”></div>’ );

  2. Deirdre Lawton July 18, 2018

    A very handy snippet, thanks, Ian.

Join The Discussion

Your email address will not be published. Required fields are marked *