HomeQuickly Adding a Large Gallery of Photos
This is a short tutorial explaining how you'd quickly and easily upload a folder full of images from your desktop onto your website, then easily show them as a Gallery on a new page.
Preparation
Let's say you're the website manager for a parish council and you've just had a gala day in your village. A local photographer has provided you with a USB stick with a folder of 40 images to add to your website. That sounds like a lot of work, but we've built tools into Spanglefish 3 which should help to make it as quick and easy as possible.
A gallery of these photos is going to make for quite a long page, so it probably makes sense to add a new page to your site for this - let's call it Gala Day 2023.
OK, next we want somewhere to upload the photos to. Go to your images tab and create a folder called Gala-Day-2023. Maybe you already have a folder called 'Galas' in which case you can make the new folder a subfolder of that one.
Captions
This is optional - if you're just planning to show the pictures with no captions you can ignore this section and skip to the next.
It's worth understanding some things about images, captions and filenames in the Spanglefish 3 system. When a camera/phone takes a photo it'll be given a random-looking filename like P0002345.jpg. The Gallery Wizard system can use the filename as a caption below the picture, but P0002345 isn't very helpful to your site users.
So there are various ways you can change the caption, shown here in order of simplicity.
- Easiest: Edit all the filenames *before* you upload them to your website. So you might find it easiest to view the folder of photos on your desktop changing 'P0002345.jpg' to 'Joe-Bloggs-wins-the-slow-bicycle-race.jpg'.
- Moderately Easy: or you can Edit all the filenames *after* you upload them to your website but *before* you add them to your gallery. In the list of photos in your Images tab you click the 'rename' link to do so fairly easily.
- Bit of a faff: or you can Add the captions manually one-by-one *after* you've created the gallery. This is fairly slow and tedious so if you want captions you're better doing 1 or 2.
Having said that, maybe your friendly photographer has already given all the images descriptive filenames and we're ready to go!
Note that giving your images descriptive filenames is a good idea in terms of search engine optimisation too. Maybe not so important for a Gala Day but if this is a gallery of items you sell then it's well worth carrying out this step.
Upload the Images
OK, you've created a folder for the images to go. At the bottom right corner on the Images page you should see a 'multi upload' link.
This brings up the multi-upload widget. You can add files to the widget in a number of ways:
- Click the Add Files button and choose each image you want to upload. You can do this individually or by selecting multiple ones on your device's dialogue box.
- Drag photos into the widget from another window on your desktop.
- Drag an entire folder into the widget, in which case it will add any image files in the folder.
Once you're happy with your choices click the Start Upload button and the system will commence the process of uploading the files. This might be quick or take several minutes, depending upon how many photos you've chosen to upload and the speed of your connection. There are various progress indicators though which should allow you to see how things are going.
Once they're all uploaded the page will refresh and you'll see all your photos in your image bank.
The Multi Upload Screen Adding the photos to a Gallery
Great, all your photos have been uploaded to your website, but they're not yet visible to the public. It's time to add them to the page we created earlier.
Go to the page, click Add Block and choose Gallery as the block type. Now on the block click the Gallery Settings link/icon. Then at the top right click Gallery Wizard.
On the next screen you'll see that you can choose which folder in your image bank you want to populate the gallery with. In our example case we'd choose the 'Gala-Day-2023' folder. We have the option to use the filenames as captions - if the files are just named things like P0002345.jpg then you'll probably want to select Leave Blank in the dropdown but if the files all have descriptive names you want to use as captions then select 'Use Filenames'.
Then click the Add Items to Gallery button and that's it - all the photos you uploaded are now published on your Gala Day 2023 page. And with luck it only took you a minute or two.
Updating the Gallery
The Gallery Wizard is a quick way to populate the gallery, but now that you've created it you can come back any time to amend it like you would with any other gallery. Using the Gallery Settings link/icon you can change the order they're shown in, add more items or delete ones you no longer want and edit the captions. Note that the Wizard will have added them in alphabetical order depending upon the filename.
You can use the Wizard again on the same Gallery too - if you for example add another dozen photos to the folder 'Gala-Day-2023' then you can use the Wizard again, choose the same folder and the wizard will be clever enough to only add the photos which aren't already in the gallery.