How to create a responsive image gallery in WeWeb?

Step 1: Open WeWeb

To start creating your responsive image gallery, the first thing to do is to open WeWeb. You can locate it on your desktop or find it in your applications folder. If you do not have WeWeb installed, you can download the application from the official WeWeb website.

Step 2: Choosing a template or a blank page

Once you have WeWeb open, you can either choose an existing website from your dashboard, or you can begin from scratch by selecting a template or a blank page. If you are creating your website from scratch, choose a design that complements your image gallery.

Step 3: Entering the design mode

After selecting a site, you will need to enter the design mode by clicking the "Edit" button. This would open up a design interface where you can drag and drop elements as needed.

Step 4: Add a new page or select an existing one

If you want to include the image gallery on a new page, click on "Pages" on the left side of your screen and then select the "New Page" option. Enter the name of your new page and then press "Create". If you want to add the gallery to an existing page, simply select the page from your list of pages.

Step 5: Adding the image gallery widget

To add the image gallery, look for the widget icon on the left-hand-side menu and drag it to the section of the page where you want the gallery to be. The widget button is often represented with a square icon.

Step 6: Choose your gallery style

WeWeb offers several gallery styles to fit anybody's artistic vision. To select a gallery style, click the box labeled "Gallery Style" and pick the style that suits you best.

Step 7: Adding images to your gallery

Once you have your widget in place, it's time to add images. To do this, click on the image gallery widget that you have just added to your site. Then click on "Add Image" button. This will open a prompt where you can select images from your computer and upload them to your gallery.

Step 8: Adjusting images

In case you want to resize, crop, or make adjustments to your images, simply select the image and use the toolbox to make the necessary changes.

Step 9: Organizing the gallery

You can organize your gallery by dragging and dropping pictures to set the order. If you want to delete an image, just click on it and then press the 'Trash' icon.

Step 10: Setting gallery properties

Set the gallery properties to make it responsive. In the properties panel, set image width and height as percentages so they adjust to display size.

Step 11: Preview and Publish

Before publishing your website, click on "Preview" to review the new changes. If you're content with the appearance and functionality, click on "Publish" to make your new image gallery publicly available.

Creating a responsive image gallery in WeWeb is as simple as that. All you need to do is drag and drop elements, upload images, and adjust settings to your preference.