Pubblicato il 15/09/14e aggiornato il

Come aggiungere un link della pagina quando ci copiano del testo o delle immagini del blog.

Come aggiungere automaticamente un link quando vengono copiati contenuto come testo o immagini.
Chi ha un blog che crea contenuti originali si sarà certo scontrato con la piaga dei "colleghi" che copiano i post immagini comprese. Mi sono già occupato diverse volte di come comportarsi quando qualcuno copia i nostri articoli e di come disabilitare le opzioni per copiare le immagini sempre nell'ottica che si tratta comunque di una battaglia lunga e difficile in cui le armi che si possiedono sono spesso spuntate.

Vi sarà probabilmente anche capitato di copiare un paragrafo di un sito e dopo averlo incollato di visualizzare un testo con l'URL della pagina da cui proviene. Questo non è certo fondamentale per fermare i copiatori ma può servire da deterrente e qualche volta le informazioni aggiunte al testo copiato rimangono.

Tynt è un sito che offre un servizio di questo tipo. Basta andare sul bottone Get CopyPaste e riempire il modulo con indirizzo email, URL del sito con .com, e non con il localizzato .it, e con la password

tynt

Si va su Continue e si visualizzerà il codice da incollare nel modello subito prima del tag </head>
 
tynt-script

Dopo aver salvato il template chi copierà anche solo una piccola parte dei nostri contenuti quando incollerà quello che ha copiato verrà aggiunto un Read More con l'URL della pagina

tynt-tracciare

All'indirizzo verrà anche aggiunta una stringa per tracciare e avere statistiche sui contenuti copiati.
Chi non ama usare servizi esterni per il proprio sito può realizzare in proprio una simile funzionalità andando su Modello > Modifica HTML e cercando la riga </body>. Subito sopra a questa bisognerà incollare il seguente codice

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
//<![CDATA[
// Aggiungere URL della pagina copiata
$("body").bind('copy', function (e) {
if (typeof window.getSelection == "undefined") return;
var miblog = document.getElementsByTagName('body')[0];
var seleccionar = window.getSelection();
if (("" + seleccionar).length < 10) return;
var nuevodiv = document.createElement('div');
nuevodiv.style.position = 'absolute';
nuevodiv.style.left = '-99999px';
miblog.appendChild(nuevodiv);
nuevodiv.appendChild(seleccionar.getRangeAt(0).cloneContents());
if (seleccionar.getRangeAt(0).commonAncestorContainer.nodeName == "PRE") {
nuevodiv.innerHTML = "<pre>" + nuevodiv.innerHTML + "</pre>";
}
nuevodiv.innerHTML += "<br/><br/>Per più informazioni leggi qui: <a href='"
+ document.location.href + "'>"
+ document.location.href + "</a><br/>&copy; Idee per Computer ed Internet";
seleccionar.selectAllChildren(nuevodiv);
window.setTimeout(function () { miblog.removeChild(nuevodiv); }, 200);
});
//]]>
</script>

Si salva il modello. Ovviamente vanno sostituite le espressioni di colore blu. Chi copierà un nostro contenuto aggiungerà sotto lo stesso anche l'URL della pagina relativa

aggiungere-link-testo-copiato 
La riga evidenziata di giallo rappresenta JQuery e può essere tralasciata se fosse già presente nel vostro modello. Lo script originale di questo hack si deve a JitBit.




5 commenti :

  1. ernesto qualche domanda per te:la scritta verde Aggiungi url della pagina copiata va cambiata o cosa?
    la riga blu per piu' informazioni leggi qui,va personalizzata e aggiunto indirizzo del blog?
    la riga blu con ideee per computer ed internet va cambiate con titolo del nostro blog?
    Ultima domanda e ho finito :) si ha modo di testare in che modo vedranno i "copioni" grazie mille come sempre

    RispondiElimina
    Risposte
    1. Si tratta di un commento del codice e serve solo per riconoscere a cosa si riferisce quando scorri il template. Puoi lasciarla così o cambiarla. È irrilevante. La riga blu "Per più informazioni leggi qui:" puoi cambiarla come di pare e al posto di "Idee per Computer ed Internet" va messo il Nome del tuo blog e non l'indirizzo che non va da nessuna parte. Puoi fare una prova copiando qualcosa dal tuo sito e incollandola nel Blocco Note.
      @#

      Elimina
    2. ci sono riuscita!!!!!!!b Grande Ernesto mitico

      Elimina
  2. Grazie per l'ottima dritta, ma funziona solo con il testo?? con le immagini funziona? Ho fatto qualche prova ma niente

    RispondiElimina
    Risposte
    1. È evidente che se provi a incollare una immagine in un blocco note questa non si vede. Se però selezioni e copi una immagine e poi provi a incollare il tutto su un Editor allora dovrebbe funzionare
      @#

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.