Recently a client wanted to display social media buttons like facebook, twitter and google plus at the bottom of each image in jQuery Colorbox. As it is bad practice to change the source code of a Plugin, the following code worked well for this job.

Note: This client wanted the full URL to be liked, not the image itself – if you want to do so, you should  like/recommend the attachemnt URL of the colorbox images, not the URL of the page. I will leave this up to you, to change the code in this way.

		jQuery(document).ready(function() { 
			var facebook = '
';
			var twitter = '
Tweet
';
			var google = '
';
			
		    jQuery("#cboxContent").append('
'+facebook+twitter+google+'
'); 
		});
			

#cboxSocials {
	margin-top:-43px;
}

.cb_social_elem {
	float:left;
	margin-right:20px;
	width:120px;
}

Social Buttons Developer Links

Facebook Like

Twitter

Google+

LinkedIn

Pinterest