Indroduction

We want a dynamic block that shows images one by one randomly with a transition effect. From there, users can click on this block to access the image gallery in a shadowbox.

Implementation

First of all download and enable the following modules: jQuery plugins, Rotor Banner, Shadowbox, Upload element and Views and Views UI which comes with Views.

Be sure to follow the Shadowbox installation instructions because it requires an external library.

Secondly, create the view:

1. Go to Site building > Views > Add
2. Name: Gallery; Type: node; Click next then either setting under default or just add a block as a display.
3. Basic settings:
   1. Name: Dynamic Image Block
   2. Title: Gallery
   3. Style: Rotor; Time: 2; Speed: 2; Effect: Random; Check Pause on hover
   4. Row style: Fields
   5. Use Ajax: yes
   6. Use pager: no
   7. Items to display: Unlimited
4. Relationship: Content: Images - fid; check the box marked "Require this relationship". This is to eliminate the space left by node without image upload.
5. Fields: add Content: Image; Check hide if empty; Label: none; Format: SB G field: 85x85_User_Picture to 640x480_Full
6. Sort criteria: Global: Random asc
7. Filters: Node publish: yes; Node: type = Mission update (This is a content type that has cck image field to upload image to the gallery)
8. Block settings: Admin: Dynamic Image Block
9. Remember to save your changes

Then go to Site building > Blocks and assign the Dynamic Image Block to the required area. Remember to save your changes.

You will now see a dynamic image block that shows an image randomly in a random transition effect.