I am attempting to make a small gallery like the one shown below -

I'm sure you've all seen them considering they are fairly common. When trying to make one using bootstrap I ran into a major problem. I can't seem to link the smaller bottom images to the larger top one that was when one of the smaller ones is clicked it changes to the selected image. I am attempting to use data-slide-to however it does not seem to work outside of the "carousel-indicators". I can't put it into the carousel indicators list because that moves the images up into the gallery (It may be possible to fix this with CSS but my attempts have been worthless). Does anyone know the problem? I've tried tags around each image that didn't seem to work then I tried divs. Still nothing.

Things to note:

• I am using 3.0.0
• All images are generated (if you haven't guessed already)
• Smaller images are separate from larger one (not auto scaled down)