Image Sexy Lightbox Evolution has made previously is about to add lightbox class on each images manually. Are you feeling tired to give an effect lighbox manually? Perhaps this would be an idea about how to use the lightbox to all images automatically and how to apply it into your blog, so that no image is left with the effect such a beautiful lightbox, that was i called Image Sexy Lightbox Evolution to all images of the content on your blog post.
The principle is how to recognize the images on your blog and then add the class as a whole on the image. If you are using wordpress, it can be solved by php script, but especially in the blogger, it is still possible can be solved by jquery script with adding lightbox class to all images automatically. Here you just need to insert jquery add class lightbox all images, but how to apply it on your blog. First of all place the javascript and css link of image sexy lightbox evolution as mentioned in the post previously, if you are not used yet, let's click on the link here!
There are two methods here to recognize and identify the entire images on your blog content that will be added class lightbox
First jquery script:
1 2 3 4 | jQuery(document).ready( function ($){ $( '.lightbox' ).lightbox(); $( 'a[href$=jpg], a[href$=JPG], a[href$=jpeg], a[href$=JPEG], a[href$=png], a[href$=gif], a[href$=bmp]:has(img)' ).addClass( "lightbox" ); }); |
1 2 3 | jQuery(document).ready( function ($){ $( '.lightbox' ).lightbox(); $( 'a:has(img)' ).addClass( "lightbox" ); }); |
1. Go to the dashboard of your blog, click on Template>Edit HTML, on the template script press Ctrl+F to find the end of the head template. Then type </head> inside keyword search. You will see the end of the head section of your template. At the end of the head there is usually found a long jquery script.
2. Copy one of the jquery script above, and put it at the last jquery script. For more details let's see the picture below!
Once you insert one of the jquery add class lightbox all images then save it. In this way you no longer need as manual to add lightbox class at every time you make an article, especially for article with many images, it would be most useful. For more details let's see this article video! Good luck!
Related Articles
/Blog Note
- Basic GitHub & Migrating All GoogleCode SVN Projects
- Remove the Url Link on Blog Comments
- Quick Search JSON on Blog Posts Own Search Box
- Jquery Image Items Slider Caroufredsel for Blogger
- Elegant Jquery Vertical Menu Accordion for Blogger
- Image Slideshow with Next/Prev Controls on Blog
- Styling Script Code with Syntax Highlighter Blogger
/Web Design
- Build Web Hosting Server On Mikrotik Double Router Port Forwarding and Script Automatic Update Dynamic IP
- Build Web Hosting Server by self Using Dynamic IP, Wamp Server with Router Port Forwarding
- Basic GitHub & Migrating All GoogleCode SVN Projects
- Remove the Url Link on Blog Comments
- Quick Search JSON on Blog Posts Own Search Box
- Joomla Image Lightbox Evolution All Images
- Jquery Image Items Slider Caroufredsel for Blogger
sir,
ReplyDeletethis isNOT WORKING. PLS CHECK.
the jquery script already tested, and it works well for me at least, many reasons that cause the script does't work, it depends on the template scripts that you have used which is very possible conflicts.
ReplyDelete
ReplyDeleteYou have discussed an interesting topic that everybody should know. Very well explained with examples. I have found a similar websitelightboxes visit the site to know more about sinking.
Once you've decided on the perfect recipe for audience targeting options, your lightbox ads will refine your selection over time. Using Google's intelligence optimization engine, ads pay attention to each unique audience member interacting with the ad content and learn which methods and strategies are most effective and for what type of viewer.
ReplyDeletehttps://ppcexpo.com/blog/what-is-a-lightbox-ad