Image Gallery and Slider

In this video we're talking all things image galleries and sliders! We'll talk about how to create an image gallery and how to use it well!

Introduction

This support article is designed to guide Churchly users through the process of adding image galleries and sliders to their website. Follow these steps for a straightforward walkthrough.

Step-by-Step Guide

How to Add an Image Gallery

Step 1: Add a New Block

Hover over the last block of your page and select "Add Block."
Choose the option for an "Empty Block" to start with a clean slate.

Step 2: Insert a Gallery Widget

Click on "Add Widget" and select "Gallery" from the menu.

Step 3: Add Images to the Gallery

Click on "Add Image." You can upload images directly or add images that are already present in your Churchly media library.
To add multiple images, consider organizing them into a folder (e.g., a folder named "VBS").
Select the images you want to include in your gallery. Clicking an image should mark it with a blue box and a checkmark indicating selection.

Step 4: Adjust Gallery Layout

By default, the gallery might display images in a carousel layout. To change this, click on the gallery and then hit "Edit Settings."
Switch to a "Grid" layout for a more appealing presentation and adjust the padding around images for better spacing.
Choose image aspect ratios (e.g., square, widescreen) and ensure "Images should fill their container" is selected for a uniform look.
Enable "Open images in lightbox" for a fullscreen image view on click.
Decide on the number of images per row. Adjusting this can help in achieving a cleaner, more organized look.

Step 5: Add Text and Space Around the Gallery

Use the text widget to add a title for your gallery, e.g., "VBS Photo Gallery."
Add descriptive text below the title to guide users, like "Click an image below to view larger."
Insert space widgets above the title and between the title and descriptive text to ensure there is breathable space around text elements, enhancing the design.

Step 6: Preview and Save

Click on "Preview" to see how your gallery looks on the website.
Save changes if you're satisfied with the layout and appearance.

How to Add a Slider

Step 1: Add a New Block for the Slider

Add an empty block by following the same steps used to start the gallery.

Step 2: Insert a Slider Widget*

Select "Slider" from the widget options.

Step 3: Customize Your Slider

Add slides according to your needs. Each slide can be customized with background images, text (font size, color, position), and various styling options.
Make your slider full-width for a more immersive experience. Adjust the size of the slider to ensure it stands out.
Customize slide transitions and durations under the styling options to match your preference.

Step 4: Considerations for Using Sliders

Limit the number of slides to 2-3 to optimize for Google's search engine preferences.
Ensure the content on sliders is concise and engaging, as users are unlikely to interact with sliders that contain large amounts of text or very complicated visuals.

Step 5: Preview and Adjustments

Preview the slider and adjust any elements as needed for optimal display.
Keep in mind sliders might not be suitable for every site design.

Step 6: Finalize and Save

Once satisfied with the arrangement and appearance, save your changes.

Need Further Assistance?

If you have any questions or need further assistance, click on the "Need Some Help" button on your dashboard to reach out to our support team. We're here to help you make the most out of your Churchly website and ensure you can effectively reach your community.