Cette action va rendre très compliquée la récupération d'une image en empêchant l'utilisation du clic droit.
Et pour les malins qui pensent utiliser l'url de l'image pour la récupérer, ils ne seront pas déçus 😀
il ne reste plus que la copie d'écran !
🆙 image_secure : Affiche une image de manière à compliquer sa récupération

Cliquer pour lire la documentation

syntaxe {up image-secure=chemin_image}
@author: LOMART @version: UP-1.8 @license: GNU/GPLv3 @tags: image
  • image_secure: chemin relatif vers image jpg ou png
  • folder-source = images: dossier racine des images originales
  • folder-strip = images/image-secure: dossier avec les images fractionnées
  • nb-strip = 5: nombre de bandes
  • alt: texte alternatif pour image. Si vide: nom du fichier humanisé
  • quality = 80: pourcentage qualité en JPG
  • reset: force la génération des images strip
  • delete-source: supprime l'image source après génération des strips

Style CSS

  • id: identifiant
  • class: classe(s) pour bloc
  • style: style inline pour bloc
  • css-head (base-css): style ajouté dans le HEAD de la page

Un exemple simple 

L'image ci-contre est affichée avec ce shortcode :

{up image_secure=images/photos/macaque.jpg}

Je vous souhaite beaucoup de courage pour la copier !

La même en version modale avec ce shortcode :

{up modal | label=voir la photo des macaques}
{up image_secure=images/photos/macaque.jpg}
{/up modal}	
voir la photo des macaques
MacaqueMacaqueMacaqueMacaqueMacaque

Le principe


Comme le ferait un destructeur de document, UP va découper l'image en plusieurs bandes.

Votre "emprunteur" devra recoller les morceaux pour avoir une image exploitable.

Un premier niveau de protection est mis en place. Il s'agit d'un simple overlay avec une image transparente au nom évocateur de "no-copy"

Gêner la copie d'écran

Pour empêcher la copie d'écran, vous pouvez ajouter un logo ou une signature avec l'action image-logo

{up modal | label=[b]voir la photo des macaques[/b]}
  {up image-logo=images/actions-demo/image-logo/up-lego.png}
    {up image_secure=images/photos/macaque.jpg}
  {/up image-logo}
{/up modal}

Les options

image-secure

Le chemin vers l'image originale au format jpg ou png

Vous pouvez omettre la partie racine du chemin. Voir folder-source ci-après.

folder-source
folder-strip

Il s'agit des dossiers racines pour les images originales (source) et les images en bandelettes (strip).

Reprenons l'exempe précédent pour comprendre le principe :

L'image originale est "images/photos/macaque.jpg", mais on aurait pu utiliser "photos/macaque.jpg" puisque par défaut "folder-source=images".

L'intérêt du dossier racine n'est pas de simplifier la saisie, mais de montrer la partie non significative du chemin.
Par défaut le dossier des images découpées est "images/image-secure". Donc nos photos en tranches seront dans le dossier images/image-secure/photos.

nb-strip

5 par défaut, vous pouvez découper votre photo jusqu'à 99 bandelettes.

alt

Par défaut, UP utilise une version humanisée du nom du fichier. Cette option vous permet de choisir le texte alternatif. 

quality

80 par défaut, il s'agit du niveau de qualité (0-100) lors de la création des images bandelettes

delete-source

Pour les angoissés ou pour un gain de place, cette option entraine la suppression de l'image originale après la création des bandelettes.

reset

A utiliser pour supprimer les images bandelettes. Elles seront générées à nouveau

A noter qu'un "reset" est forcé si la valeur de l'option "nb-strip" est différente du nombre d'images-strip.

Important : heureusement, cette option est incompatible avec "delete-source"

id
class
style
css-head

Comme de coutume, ces options permettent de styler le contenu

Pour info, cette page utilise 12 action(s) :
icon (1) upactionslist (1) modal (2) image_secure (3) flexbox (1) flexauto (1) image-logo (1) csv2def (1) jcontent-info (1)