Blogspot jQuery gallery

Today i'm going to create one thing with blogger.

Want to make a gallery for blogger.

First of all i've reviewed text which was generated by Blogger when i insert images. And then few hours of coding made rough, but useful gallery for Blogger. Anyway, due to limitations of blogger itself code looks like an in&*an one. Later i will check checked where i can host all of the plugins i've used here, together with library for user-friendly usage. Now i'm going to make same easy thing for Picasa.

Limitations:

• It's for blogger only
• After editing a page you need to put your JS code again.
• You need to know basics of HTML. If you want to order your photos.
• You need to know CSS. If you want to style your gallery.
• You need to search for "change 'medium' to x-small, small, large or x-large to enlarge image" comment in javascript to change size of image

For now you need to do the following:

1. Make an empty post and add images there.
2. Write all text. you want to have in your blog post.
3. If you want captions like you see in example below you need to add "alt" property to the image or "title" property to link around image.
4. Add this huge small code:

<script src="http://mod-s.narod.ru/scripts/yoxview/yoxview-init.js" type="text/javascript"></script> <script src="http://mod-s.narod.ru/scripts/blogspot/Biozshock.js" type="text/javascript"></script> <script type="text/javascript"> Biozshock.blogspotImages.render('x-small', 'x-large', { loopPlay: false }); </script>

Configuration:

• Biozshock.blogspotImages.render([thumb-size], [large-size], [yoxview-options]);
• Image sizes:
  x-small
  small
  medium
  large
  x-large
  
• YoxView documentation is here
• If you want to style image previews, just override CSS file

Libraries used:

• jQuery
• galleria jQuery plugin
• YoxView