Skip navigation

How to do it?

Image to image:

  1. Insert the image
  2. Click on the inserted image and insert a link.
  3. In the hyperlink direction, you examine and attach the image again.
  4. In the tab "Advanced > Relation page to target" you select the option Lightbox.

Image to video:

  1. Insert the image
  2. Click on the inserted image and insert a link.
  3. In the hyperlink address, you paste the URL of the YOUTUBE video.
  4. In the tab "Advanced > Relation page to target" select the option Lightbox.

Gallery of images and videos:

  1. Insert images
  2. Click on each inserted image and insert a link.
  3. In hyperlink address, you examine and attach the image again or paste the URL of the YOUTUBE video.
  4. In the tab "Advanced>Relation page to target" you select the option Lightbox for each one of the images.
  5. You open the sourcecode editor and put the same number in square brackets to each tag rel = "lightbox"

So if the HTML code is:

<a href="actividad_generica_engranaje.png" rel="lightbox" title="Engranaje"> <img src="actividad_generica_engranaje.png" width="200" height="200" /></a> <a href="actividad_generica_estrella.png" rel="lightbox" title="Estrella"> <img src="actividad_generica_estrella.png" width="200" height="200" /></a> <a href="https://www.youtube.com/watch?v=cI61i-fgkek&amp;list=PLgnSGd4uwSUn8o_f31_ZCsB_mM2Q1tDII&amp; index=1" title="Vídeo de eXeLearning" rel="lightbox" > <img src="actividad_generica_exe.png" width="200" height="200" /></a>

The result would be:

<a href="actividad_generica_engranaje.png" rel="lightbox[1]" title="Engranaje"> <img src="actividad_generica_engranaje.png" width="200" height="200" /></a> <a href="actividad_generica_estrella.png" rel="lightbox[1]" title="Estrella"> <img src="actividad_generica_estrella.png" width="200" height="200" /></a> <a href="https://www.youtube.com/watch?v=cI61i-fgkek&amp;list=PLgnSGd4uwSUn8o_f31_ZCsB_mM2Q1tDII&amp; index=1" title="Vídeo de eXeLearning" rel="lightbox[1]"> <img src="actividad_generica_exe.png" width="200" height="200" /></a>