Unbounce: How to Create an Image Gallery

If you want to try out Unbounce yourself for free for 14 days and then get 20% off for the next 3 months after the free trial, sign up using my link:

https://unbounce.grsm.io/ivan?sid=u-imagegallery-1

Link used in the video with instructions: https://community.unbounce.com/t/how-to-add-an-image-gallery-to-unbounce-no-code-required/3698

My Unbounce playlist so you can find every important piece you need:
https://www.youtube.com/watch?v=p6JljKqlwFc&list=PLS46f4aLJ2hOdr6ZRw-9cnSXVWfa0r86i

If you need help with a specific issue and want me to personally take a look at your setup, I can help! Check out the ‘My Services’ section of my blog: https://amarketingessentials.com/my-services/

Hey all!

In this video, I show you how to create an image gallery on your Unbounce landing page. This is a cool and useful way to showcase images or pictures that you have to people browsing your website, especially if you are a real estate agent, photographer, and so on.

The process is not complicated and doesn’t require any code, so let’s jump straight into it.

1. The first thing we need to do is create a button that will take users to the lightbox. So create any button that says “click me” or something of the like and under “Action” select “go to lightbox”. You should now see a lightbox tab in addition to the regular tabs in your Unbounce edit screen.

2. Now you can click on this lightbox tab and start adding your images!

You would simply drag the image element into this lightbox and upload or add whatever image you want. You can even include several if you want. If you are having trouble adjusting the image dimensions, check out my video where I show you how to easily adjust them here: https://www.youtube.com/watch?v=YJZCXLRwaes&list=PLS46f4aLJ2hOdr6ZRw-9cnSXVWfa0r86i&index=11

In fact, you can even add videos to this Unbounce lightbox and have users see testimonials or the like if you prefer. Anyway, now that you have added an image, it’s time to add more buttons to that lightbox!

3. Simply repeat the process from the first step – drag the button onto this lightbox.

You might want to make the button circular to replicate what an arrow might look like, and you can change the background color and the likes, but there is limited customization options when it comes to the actual button shape.

But regardless, you would want to add an arrow on the right and left side so that people can go “forward” or “back”.

You can use the position element here to give exact location of the button and maintain it’s consistency across other lightboxes, which we’ll get to in a bit.

But after you add these boxes, you just have to select “go to lightbox x” under “Action” and enter the lightbox you want to take people to upon clicking the button.

That means taking users to lightbox 2 as right-hand button if they’re on lightbox 1, and taking them to lightbox 1 if they’re on lightbox 2 for the left-hand button.

4. Now you just create another lightbox and keep going until you’re happy with the number of “slides” you have.

You would repeat steps 3 and 4 until you have enough arrows and lightboxes.

Just make sure to add the 2 buttons to every lightbox you make and go to each of them and set the action to “go to lightbox”, as we forgot to do that for our first lightbox left-hand button in the video.

That’s it!

Here is your link to the free Unbounce 14-day trial: https://unbounce.grsm.io/ivan?sid=u-imagegallery-2

Do you have any ideas or video topics about Unbounce or anything else you would like me to cover?

Write down in the comments below what you would like me to make a video on!

Most of my videos I made were requests/suggestions from subscribers, so don’t hesitate to let me know as well!

Like my Facebook page! https://www.facebook.com/onlinemarketingessentials

Thanks for watching, and I’ll see you in the next video!

source