I like to make this example :

Worker Joined: Apr 17, 2011 Posts: 117 Location: Amsterdam

I wish I could add the share buttons (fb and twitter at the right side) like the next dutch site :

http://www.rodajc.nl/business/jeugdsponsoring/talent-wall

is het a code or just pictures added to the theme

if you can help I appreciate it

Only registered users can see links on this board! Get registered or login!

registered · Site Admin Joined: Jun 04, 2004 Posts: 6437

It's Javascript, and you should be able to add it.

Look at http://www.rodajc.nl/Scripts/init.js and search for facebookpluginright and twitterpluginright. Also find these in the HTML source for the page. The configuration that specifies the facebook page and twitter account are defined in the HTML source (i.e. you will need to change that for your FB page and Twitter account).

There is CSS that handles the appearance here: www.rodajc.nl/Content/Site.css?c=635136445857346250 (search for socialmediaright )

registered · Posted: Sun Sep 01, 2013 7:32 am

Personally, I just use Only registered users can see links on this board! Get registered or login!. Their new "layers" implementation is quite nice I think.

Posted: Mon Sep 02, 2013 7:42 am

Thank you both for the answers.. I have tried to add the js and the css code but nothing happend .. it does not show any thing on the home page.

I will look at your link montego.. it looks good I agree

Once again thanks

Posted: Mon Sep 02, 2013 9:22 am

If you're using RN 2.40 or higher, create this file: includes/addons/body-AddThis.php

Code:

<?php





$bodyHTML = '


<!-- AddThis Smart Layers BEGIN -->


<!-- Go to http://www.addthis.com/get/smart-layers to customize -->


<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=mypubid"></script>


<script type="text/javascript">


  addthis.layers({


    \'theme\' : \'dark\',


    \'share\' : {


      \'position\' : \'left\',


      \'numPreferredServices\' : 4


    }, 


    \'follow\' : {


      \'services\' : [


        {\'service\': \'facebook\', \'id\': \'nukeseo\'},


        {\'service\': \'twitter\', \'id\': \'_nukeseo\'},


        {\'service\': \'google_follow\', \'id\': \'104278050305044376442\'}


      ]


    },   


    \'whatsnext\' : {}, 


    \'recommended\' : {}


  });


</script>


<!-- AddThis Smart Layers END -->


';





if (is_array($bodyJS) and function_exists('addJSToBody')) addJSToBody($bodyHTML, 'inline');


else echo $bodyHTML."\n";





?>

Make sure to change to YOUR AddThis publisher id:

Code:

<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=mypubid"></script>

Make sure to change to YOUR FB, Twitter, Google IDs:

Code:

{\'service\': \'facebook\', \'id\': \'nukeseo\'}, 


        {\'service\': \'twitter\', \'id\': \'_nukeseo\'}, 


        {\'service\': \'google_follow\', \'id\': \'104278050305044376442\'}

You can also tweak the appearance by changing other settings in the JS.

#hack #addthis

Posted: Sun Sep 29, 2013 6:33 am

Montego pointed out that the Share buttons blocked the menu on my site. I changed that by specifying an offset parameter. Below is the updated code with the offset:

Code:

<?php 





$bodyHTML = ' 


<!-- AddThis Smart Layers BEGIN --> 


<!-- Go to http://www.addthis.com/get/smart-layers to customize --> 


<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=mypubid"></script> 


<script type="text/javascript"> 


  addthis.layers({ 


    \'theme\' : \'dark\', 


    \'share\' : { 


      \'position\' : \'left\', 


      \'offset\' : {\'bottom\': \'25px\'},


      \'numPreferredServices\' : 4 


    }, 


    \'follow\' : { 


      \'services\' : [ 


        {\'service\': \'facebook\', \'id\': \'nukeseo\'}, 


        {\'service\': \'twitter\', \'id\': \'_nukeseo\'}, 


        {\'service\': \'google_follow\', \'id\': \'104278050305044376442\'} 


      ] 


    },    


    \'whatsnext\' : {}, 


    \'recommended\' : {} 


  }); 


</script> 


<!-- AddThis Smart Layers END --> 


'; 





if (is_array($bodyJS) and function_exists('addJSToBody')) addJSToBody($bodyHTML, 'inline'); 


else echo $bodyHTML."\n"; 





?>

You can specify top or bottom and adjust the value accordingly (default is top: 50px).

Posted: Wed Oct 02, 2013 6:10 am

Nice. I also see that it is automatically adjusting to a different style upon the viewport shrinking (ala: mobile devices). Again, nice... they've done a good job with this.