how to layout thumbnail and full-size pics

[5cats]

I've run across a few places where folks are asking how'd they do that?, wanting to know how to include thumbnail pictures (that you can click on for bigger) and full-size images -- interspersed with text, maybe captions -- in a single post. Here's my take. Feel free to correct/help me out here.

To include pictures in your post you will need either or both:

• image(s) attached to the post
• image(s) located on an server, accessible via public URL

Attach images using the "Manage Attachments" button in the Additional Options section below the edit window. This allows you to browse and select several images from your browser machine or specify a specific URL (at say, flickr.com). For this example, I uploaded two images from my local machine.

Returning to the text edit window, I decide I want to include a thumbnail image in the midst of text.I clicked the attachments button at the top of the edit window (looks like a paperclip) and selected the aft interior view of my soon-to-be-delivered 2007 Safari-20 SE (grin).

The previous paragraph looked like this in the edit window:

Returning to the text edit window, I decide I want to include a thumbnail image in the midst of text.[ATTACH]27429[/ATTACH]I [B]clicked the attachments button[/B] at the top of the edit window (looks like a paperclip) and selected the aft interior view of my soon-to-be-delivered 2007 Safari-20 SE (grin).

Notice the lack of line breaks around the [ATTACH]..[/ATTACH] code, which is what the attachments button inserted for me where my cursor was at the time.

Including a full-size image can be accomplished by clicking the image button at the top of the edit window (looks like a tiny mountain+sun picture) and entering a URL. I'll use the copied URL of the another attachment found below the edit window by the Manage Attachments button.

This should render fully (not a thumbnail):

Jack is a good boy.

Here's the code, partially produced by the image button:

This should render fully (not a thumbnail):
[IMG]http://www.airforums.com/forums/attachment.php?attachmentid=27428&stc=1&d=11616762 16[/IMG]
Jack is a good boy.

Notice this time I used line breaks before and after the [IMG]..[/IMG] block

Exernal images
You can only reference attachments for thumbnails, so your external image will show up full size when using the Insert image button, just as it did with the previous example. For this final example I'll again use the Insert image button, but using the web address of an image far, far away...


Stock Interstate SRM-24 Deep Cycle Marines. Opening is 14.75 x 13: more than enough for 27s, maybe 31s.

...and the code:

[IMG]http://static.flickr.com/79/277679292_03699cedb2.jpg?v=0[/IMG]
[I]Stock Interstate SRM-24 Deep Cycle Marines. Opening is 14.75 x 13: more than enough for 27s, maybe 31s.[/I]

Yeah, that is one really odd URL, I agree. Hopefully it will stay at that location long enough to be useful here. That's the risk you take when using external URLs -- word to the wise.

One last note...
I've found that attachments tend to display as thumbnails at the very bottom of your finished post. There is at least one exception: when I referenced all attached images at various points in the post using the Attachments button in the editor, the forums software seems smart enough to not display them again at the bottom, since they're already displayed before that point. I'm guessing there will be no listing of thumbnails below here, as they're already all displayed above.

I think this may clear up some things for at least one person, maybe others.

Cheers,
-jd.

[5cats]

OK, turns out there was a lurking thumbnail at the bottom after all!

In my defense the server glitched several times during the production of that post, and at one point I had to upload Jack's image again. I think that one at the bottom is the first image and I've lost the reference to it in the body of the post. Ah well, you get the point, I hope

Cheers,
-jd.