jeudi 16 juin 2016

Adding lightbox to tumblr doesn´t work

I´ve tried lightbox, fancybox, etc but none of these lightbox function on my theme.

This is the one I´m using: http://vintage.themelantic.com/

And I wanted to make a "zoom" icon (wich I did) that when you click on it you can see the post image in a lightbox like here ---> http://narniatheme.tumblr.com/

I added all the codes correctly but still doesn´t work, it just loads the image on a new page. Anyone knows how I may be able to do this?

The only thing I was able to add was the "zoom" icon.


I took the codes from the code of "Narnia theme" but when I tried adding lightbox from 0 it didn´t work either. I searched the whole code to see if I missed something, I think I didn´t but maybe I did jaja If I can add the ones from the Narnia theme it would be awesome. I placed them exactly in the order and place they had originally but on Vintage theme.

Here is Vintage theme code just in case: pastebin.com/embed_js/gz5s56T7

---->I added below <head>: <-------------

<meta name="if:Lightbox" content="1"/>

<script type="text/javascript" src="http://static.tumblr.com/ssdtkch/AhIlqr0kb/jquery.easing-1.3.pack.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/ssdtkch/YP9ls3323/untitled.js"></script>
<link rel="stylesheet" type="text/css" href="http://static.tumblr.com/ssdtkch/EUjlqtc4s/jquery.fancybox-1.3.4.css" media="screen" />


---> Below </style><-------------

{block:iflightbox}
<script>
$(document).ready(function() {
/* This is basic - uses default settings */
$("a#single_image").fancybox();
/* Using custom settings */
$("a#inline").fancybox({
'hideOnContentClick': true
});


$("#various3").fancybox({
        'width' : '50%',
        'height'        : '30%',
        'autoScale'     : false,
        'transitionIn'  : 'none',
        'transitionOut' : 'none',
        'type'  : 'iframe'
        });
});
</script>

{/block:iflightbox}


---- >Code for the posts:<-------------

{block:iflightbox}
<a id="single_image" href="{PhotoURL-500}" ><img src="http://27.media.tumblr.com/tumblr_lqr0e7QyrS1r0kskpo1_100.png" style="margin-left:3px; border:0px; width:24px; height:20px;cursor:pointer; float:left;" class="reblog_etc" alt=""/></a>


{/block:iflightbox}

Aucun commentaire:

Enregistrer un commentaire