Bringing in Multiple Images Together?

Hi everybody. Is there any way of bringing in multiple images at the same time into a HTML page in Dreamweaver? I am trying to place about 70 small thumb nails on the same page. At the moment I have to bring them all in, one at a time, which takes forever! If you could just select a folder and bring all the images in that folder in to your page together, ordered as they are in the folder that would be a lot quicker. Thanks for your help.

Copy & paste this code into a new, blank document. SaveAs gallery_test.php. Change php code to point to your Gallery/thumbs and Gallery/slides. If you don't have a local testing server, upload to your remote site to test.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5 Document</title>


<script src="http://code.jquery.com/jquery-latest.min.js"></script>

<link href="http://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.css" rel="stylesheet" media="screen">
<script src="http://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.pack.js"></script>
<style>
    padding: 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
body {
    margin: 0;
    padding: 0;
    background: #08035F;
    color: #333;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
    font-siz: 100%;
#wrapper {
    width: 1000px; /**adjust width in px or %**/
    margin: 0 auto; /**with width, this is centered**/
header {
    background: #355DA0;
    width: 100%;
    margin: 0 auto;
    color: #FFF;
#inner_wrapper {
    background: #CCC7B3;
    overflow: hidden; /**float containment**/
aside {
    float: left;
    width: 14%;
section {
    background: #FFF;
    width: 72%;
    float: left;
    margin: 0 auto;
/**Begin image gallery styles**/
.thumbs { /*divs that hold gallery pictures*/
    float: left;
    margin: 0.5%; /*space between thumbnails*/
    border: 1px dotted #CCC;
    /**same size images**/
    width: 135px;
    height: 99px;
    opacity: .70
.thumbs a { /* in every .thumbs div there is a hyperlink exactly the size of the container */
    width: 135px;
    height: 99px;
    text-indent: -99999px; /*move text links off screen*/
    display: block;
    outline: none;
/**on mouse over**/
.thumbs:hover { opacity: 1.0 }
/**end gallery styles**/
footer {
    clear: both;
    background: #222;
    width: 100%;
    color: #FFF;
    margin: 0 auto
</style>
</head>
<body>
<div id="wrapper">
<header> <h1>Header</h1>
<nav>Navigtion</nav>
</header>
<div id="inner_wrapper">
<aside> LEFT ASIDE </aside>
<section> <h2>Dynamic Thumbnails go here</h2>
<?php
$directory = 'GALLERY/thumbs'; //path to your thumbnails
$link = 'GALLERY/slides'; //path to your full-sized images
$allowed_types = array('jpg','jpeg','gif','png');
$aFiles = array();
$dir_handle = @opendir($directory) or die("There is an error with your image directory!");
while ($file = readdir($dir_handle)) //traverse through files
if($file=='.' || $file == '..') continue; //skip links to parent directories
$file_parts = explode('.',$file); //split filenames and put each part in an array
$ext = strtolower(array_pop($file_parts)); //last element is the file extension
$title = implode('.',$file_parts); //what's left is the filename
if(in_array($ext,$allowed_types))
$aFiles[] = $file; //filename array
closedir($dir_handle); //close directory
natsort($aFiles); // natural sort by filename 01, 02, 10, 20
$i=0;
foreach ($aFiles as $file) {
$file_parts = explode('.',$file); //split filenames and put each part in an array
$ext = strtolower(array_pop($file_parts)); //last element is the file extension
$title = implode('.',$file_parts); //what's left is the filename
$title = htmlspecialchars($title); //make it html-safe
echo '<div class="thumbs" style="background:url('.$directory.'/'.$file.') no-repeat 50% 50%">
<a class="fancybox" data-fancybox-group="gallery" href="GALLERY/slides/'.$file.'" title="'.$title.'">'.$title.'</a>
</div>';
$i++; //increment the image counter
?>

</section>
<aside> RIGHT ASIDE </aside>
</div>
<footer>Footer</footer>
</div>

<script>
$(document).ready(function() {
    $('.fancybox').fancybox();
</script>
</body>
</html>
Nancy O.

Similar Messages

Editing multiple images in main window - PSE 9

In PSE 8 I was able to bring up multiple images in the main window to edit simultaneously. In PSE 9 I can't seem to find a way to reduce the image so that I can slide another one alongside it. Any ideas? Thanks.

Adding to Barbar's comment.
1 .Also to see the images directly choose the "Windows>Tile" option to see all images at a time.
2. If this is cluttering your space (if large number of files are opened) then choose the "Arrange Documents Option for 2, 3 or more images. This option is located at the top beside the menus or above or below the menus.

How to post multiple images in one blog post using iweb

Hi
I would like to post multiple images in a single blog post. When ever I add a second or third image in the "entry" section of iweb, it does not show up in the blog post on the homepage of the blog. does anyone know if it is even possible to have multiple, separate images in one post, and if so, how.
Here is a link to my blog: http://www.hoopography.com. You can see how there is only one image. I I want to talk about multiple items, I need to create an image in Pages and put them all together. I would really like to break out of the one box (placeholder) mold. I feel so constrained in iweb right now. I think I have done a lot with my blog, but I am always looking to learn more about iweb and improve my blog. Thanks for any help!!!

what's the url of your blog? I'd like to check it out. I'm always interested in learning more about iWeb to improve my blogs. Mine are: http://www.hoopography.com and http://www.wnysportscards.com

Exporting a template with multiple images

Let's assume I want to have a large print made at an outside commecial lab because my printer does not handle the size.
In the Print Module, is there a way to export a template with multiple images so that it can be sent to an outside lab for printing?
Or, is this not possible and I would have to design the template in Photoshop and send the file to the lab?
If Lightroom is not yet capable of this, it certainly seems like a worthwhile feature.

Thanks for sticking with this thread to help me.
I am on Windows and I do have PDF capability, the full Adobe Acrobat Professional.
I have been experimenting with your suggestions and, yes, saving it as a PDF and bringing it into Photoshop is a workaround. The images and Identity plate come into Photoshop as they appear in the template in Lightroom.
What doesn't appear in Photoshop is the whitespace(margins)around the images. They appear in the PDF, but they don't appear when I open the PDF in Photoshop. Is there a setting I'm overlooking in the PDF settings dialog that will correct this? Or, is this just the way importing a PDF works when it comes to margins? Must I always go to Image/Canvas size to get the canvas I want? Is there a way of not having to do this?

I am trying to import photo's on i photo. It downloads all of the pictures on my camera, how do i only select the photos i want? Is there a way to do this without selecting one photo at a time? is there a way to select multiple images? thanks!

I am trying to import photo's on i photo. It downloads all of the pictures on my camera, how do i only select the photos i want? Is there a way to do this without selecting one photo at a time? is there a way to select multiple images? thanks!

To select consecutive images click and drag the cursor over multiple thumbnails to select all at once.
To select multiple images that are randomly located hold down the Command(⌘) key and click on those images you want to select.
Or to select consecutive images from a list of images that are together hold down the Shift key and and click on the first photo you want to select and the on the last photo you want in the list.
OT

Multiple images in pscs5 when importing from bridge

Hi Guys
Hope someone can throw some light on my problem?
When I bring an image from bridge into photoshop CS5 the image sometimes (more than I would like) breaks up into multiple images in the same window. (see attached example). It was suggested that my video driver may need updating but on checking I have the latest drivers!
This problem has only been happening for about a month and everthing was working fine before that. Im running win7pro 64 bit and am running photoshop from my ssd drive. The display driver is a Nvidia Geforce 240 which again has been fine previously. Would it be worth unistalling/reinstalling the program, just a thought!
Any help from you guys would be more than welcome.
Thanks trev

Chris and Noel
Thank you both for your advice. Chris I tried the update driver from Nvidias web site and it also said that my driver was uptodate 'do you want install anyway' which i did! It made a slight difference but still the problem showed up, so I disabled the Open gl drawing box in preferences menu and then reset it changing the advanced setting to normal in the advanced menu. This seemed (not holding my breath) to have done the trick! and Noel I saw the option for what you have said but I didnt have the confidence to go manual, that'll be my plan B.
Thanks again guys, I'll be back for more advice
Trev

How to open multiple images in photoshop cs3

Hey, what im trying to do is open multiple images in photoshop cs3 and then blend the images together. But the problem that i am facing is that i can only open one image at a time. Can someone tell me step by step how to do this.
Thanks for the help
Michael

i dont belive i have tabbed view, what i just did, was i draged one photo into phtoshop and then another. When i look to my right, only one iamge shows up in the layers and the other seems to have dissappeaed.
It seems that having a tabbed view is useful, how do i set photoshop to this?

Editing multiple images at once..

I use Aperture as a key app in my workflow to make panoramic images, and I would have loved the ability to select multiple images and do adjustments that applied to a whole selection without the need for lift and stamp. In my eyes that would be sooo much smoother than the current approach.
Anyone else with this need?
Sincerely,
Kjell Are Refsvik

I've been doing all the main pano-editing in Photoshop, and then bringing a reduced copy of the final into Aperture, but now I'll bring in the final copy as a referenced file.
A little workaround for adding info for non-image files such as QTVRs - make a custom metadata tag such as 'QTVR path', use a path-copying contextual menu such as Path Snagger to grab the location of the QTVR file and paste it into the tag. If you use a unix path it's then easy to copy the path, swap to the Finder and hit Command-Shift-G to 'go to folder'.
There was an AppleScript somewhere on the forum that would export images from multiple Albums to a folder structure where each folder had the same name as the Album, that's also very handy for batch-exporting a load of panos.
I've taken this idea a bit further and made a rough helper app which exports all Albums within an Aperture Folder to their own folders in the Finder, makes a PTGui project file, loads the project file, finds control points and then saves the file again. Email me if you want a copy to play around with.
Ian

How to resize multiple images?

I am newbie to RH and would like to know if there is a method /shortcut by which I can resize multiple images?
Specifically to my project: I have close to 50 tables containing various images and their descriptions. When I insert these images into RH, the original image size is inserted and these images are of various sizes.
I know how to resize multiple images in Word but not in RH and hence, reaching to higher powers
I am using RH 9
Appreciate all your help!

Hi There, Well the best option is to resize each image individually but if you feel that you can select all images together and the resize them all at once I am sure that you would like to give a read to this post from forums which talks about this job
http://forums.adobe.com/thread/466933

Downloading Multiple Images

Hi all,
I am using NWDS 7.0. I have an requirement to download multiple image files.
Images can be viewed by clicking the links provided in the tablecolumn. Images(JPG) are in mime folder. if i use the Fiel Download UI Element, it is openning multiple windows for downloading multiple images.
But i need in such a way that if i click the check boxes in the table the corresponding images has to be downloaded in my local system in the action of button functionality under the table. How to do that.
Please bring me an solution it would be helpful for me.
Thanks in advance
Regards,
Malar

Hi Thenmalar
Check these thread
1.[Images through Java API|Re: Unable to manage Images through Java API;
2.[Upload and Download |https://www.sdn.sap.com/irj/scn/go/portal/prtroot/docs/library/uuid/b0e10426-77ca-2910-7eb5-d7d8982cb83f]
3.[Uploading Multiple Offline Forms in Web Dynpro Java|https://www.sdn.sap.com/irj/scn/go/portal/prtroot/docs/library/uuid/302bdc70-9ece-2b10-e9b6-c7309eab601b]
This thread(3) will help u to understand of downloading multiple item.
Now for runtime selection and display is easy ,Just on click on check box internally we have to pass the id
(name of the image )through context like
if(checkbox 1)
wdContext.currentContextElement().setImage("abc.gif");
if()...
Best Regards
Satish Kumar

Multiple Images Questions

Hi,
I am a total beginner with Flash however I have bought a
template for my website and wish to make some additions to it.
Basically when the template loads up it always has a main
image present and the page options down one side. What I would like
to do is have multiple images set for the opening image so that
everytime you enter the site you will view a different main image.
I'm sorry if I haven't explained this correctly. If you
follow this link www.gsa.ac.uk and hit refresh a few times you
should get what I mean.
Is there some sort of online guide I can follow to do this ?
Thanks
Euan

Aperture excels at converting your digital negatives from RAW, organizing them in any way you want, and developing each Image to be as good as you can make it. It is not, however, a graphics program -- the difference being, primarily, that graphics programs are built from the ground up to perform compositing. Photoshop, and the like, are excellent at compositing. Aperture is not.
The answers to your questions:
1. No.
2. This is actually a more complex question than it seems. With Aperture you can Lift adjustments from any Image and Stamp them onto any other Images. For panoramas, however, what you want is not "the same exposure _adjustment_", but rather the same final exposure. There is no way to do this, afaik, in Aperture. Good panorama stitching programs will make adjustments for you to even out the shot-to-shot variation in exposure. You should not use any automatic exposure modes when capturing the pictures you intend to stitch together.
3. Let the panorama program do it for you. I make RAW captures, convert and stack in Aperture, export as TIFFs, create the panorama (I've used Hugin -- open source and free -- and found it excellent for my modest needs), import it into Aperture and set it as the Stack Pick. I use Aperture to make adjustments to the imported panoramic Image.
Message was edited by: Kirby Krieger -- link added.

How To Place/Open Multiple Images Into Separate Layers For ONE Document?

I've been searching for the answer for a long time so I figured that someone here has to know. I have PS Elements 9.
So I would like to make GIFs and I know how to do so, the problem is placing in those tens of files in layers (it's tedious). Is there a way to select multiple image files to place into a single document? And for them to be place into its own layer? I've tried dragging and selecting from the Open/Place menus (won't allow), SHIFT + Direction Key from the Open/Place menus (won't allow), tried opening them to drag on the Organizer and to drag from the Project Bin (again won't allow), and I've read tutorials where they say to use scripts and actions but I'm not sure what to download them in order for them to work and the links are broken anyway.
An example of what I'd like to do:
Open and place in 15+ screenshots into layers but in just one document.
Each screenshot would be one layer in said document.
...rest of GIF process...
I feel like there's an easier way to get this without placing in each one at a time. I remember being able to do this on a old PS (though not Elements). Thanks for any help.

The quickest method is probably opening all images together from Full Edit:
File >> Open
Then navigate to the folder and use shift+click to select a block of files.
The images will appear in the photo bin. Drag and drop each one into the main editing window and a separate layer will be created for each.

Multiple image download from form.

I have a form on form central that uploads images. Since there are a lot of images being uploaded I need to know if I can download multiple images at once or do they have to be downloaded one at a time?

Hi,
Yes, you can download multiple images at once, select the entire column that you have the attachments (or the cells that you have attachments) and then RIGHT click on any attachment within the selected column(s), this will bring you the righ-click context menu, select "Download Selected". All your files will be saved in a *.zip file.
Hope this helps.
Thanks,
Lucia

Saving multiple images while in bridge after editing in CR

I have a question involving saving multiple images while in Bridge after they were edited in camera raw PS CS4. I usually view my images in Bridge and select the ones I want to edit in camera raw. I then open the images in camera raw and make the edits which I want to the first image of the group. I then click on the select all button on the top left corner. I then click on the sychronize button and choose the edits from CR which I want to carry through the whole group of images. I then click on the save images button on the bottom left of the CR page. This now brings me back to bridge where I'm looking at the images in their edited version.
This is where the question begins. At this point, I thought the edited made in CR were saved to the images folder located on my computer. But up to this point when Ive gone back to the image folder and looked at the images they were still in their original unedited state although the edited versions showed up in Bridge.
At the point, where I am looking at the edited photos in bridge, do I have to go through another step to save the edited images in Bridge so they will transfer over to the image folder where the images are stored in my computer?

I was looking for the metdata in another window. Ok . I found it and HQ thumbs was checked already. I can see the edits from CR in the Bridge window.
After I check save image in CR, does the edited info get saved only to Bridge or should that be saved all the way to my image folder?
The problem is that when I exist Bridge and look in the image folder the changes I made in CR are not there. How do I get those changes from CR saved to my computer (my pictures)?

Stitching multi layered images together?

Is there a way to stitch multiple multi-layer files together?
I'm using Cinema4D render passes and it puts all the image passes (reflectivity, ambient, specular, etc) into separate layers for easy manipulation. However, I'm using a tile camera that splits the image into quadrants for faster network rendering. The downside is that it doesn't re-assemble the images back together.
Is there a way for Photoshop to glue multi layered images together?

I have not tried to do this. As Mark stated flatten them first save a copy and merge those.
Although you could try and report back. Keep in mind that Photoshop needs some overlap to stitch images together. If its just sliced into 4 quadrants just make a Blank file the correct size and dupe all layers and point them at the new file.

Bringing in Multiple Images Together?

Similar Messages

Maybe you are looking for