Come disabilitare il destro del mouse solo nelle immagini per impedire di copiarle.

Il furto di contenuti è una delle piaghe del web e cercare dei meccanismi che lo impediscano o comunque che lo rendano più difficile è una attività costante degli webmaster. Ho già ampiamente sviluppato il tema nel post come scoprire chi ti copia e dato alcuni consigli di comportamento se siamo sottoposti nostro malgrado a questa pratica. D'altra parte se ci copiano gli articoli è comunque un sintomo che stiamo facendo un buon lavoro.

Un capitolo a parte lo merita l'appropriazione indebita di immagini. Pensate a quei blogger che per creare una foto, che può essere artistica o facente parte di un tutorial, impiegano ore e che poi se la vedono ripubblicata da un'altra parte senza neppure il link di attribuzione. Un metodo radicale per combattere questo malcostume è quello di disabilitare il destro del mouse ma in questo modo si impedisce qualunque interazione immediata con il nostro sito come per esempio il copiare un nome di un prodotto, un software, un indirizzo, un link, ecc.

Ho quindi pensato di rendere la cosa più soft e di presentare un sistema per disabilitare l'utilizzo del destro del mouse solo sulle foto o, meglio ancora, solo su alcune foto che vogliamo impedire che vengano copiate. Non occorre inserire nessun javascript o altro codice nel modello quindi non si appesantisce il sito in alcun modo. Per rendervi conto di quello che dico provate a cliccare con il destro del mouse nella immagine seguente

Apparirà una finestra che avvertirà l'aspirante ladro di immagini che non è il caso di farlo

Per fare in modo che anche nelle vostre foto possa accadere una cosa simile, occorre semplicemente aggiungere questa stringa

oncontextmenu="alert('TESTO');return false" oncopy="alert('TESTO');return false"

subito dopo il tag <img come mostrato in questo screenshot

e prima del tag src= che precede l'URL della foto. Questo può essere fatto dopo che si è inserito l'immagine nell'articolo mediante l'editor di Blogger o Windows Live Writer. Occorrer però che prima venga caricata su Picasa o altro hosting, si acquisisca l'URL e si inserisca con questa modalità nel post.

Si può anche inserire tutto il codice direttamente in modalità HTML sostituendo i parametri evidenziati di rosso

<img src="URL DELLA IMMAGINE" oncontextmenu="alert('TESTO VISUALIZZATO');return false" oncopy="alert('TESTO VISUALIZZATO');return false"/>

Al posto di TESTO VISUALIZZATO vi potete sbizzarrire come volete con frasi divertenti,ironiche o più serie.