Welcome to the OpenCities help centre. Search for what you're after, or browse the categories.
Can't find what you're looking for? Submit a support ticket and we'll be in touch.

Follow

About image galleries

avatar of Kira Hartley

Kira Hartley

Last updated

The OC Image Gallery content type is great for organizing and showing many images at once. First, you create an image gallery and then add the gallery to pages through the WYSIWYG editor. 

Each gallery presents images in a grid, with the ability to expand the images by clicking on them. Once maximised, the images turn into a navigable slide-show format. They also show captions while hovering your cursor over the image, or when viewing the expanded version.

The images in your gallery will present in the order you've added them to the gallery. They will arrange into a left-to-right grid, with three images per row when viewed on desktop.

Below are two examples of image galleries added to a page. If you want your image gallery to have a uniform presentation, as per the example on the left, make sure all images are the same dimensions. If you have images of different sizes and orientation, they will be scaled as best as they can, as seen in the gallery on the right.

2 examples of image galleries, one with regular dimensions and one without regular dimensions

Additionally, there are some content types that have built-in image galleries. The OC Venue, OC Park, OC Consultation, OC Project, OC Event, OC Business, OC Directory and OC Development Application content types have an image gallery available in their page fields, within Supporting Information. For all other content types, use the OC Image Gallery when you need to include multiple images on your pages.  

If you edit the original image gallery page, the changes will be updated on the page the gallery is added to. 

Tips for best practice

  • Galleries are good for groups of 3 images or more, especially if those images need captions.
  • Always use high-quality images with captions and alt-text. Images will expand to their full size, so make sure they're high in resolution. However, keep the file size in mind as well. Generally, it's best to use images up to 500kb in size to cut down on loading time.
  • Make sure you add alt-text to all your images. For image galleries, alt-text can be added in the description field while adding your images.
  • It's always best to use images you own, or from your community that you have permission to use. You can use stock imagery, but be mindful of licensing and attribution.
  • Avoid images with text. Any text should be presented as captions.

What's next?

  1. Create an image gallery
  2. Add an image gallery to another page
  3. Manage the Image Gallery module
Was this article helpful?
0 out of 1 found this helpful