Comic Gallery 1.1

by Stuart Robertson on June 3rd, 2005 | designmeme, tools

I’ve made a few updates to my Comic Gallery Script, and a new version is now available. ComicGallery 1.1 includes navigation links for going to the first or last image in the gallery, as well as enhanced XHTML output to allow you to replace the text navigation with custom images. You can see an example of Comic Gallery 1.1 at RealmOfAtland.com

Download ComicGallery.zip

Be sure to check the Comic Gallery Tutorial for help with setting up and configuring the script.

New Features

The First and Last links are controlled by the variable:

$firstlast=1;
The default setup for Comic Gallery includes start and last links for navigating back and next through the images. To this option off, change this line to: $firstlast=0;

Additional <span> tags have been added to the generated markup for use with CSS Image Replacement techniques. This will allow you to replace the text navigation for the gallery with your own custom images.

This zip file includes some sample images for you to get started.

Download cg_nav.zip

Setting up your navigation images

Unzip the file and upload the files to a directory on your website as follows:

  • YourWebsiteFolder
    • comicgallery.php
    • example.php
    • kubrick.css
    • images
    • kubrick
    • cg_nav
      • back.gif
      • back_on.gif
      • back_off.gif
      • first.gif
      • first_on.gif
      • first_off.gif
      • last.gif
      • last_on.gif
      • last_off.gif
      • next.gif
      • next_on.gif
      • next_off.gif

Add this CSS to your page (eg. example.php) and your gallery will display images for the First, Back, Next and Last links: 

/* CG nav setup */
#cg_nav1 { height: 50px; width: 400px; margin: 0 auto; }
#cg_nav1 a, #cg_nav1 span {   height: 50px; width: 100px; float: left; background: #fff top left no-repeat; }
#cg_nav1 a span, #cg_nav1 span span, #cg_nav1 .cg_divider { display: none; }

/* CG nav images */
a#cg_first { background: url(cg_nav/first.gif); }
a#cg_back { background: url(cg_nav/back.gif); }
a#cg_next { background: url(cg_nav/next.gif); }
a#cg_last { background: url(cg_nav/last.gif); }

/* CG nav rollover images */
a#cg_first:hover { background: url(cg_nav/first_on.gif); }
a#cg_back:hover { background: url(cg_nav/back_on.gif); }
a#cg_next:hover { background: url(cg_nav/next_on.gif); }
a#cg_last:hover { background: url(cg_nav/last_on.gif); }

/* CG nav unavailable images */
span#cg_first { background: url(cg_nav/first_off.gif); }
span#cg_back { background: url(cg_nav/back_off.gif); }
span#cg_next { background: url(cg_nav/next_off.gif); }
span#cg_last { background: url(cg_nav/last_off.gif); }

Replace the cg_nav files with your own, but be sure to adjust the height and width settings in above CSS if you have different size images. You might also consider using CSS Sprites to reduce the number of image files needed for your gallery’s navigation.

4 Comments

  1. Hector.Zoltan on May 10, 2008 at 2:45 pm

    Hey there. First of all thanks for the script, helped me much with uploading me and my friend’s comics!

    (you can see it at http://www.hectorzoltan.com/knptlv)

    I was wondering if you considered adding an ability to add comments to each strip… and if not, perhaps where could I search something similar to help me add to what you wrote?

    thanks :)

  2. Stuart Robertson on May 15, 2008 at 7:21 pm

    Thanks Hector. :)

    I had no idea the script had become so popular. It was only when I redesigned the site that I started recording stats for people linking here from sites running comic gallery. I’ve been really impressed by how many great sites there are!

    I’ve got a couple projects underway right now, but considering the popularity of Comic Gallery, I think this is something I’ll return to soon and create a new version with more options / features.

  3. Hector.Zoltan on May 16, 2008 at 4:16 am

    Well, I’ll sure be downloading it (would love to beta it if needed) :)

    In the meantime I’ll patch up some scripts to hack my way through

    Thanks!

    :)

  4. herpescurer on September 13, 2008 at 10:25 pm

    Hi! Tell me, where did you get this cms? Mail me if you canThanks

Leave a Comment