473,573 Members | 2,919 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

How to use Irfanview freeware to create web thumbnail galleries

So that the world at large benefits from our efforts, here is one fully
documented way to use Windows Irfanview freeware to create thumbnail web
galleries (http://www.irfanview.com).

STEP 1: Start with original thumbnails & two empty sub directories
STEP 2: Create smaller versions of the originals for one sub directory
STEP 3: Create thumbnail version of the originals the other sub directory
STEP 4: Create an index.html pointing to the smaller images & thumbnails
STEP 5: Copy the entire hierarchy over to your web server

Since it has been aptly proven that if you deviate from the exact steps
below, you may not get suitable results, I documented the exact steps one
used for me to obtain successful results in the hopes this writeup saves
others the days of effort it cost me by not knowing the hints & tricks
below!

0. Start with a directory of large photographs, e.g.:
c:\pic\proofs (for your larger originals)
containing a series of original photographs, e.g.:
c:\pic\proofs\P icture 001.jpg
c:\pic\proofs\P icture 002.jpg
c:\pic\proofs\P icture 003.jpg

Create two empty sub directories:
mkdir c:\pic\images (for your smaller web page images)
mkdir c:\pic\thumbs (for your tiny web page thumnails)

1. Shrink the original proofs to create the smaller web images
by starting Windows Irfanview (version 3.98) and then
select "File" & then "Thumbnails ".

This opens a second window containing a left pane
(file browser) and a right pane (image browser).

You can kill the original Irfanview window at this time.

2. Now it's time to shrink the large images into something smaller.

Using the left thumbnail window browser pane, browse to your
proofs directory (c:\pic\proofs) and select all the proofs
by pressing "Options" and "Select All".
Press "File" "Start batch dialog with selected thumbs".
A "Batch conversion" form will pop up.

Select the following settings:
Input Files: C:\pic\proofs\P icture 001.jpg
C:\pic\proofs\P icture 002.jpg
C:\pic\proofs\P icture 003.jpg

Output directory: c:\pic\images
Work as: (x)Batch conversion
Press the "Options" button to set the JPEG Quality to about 50%.
[x]Use advanced options
Press the "Set advanced options" button.
In the "Settings for all images form" that pops up, set:
[x]RESIZE
(x)Set new size as percentage of original
Width: 25% Height: 25%
[x]Preserve aspect ratio (proportional)
[x]Use Resample function (better quality)
[x]Don't enlarge smaller images
Set DPI value: 72
Press the OK button in the "Settings for all images" form.
Press the "Start" button in the "Batch conversion" form.

You should see the progress dialog:
Converting image: C:\pic\proofs\P icture 003.jpg
... Ok - C:\pic\images\P icture 003.jpg
Converting image: C:\pic\proofs\P icture 002.jpg
... Ok - C:\pic\images\P icture 002.jpg
Converting image: C:\pic\proofs\P icture 001.jpg
... Ok - C:\pic\images\P icture 001.jpg
Errors: 0, Warnings: 0

Notice you now have populated the images directory:
C:\pic\images\P icture 001.jpg
C:\pic\images\P icture 002.jpg
C:\pic\images\P icture 003.jpg

3. Now it's time to create your thumbnails.

In the thumbnail window, press "Options" and then press
"Set thumbnail options". Change the settings as desired.

Using the left thumbnail window browser pane, again browse to
your proofs directory (c:\pic\proofs) and select all the proofs
by pressing "Options" and "Select All".
Press "File" "Save selected thumbs as single images".
A navigation box will pop up that will NOT allow you to create
a directory (so it must exist already). In that navigation box,
browse to your c:\pic\thumbs directory and press OK.

No conversion dialog will pop up, but, soon you'll have the thumbs:
C:\pic\thumbs\P icture 001_t.jpg
C:\pic\thumbs\P icture 002_t.jpg
C:\pic\thumbs\P icture 003_t.jpg

4. Now it's time to create your index.html file.

Using the left thumbnail window browser pane, again browse to
your proofs directory (c:\pic\proofs) and select all the proofs
by pressing "Options" and "Select All".
Press "File" "Save selected thumbs as HTML file"
This should pop up the "Create HTML file" form.

These settings are CRITICAL (if you don't follow exactly, you
may not get the correct HTML file) so be careful here:

Main result HTML file name: index.html
Destination folder: c:\pic <--- use a full path here
Thumbnails sub-folder: thumbs <--- use a relative path here
Thumbnail file prefix:
Thumbnail flie suffix: _t
Images sub-folder: images <-- use a relative path here
Folder with HTML templates: c:\programs\vie wers\irfanview\ html\
[x]Copy original images to destination folder (recommended)
[ ]Create one HTML file for each thumbnail (HTML browsing)
[ ]Create HTML Slideshow
HTML Options Page title: My Pictures
Columns: 4
[ ]Link images to original files on local disk ("file://")
[x]Write file info/text [$F = file name] [$S = file size]
Text alignment ( )Left (x)Center ( )Right
Link/Image display ( )Display links in original browser window
(x)Display links in the second browser window

When you are ready, press the [Export] button.

This creates the index.html file at:
c:\pic\index.ht ml

At this point, you may close the Irfanview thumbnails window.

5. Your file system should look like the following at this time:
PROOFS: C:\pic\proofs\P icture 001.jpg
C:\pic\proofs\P icture 002.jpg
C:\pic\proofs\P icture 003.jpg
IMAGES:
C:\pic\images\P icture 001.jpg
C:\pic\images\P icture 002.jpg
C:\pic\images\P icture 003.jpg
THUMBS:
C:\pic\thumbs\P icture 001_t.jpg
C:\pic\thumbs\P icture 002_t.jpg
C:\pic\thumbs\P icture 003_t.jpg
INDEX.HTML
C:\pic\index.ht ml

The key portion of the index.html file is:
<TD ALIGN=CENTER VALIGN=BOTTOM>
<FONT face="Verdana, Arial, Helvetica, Sans-Serif" size="-2">
<A HREF="./images/Picture 003.jpg"
target="" style="text-decoration:none ">
<IMG SRC="./thumbs/Picture 003_t.jpg"
width="80" height="80" BORDER="0" ALT="Picture 003.jpg">
<div style="text-align: center">Picture 003.jpg
<BR>2.49 MB</div></A></FONT></TD>

Namely:
<A HREF="./images/Picture 003.jpg">
<IMG SRC="./thumbs/Picture 003_t.jpg">
</A>

6. Test out your new thumbnail gallery TGP web page by
double-clicking on the index.html file.

This will bring up your default browser with the thumbnails
showing. When you click on the thumbnails, the smaller copies
of the originals will show up for the user in their browser.

7. At this point, you can copy the entire c:\pic directory over
to your favorite web server location so that others may
enjoy your newly created thumbnail photo gallery using
Irfanview freeware.

All in all, it's an easy task:
Start with original thumbnails
Create smaller versions of the originals
Create thumbnail version of the originals
Create an index.html page pointing to the smaller images
Copy the entire directory over to your web server.

I hope this writeup helps many others,
barb
Aug 10 '06 #1
8 20339

barb a écrit :

Thanks, i hijack this thread a little to refresh memory :

Can someone remember a small tool witch produce a
basic html page with thumbnails on the left vertical
aligned ?

it has a guy too

laurent

Aug 10 '06 #2

lisztfr a écrit :
barb a écrit :

Thanks, i hijack this thread a little to refresh memory :

Can someone remember a small tool witch produce a
basic html page with thumbnails on the left vertical
aligned ?

it has a guy too

laurent

Found :

HTML Imager v1.0 - Copyright © 1996 Eric G.V. Fookes
=============== =============== =============== =======

HTML Imager produces web pages showing all GIF
and/or JPG pictures from the directory you select.
Each picture is shown together with its file name
(alphabetical order) and size. You can also
select different background colors or patterns
to test the appearence of each image under
the chosen conditions.

HTML Imager makes it easy to catalog large
collections of web design pictures or to
produce online photo albums.

This program is Freeware. You can find updates and
other programs by visiting the following web site:

http://www.unige.ch/sciences/terre/geologie/fookes/

You can also contact the author by E-mail at the
following address:

fo****@sc2a.uni ge.ch

Snail mail:
Eric G.V. Fookes
av. Eugène-Pittard 22Ter
CH - 1206 Geneva
Switzerland

Hope you enjoy using it!

=============== =============

laurent

Aug 10 '06 #3

lisztfr wrote:
Can someone remember a small tool witch produce a
basic html page with thumbnails on the left vertical
aligned ?
perhaps you mean iMapper. it does client side maps but can make
thumbnail strips too.

it was shareware from www.Star-tek.com.au in 98 or so. do not know
where to get it now.

Aug 10 '06 #4
barb wrote:
So that the world at large benefits from our efforts, here is one
fully documented way to use Windows Irfanview freeware to create
thumbnail web galleries (http://www.irfanview.com).
Since it has been aptly proven that if you deviate from the exact
steps below, you may not get suitable results,
Au contraire...
_______________ ______
1. Shrink the original proofs to create the smaller web images
<snip>
Press "File" "Start batch dialog with selected thumbs".
A "Batch conversion" form will pop up.
The pix only need to be resized if someone *wants* to make the files
smaller.
_______________ ____
3. Now it's time to create your thumbnails.
There is no need to do this as a separate step, Irfanview can/will
make them when making the HTML file.
--

dadiOH
_______________ _____________

dadiOH's dandies v3.06...
....a help file of info about MP3s, recording from
LP/cassette and tips & tricks on this and that.
Get it at http://mysite.verizon.net/xico

Aug 10 '06 #5
It really seems much easier than that...

0. Irfanview will automatically create and fill the directories specified
in 4.

1. If you want thumbnails, you can simply start from the desktop icon
"Irvanview Thumbnails".

2. Yes, you do need to previously size your main images for web viewing.
But you probably dont want 25%. You probably want to specify a final size
suitable for web viewing, probably no larger than 800x600 pixels (assuming
target is a 1024x768 pixel video screen). DPI value doesnt matter on the
video screen, it can be blank.

3. Unnecessary, Irfanview will create the thumbnail files automatically
(it already has the thumbnail images from step 1, and step 4 tells it
where to put them).

4. This is what does the work.

I'd say:

1. Create a folder of web size images to be displayed.
2. Irfanview Thumbnails - and select them.
3. menu File - Save Selected thumbs as HTML
4. There you have it.

--
Wayne
http://www.scantips.com "A few scanning tips"

Aug 10 '06 #6
barb wrote:
So that the world at large benefits from our efforts, here is one fully
documented way to use Windows Irfanview freeware to create thumbnail web
galleries (http://www.irfanview.com).

STEP 1: Start with original thumbnails & two empty sub directories
What are "original thumbnails"? Are you making thumbnails of the thumbnails?
Aug 10 '06 #7
ms
"lisztfr" <la************ *@libertysurf.f rwrote in
news:11******** *************@p 79g2000cwp.goog legroups.com:
>
Found :

HTML Imager v1.0 - Copyright © 1996 Eric G.V. Fookes
=============== =============== =============== ======
HTML Imager produces web pages showing all GIF
and/or JPG pictures from the directory you select.
Each picture is shown together with its file name
(alphabetical order) and size. You can also
select different background colors or patterns
to test the appearence of each image under
the chosen conditions.

HTML Imager makes it easy to catalog large
collections of web design pictures or to
produce online photo albums.

This program is Freeware. You can find updates and
other programs by visiting the following web site:

http://www.unige.ch/sciences/terre/geologie/fookes/
file not found, not in Google search either ????

Mike Sa
Aug 10 '06 #8

"barb" <bw****@cox.net wrote in message
news:1s******** *************** *******@40tude. net...
So that the world at large benefits from our efforts, here is one fully
documented way to use Windows Irfanview freeware to create thumbnail web
galleries (http://www.irfanview.com).
That's a lot of work.

If you run WindoZe, then there's two much faster and easier ways.

get Micro$oft's Power Tool called Resize.
right-click on any number of pictures
do 'custom'
press go

DONE

I also do thousands at a time using a command-line program. Type one simple
statement. DONE!

Aug 10 '06 #9

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
3641
by: Phil Powell | last post by:
PHP 4.3.2 with --enable-exif I have the following class: <?php class ThumbGenerator extends MethodGeneratorForActionPerformer { function ThumbGenerator() { // CONSTRUCTOR
12
5529
by: TGP Thought Meister | last post by:
Has anyone seen or know if anyone has done this? I think that ASP would be a great tool to do this with but I am curious if anyone has tried it and found it to be too hard or too burdensome to follow through with?
14
3409
by: Filippo Giarratano | last post by:
Hi -- I'm trying to figure out how to make a photo thumbnail gallery page using CSS and no tables that (1) has a caption below each image and (2) is centered -- so that as browser width changes the images consistently reconstitute themselves as centered rows with the maximum number of images on each row. I've made a test page at...
54
7185
by: Max Quordlepleen | last post by:
Apologies for the crossposting, I wasn't sure which of these groups to ask this in. I have been lurking in these groups for a week or so, trying to glean what I need to design a simple, clean set of pages that get the w3c tick for XHTML 1.0 Strict, and CSS2. So far, I have succeeded, thanks to the great information in these groups. Now,...
0
2285
by: Balu Ramachandran | last post by:
How can I create the Thumbnail view from the form? In the following approach I tried but Iams facing some limitations to get the thumbnail image of the form alone. Plaese any one can help in this regard. It is a serious problem for me. Thanks! Approach - I - Bitmap (screen capture method) =============================================...
2
4574
by: Mark R. Dawson | last post by:
Hi all, I have a directory full of images (most over 2MB in size) I was to show each image as a thumbnail on a form, however in order to create a thumbnail I have to open the complete image then scale it down. This is quite slow, since there is a lot of file IO going on, what I want to be able to do is open the image in the scaled down size...
6
4737
by: Rich | last post by:
Hello, I want to simulate the dynamic thumbnail display of Windows Explorer (winxp) on a form or pannel container. If I place a picture box on my container form/pannel and dimension it to the size of a thumbnail and set the sizemode to Stretch -- I get one thumbnail. I want to retrieve all the picture files (jpg, bmp) in a directory into...
13
4323
by: Viken Karaguesian | last post by:
Hello everyone, Can anyone recommend a good online site to learn PHP? The W3Schools website is quite lacking - leaves much to be desired. I'm sure there are many places, but which ones are good? I currently run a site with an extensive photo gallery. Hundreds of photos. Right now I have a system which the thumbnails are laid out in a...
11
2365
by: Jane | last post by:
Hi, I need some help (php rookie) to build a thumbnail page using php. I'v a mysql database containing links to the original image files. No thumbnails created so far. It would be nice when the thumbnail contains a link to the original file :-) Jane
0
7771
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main...
0
8009
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. ...
0
6406
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then...
1
5580
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes...
0
5289
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert...
0
3730
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in...
0
3731
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
2194
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
0
1036
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.