Fotorama thumbnail images not displaying -grey block & no image on click

Question

I'm having some display issues with Fotorama 4 and I cannot get my head around how to fix it.

When I preview the code in codepen.io it looks fine but then when I put it into the wix website I am working on for a client some of the thumbnails are just grey blocks and when I click on them no image shows.

I'm thinking maybe I've messed up somewhere. I customised the regular code so that I had a text display on the first image only and that the text will disappear on hover. I am still very new to customising code so any suggestions are helpful!

Here is the customised code I am using: http://cdpn.io/Dyfus

As github gist: https://gist.github.com/NiaMuneca/6173379

If you have any idea what the issue is please point it out and leave the tested correction below.

Answer 1

Your layout is just wrong. Replace this:

<img src="1.jpg"><img src="1_thumb.jpg" /></a>
<img src="2.jpg"><img src="2_thumb.jpg" /></a>
<img src="3.jpg"><img src="3_thumb.jpg" /></a>

With this:

<a href="1.jpg"><img src="1_thumb.jpg" /></a>
<a href="2.jpg"><img src="2_thumb.jpg" /></a>
<a href="3.jpg"><img src="3_thumb.jpg" /></a>