How to; Click on pic to bring up a larger photo and a caption

S

Special-EFX

Hi all, you've got your hands full working with me! I am building a memorial
website that will have a page with photos and names of fallen EMS workers. I
want to have the page setup where the photo can be clicked on, then a larger
photo with a biography will appear about that person under the photo. Then
some way to get back to the page with the other fallen comrades.
I am learning, slowly, and don't know much about the codes, etc. Simple
plain English works best for me! I appreciate any help.

Thanks in advance
 
D

DavidF

Generally if you just wanted to do thumbnails, I would suggest this:

How to Thumbnail in Publisher Web Publications :
http://msmvps.com/blogs/dbartosik/pages/80553.aspx

But as you want to add a biography with the picture, I would suggest that
you just add pages to your website with the larger images and other bio
information. Link to the page, and insert a back link of some sort to return
to the main page. When you add pages to your file, pay attention to the
dialog that comes up to not include the page in the navbar. You will create
your own.

You might also read this article:
Reference: Compress graphics file sizes to create smaller Publisher Web
pages:
http://office.microsoft.com/en-us/publisher/HA011266301033.aspx
As your site is going to be very graphical intensive, you will want to make
sure to compress the images.

DavidF
 
S

Special-EFX

Thanks David, I thought about doing that, but wasn't sure about the webpage
without being on a a navbar. I will give it a try.
 
D

DavidF

You can include the other pages in your navbar if you want, but if just
seemed to me that it would be better to have this be a subsection of your
site, with its own navigation system. Something as easy as a list of each
EMS worker with their names linked to their page, and then a "<<Back" link
to take the viewer back to the main page, and or a "Next>>" link, if you
want the viewer to be able to move to the next one...

DavidF
 
B

brelade

Special-EFX.

Don't know if this will help.

Create a folder on your host server called "biography".

THEN!!!!!!!!!!!!

1. Open a new blank page, Size the page under page setup.
2. Add your pictures and text as required- Once Happy.
3. "Save" as a Single Web Page (Under File Save As) - Read Line 6 1st
4. Give you page a name - Then choose Save as Type - Single File Web Page.
5. Save the above to your Server,
6. I save to my Docs 1st as a normal Publisher file then once happy then
re-save as a Single web page again to my Doc's drag the file to my server
folder.
6. Add the following code with Insert HTML Code Fragment below any picture
to open a new window.

My code:

<a target="_blank"
href="http://www.breladecockerspaniels.co.uk/images/cocker_spaniel_dogs/morgan_main.jpg">Enlarge image</a>

You "have to" create an absolute link, you will notice the href= is my
server location & the / are the different folders within.

In your case:

<a target="_blank"
href="http://www.yoursite.co.uk/biography/nameofperson.mht">Enlarge image</a>

One difference from my code above is add ( . mht ) to the end of the link
instead of .jpg which as you know is for an image extension, I currently only
enlarge images, the part ( >Enlarge image ) you can change to read what ever
you want, this is the only part viewers will see on the page below your
images.

Each time you wish to make changes, go to your orginal in your Documents
make changes then re-save as a single web page then upload individually to
you server, just to reiterate, the link will be provide by the above code.

I hope this is of some help, i am definatley behind you in remembering our
fallen comrades, I am a serving British Royal Marine Commando and too have
lost comrades, good on ya for doing this for your comrades.

David F is more a guru on absolute links "He told me" if you have any
problems let me know, but more than likley David will be able to help.

Cheers, post back with your web address, i would very much like to see
it!!!!!!!
 
D

DavidF

Brelade,

Hey...this is OT, but I must say that your website is looking better each
time I see it...a lot tighter and cleaner these days. The new navigation
system is much better than your original across the top. You have come a
long ways since you first started this site. Kudos!

DavidF
 
B

brelade

Cheers David.

Still not up on computer language "ha ha", What does OT mean ???????

I have started to look at HTML & CSS, well what i should say is, i have the
disc's to learn from just have not plucked up the motivation or brain cells
yet to start.

Come on David have you looked at Vista yet, or splashed out on a bigger
monitor yet, so i can get away with bigger page sizes.

Hopefully my suggestion will work for Special-EFX.

Always good to hear from you.
Cheers
 
M

Mike Koewler

Brelade,

Have you viewed your site in Mozilla? The menus on the left hand side
are somewhat messed up. They display correctly at first, but after
hovering over them, instead of staying on one line they go to three.
They then disappear as soon as the mouse is over them. You might also
want to check your download time and see if you can make the images
smaller or something
(http://www.websiteoptimization.com/...p://www.breladecockerspaniels.co.uk/index.htm)

At 26 seconds with broadband, that's almost four times longer than
recommended.

Mike
 
B

brelade

Mike

Many Thanks for your feed back, "always welcome"!!!!!!!!!!

I definatley take your point on image sizes, i have reduced the main
pictures, but have made the enlarge images to big, something David pointed
out a while ago, just haven't got round to reducing them yet.

With regards to different viewers, i have downloaded FireFox, IE7, Opera,
these are the main viewers, my "stats" say are the only systems used to view
my site, if you know what i mean.

Are you using a MAC OS system, maybe thats why?????

When i always test with above before uploading, so am interested to find out
more about the problems you are seeing.

Cheers for any advice.
 
M

Mike Koewler

Brelade,

That's the browsers I use, plus AOL (their browser messes up my sites if
the user has 120 dpi fonts turned on) and Safari. I use Mozilla as my
primary browser. The reason the text disappears when I hover over it is
because of your code: a:hover {color: #000000; font-weight: bold;} Black
on black is hard to read.

Not sure what is causing the text to go to three lines. You can see a
screenshot at www.valleycat.net/brelade.gif

Mike
 
D

DavidF

brelade,

Sorry about that OT= off topic, or in other words I was going to digress
from the subject of the thread.

Vista...nope. I won't bother even testing with it until SP1 comes out after
the first of the year, and even then I don't plan on moving to it for
production work for as long as I can hold out. In fact, I just bought an
extra copy of XP pro in case I don't get around to replacing my laptop
before I can't get XP installed by the manufacturer. MSFT just extended that
for another year, apparently cuz there are a lot of people like me that
don't want to make the change over. Vista is such a resource hog, that it
wouldn't even run on three of my machines.

As per the width of the page, I have decided perhaps I need to be more
flexible with that. MSFT added a 984 pixel wide default width to the choices
in Publisher 2007, along with 760 and 600. Also I just bought a new mouse
that has horizontal scrolling built into the wheel, apparently just for
people like you ;-) Those things gave me pause. While I still prefer a more
narrow page and think that wide pages that require horizontal scrolling to
read should be avoided, who am I to buck what seems to be a growing trend.
And FWIW (for what its worth ;-) I do have a 19" monitor...I just don't want
to have to view a website full screen. I typically have multiple windows
open and each are around 700 pixels wide. This means I can read all the main
content without horizontal scrolling of pages that are less than 800 pixels
wide....just the way I prefer to work.

As Mike points out, your home page is still very slow to load, but then it
is very graphical intensive. I suspect you have, but if not, be sure to run
the graphic compression feature on all the images. I didn't say anything
this time about the width or the loading time, simply because I wanted to
compliment you on the progress you had made...not criticize what still
needed to be tweaked.

And I did check the site in FF, IE6 and Opera as I was curious if the new
navbar worked ok in those three. I wasn't able to reproduce Mike's issues.
You gotta forgive him. He builds his sites using Web Plus which generally
have better cross browser support than Publisher sites, and he likes to poke
us with a stick about it every once in a while. <grin>

DavidF
 
M

Mike Koewler

David,

Hey, this time I didn't mention that other program! I'm not sure why I
get the screenshot I posted and others don't - I presume Mozilla and FF
are using the same engine.

As I start updating sites (after the Christmas break) I will probably
move to 900 pixel pages, if my stats keep showing a downward trend of
viewers using 800. Or at least consider it.

Mike
 
D

DavidF

Hi Mike,

I was just kidding around. I knew you would read it.

I assumed that Mozilla and FF used the same engine too. Maybe its only
computers in Ohio that have problems <grin again>.

As per the size of the page, I think it depends on what your content is. In
brelade's case, he has a site which is based more on graphics than mine. A
wider page seems to make more sense in that case. Mine is more informational
or text based, and I just don't see a need for a wide page...in fact, I
think that it becomes harder to read if the text boxes are too wide. You are
the expert in print. Hasn't there been studies that suggest text columns
should be no more than a certain width or number of words for easy reading?

DavidF
 
M

Mike Koewler

David,

Not that I know of. Newspapers and magazines use columns that generally
are about 2.5 to 5 inches wide, depending on the format. I'm not sure
why - it probably has something to do with selling ads.

I know the articles I put on my pages would not be fun to read if they
were on a 1000 pix wide page.

One conundrum about wider pages is they allow more images or wider
images. But then they take longer to download.

Mike
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top