adding sharing buttons (like "addtoany") to a single image in lightbox plugin

Question

I have developed my own theme in wordpress using bootstrap.

I am using lightbox for image gallery and I am both trying to add sharing buttons on a single image opened in pop up,both trying to excercise a bit in using Jquery.

The single image in lightbox of course comes without the option of sharing buttons for social network.

the div that contains the image is an element to consider, and then there is the code of the snippet. i tried to do this...

$sharingButtons = $("</div>");
$sharingButtons.css({top: 100, left: 20, 'absolute'});

$sharingButtons.addClass("");

$sharingButtons.appendTo( '.lb-outerContainer' );

$('lb-outerContainer').append("<div class='addtoany_share_save_container addtoany_content_bottom'><div style='line-height: 32px;' class='a2a_kit a2a_kit_size_32 addtoany_list a2a_target' id=''> )etc...  (here all the snippet code of addtoany)...

</div></div>");

 $('img.lb-outerContainer').css("opacity", "0.8");

the element $sharingbuttons is the div that contains the snippet...

it does not work., anyone has better ideas?

I use last version of Jquery.

thanks Paolo p.s. do i have to use "Insert After" to add a div beside the lb-outer container_? you can view my website here http://www.paolobergomi.it/new-gallery/indoor-portraits/

if yo uclick on an image, i wish that on the right, in vertical layout..just attached to the image, appear the list of the sharing buttons i guess insertAfter could be an option? thanks to EO added: I would start like this?

$("

and then add the snippet code of addtoany in the new div? any tips? thanks

paolo

Answer 1

After you append your a2a div code, you need to execute the function a2a.init('page') because the addtoany script need to add your new code. First of all, insert a class a2a_target, an ID for the div and create a javascript code like above:

$('lb-outerContainer').append("<div class='addtoany_share_save_container addtoany_content_bottom'><div style='line-height: 32px;' class='a2a_kit a2a_kit_size_32 addtoany_list a2a_target' id='myShareLinks'> )etc...  (here all the snippet code of addtoany)...

a2a_config.target = '#myShareLinks';
a2a.init('page');

Note: a2a_config and a2a are global variables created by addtoany script.