LightBox automatique sur les liens vers des images (TinyMCE et CMS Made Simple)

Un mini tuto pour expliquer comment activer automatiquement Lightbox quand on défini un lien vers une image avec l’éditeur TinyMCE sur CMS Made Simple. il faut bien sur que vous ayez installé au préalable le module Lightbox depuis le gestionnaire de modules de CMS Made Simple.

Pour activer Ligthbox sur un lien il suffit de définir l’attribut rel avec la valeur Lightbox. Il faut donc définir cette valeur lorsqu’un lien est défini vers une image. On va donc allez dans le fichier modules/TinyMCE/templates/filepicker.tpl et changez ce code (ligne 18) :

{if $isimage=='1'}
  // for image browsers: update image dimensions
  if (win.ImageDialog.getImageData) win.ImageDialog.getImageData();
  if (win.ImageDialog.showPreviewImage) win.ImageDialog.showPreviewImage(URL);
{/if}

par :

{if $isimage=='1'}
  // for image browsers: update image dimensions
  if (win.ImageDialog.getImageData) win.ImageDialog.getImageData();
  if (win.ImageDialog.showPreviewImage) win.ImageDialog.showPreviewImage(URL);
{else}
  //lightbox pour les images
  if(filename.indexOf('.jpg') != -1 || filename.indexOf('.jpeg') != -1 || filename.indexOf('.png') != -1 || filename.indexOf('.gif') != -1)
    win.document.getElementById('rel').value = 'lightbox';
  else
    win.document.getElementById('rel').value = '';
{/if}

On définit donc l’attribut rel avec la valeur Lightbox pour les fichiers images (extension jpg, jpeg, png ou gif) ou on supprime l’attribut rel si ce n’est pas une image. Voila, c’est tout, vos liens vers des images utiliseront automatiquement Lightbox pour s’afficher.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.