jquery - Social buttons on fancybox -
i want integrate script http://jsfiddle.net/g5tc3/ pre existent configuration of fancybox (i use fancybox plugin wordpress, can edit part of configuration of fancybox)
this configuration:
<script type="text/javascript"> jquery(function(){ jquery.fn.gettitle = function() { // copy title of every img tag , add parent fancybox can show titles var arr = jquery("a.fancybox"); jquery.each(arr, function() { var title = jquery(this).children("img").attr("title"); jquery(this).attr('title',title); }) } // supported file extensions var thumbnails = jquery("a:has(img)").not(".nolightbox").filter( function() { return /\.(jpe?g|png|gif|bmp)$/i.test(jquery(this).attr('href')) }); thumbnails.addclass("fancybox").attr("rel","fancybox").gettitle(); jquery("a.fancybox").fancybox({ 'cyclic': false, 'autoscale': true, 'padding': 10, 'opacity': true, 'speedin': 500, 'speedout': 500, 'changespeed': 300, 'overlayshow': true, 'overlayopacity': "0.5", 'overlaycolor': "#000000", 'titleshow': true, 'titleposition': 'inside', 'enableescapebutton': true, 'showclosebutton': true, 'shownavarrows': true, 'hideonoverlayclick': true, 'hideoncontentclick': false, 'width': 560, 'height': 340, 'transitionin': "fade", 'transitionout': "fade", 'centeronscroll': true }); /* can edit part */ }) </script>
i don't understand jaavascript don't know how integrate script help!
just add below mentioned code after last property of fancybox i.e after "'centeronscroll': true" put "," , paste below code
beforeshow: function () { if (this.title) { // new line this.title += '<br />'; // add tweet button this.title += '<a href="https://twitter.com/share" class="twitter-share-button" data-count="none" data-url="' + this.href + '">tweet</a> '; // add facebook button this.title += '<iframe src="//www.facebook.com/plugins/like.php?href=' + this.href + '&layout=button_count&show_faces=true&width=500&action=like&font&colorscheme=light&height=23" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:110px; height:23px;" allowtransparency="true"></iframe>'; } }, aftershow: function() { // render tweet button twttr.widgets.load(); }, helpers : { title : { type: 'inside' } }
hope , solve problem.
Comments
Post a Comment