Pubblicato il 12/10/15e aggiornato il

Come condividere su Twitter il testo selezionato su Blogger.

Come twittare in automatico il testo selezionato in Blogger cliccando sulla icona che verrà mostrata sotto forma di tooltip.
La condivisione sui social network è uno dei modi più efficaci per rendere virale i contenuti del nostro sito. Google Plus è in forte ribasso dopo che la casa madre ha deciso di non investirci più quindi rimangono Facebook e Twitter i luoghi di destinazione più importanti delle condivisioni.

I lettori possono usare i classici bottoni di condivisione per twittare i titoli dei post ma non sempre questi sono attraenti perché sono rivolti essenzialmente ai motori di ricerca. In questo modo si possono perdere delle potenziali condivisioni. Infatti se un navigatore volesse condividere una frase presente nel post dovrebbe selezionarla, copiarla quindi aprire il proprio account Twitter, incollarla e inviarla ai follower.

Se avete dei dati interessanti riguardo alle condivisioni via Twitter potrebbe risultare utile inserire nel vostro sito un sistema automatico per la condivisione di un testo selezionato. Con l'inserimento nel template di Blogger di un apposito script basato su jQuery si può rendere più facile questa operazione

twittare-testo-selezionato
Chi selezionerà una porzione di testo del sito visualizzerà l'icona di Twitter e, cliccandoci sopra, si aprirà una nuova scheda con cui twittare il testo selezionato insieme all'URL del post e al vostro account Twitter. Questo ovviamente sarà possibile solo se il lettore è loggato con Twitter.

Dopo aver salvato il template si va su Modello > Modifica HTML e si cerca la riga </body>.  Subito sopra a questa riga si incolla questo codice

<!-- Twittare testo selezionato - Inizio -->
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js'/>
<style>
.twittatesto {
display:none;
top:0;
background:#333;
color:#f16786;
width:40px;
height:32px;
position:absolute;
margin-left:-20px;
opacity:0;
filter:alpha(opacity=0);
z-index:99;
-webkit-transition:all .3s ease;
-moz-transition:all .3s ease-in-out;
-o-transition:all .3s ease;
transition:all .3s ease-in-out;
}
.twittatesto span {
position:absolute;
content:&quot; &quot;;
border:solid rgba(0,0,0,0);
height:0;
width:0;
top:100%;
border-top-color:#333;
left:50%;
-webkit-transition:all .3s ease;
-moz-transition:all .3s ease-in-out;
-o-transition:all .3s ease;
transition:all .3s ease-in-out;
border-width:7px;
margin:0 0 0 -7px;
}
.twittatesto a {
color:#f16786;
}
.twittatesto:hover {
background:#5EA9DD;
}
.twittatesto:hover span {
border-top-color:#5EA9DD;
}
.IpCeItooltip {
position:relative;
display:block;
width:100%;
height:100%;
top:0;
left:0;
}
.IpCeItooltip a {
width:100%;
background:transparent url(https://lh3.googleusercontent.com/-QdvDAGMshCI/VhtsfgCEcSI/AAAAAAAAxs4/H-5pyXIFYgY/s41-Ic42/twitter-button.png) 0 0 no-repeat;
left:0;
top:0;
height:100%;
text-decoration:none;
display:block;
padding:0;
}
.condividilink {
display:block;
position:absolute;
text-indent:-9999px;
}
</style>
<script type='text/javascript'>
/*<![CDATA[*/
$(document).ready(function() {
sharetext = '';
$(document).mousemove(function(m) {
generateTooltipPosition();
});
});
$(document).mouseup(function() {
$(document).mousemove(function(m) {
generateTooltipPosition()
});
var sharetext = getText();
var twittatesto = document.getElementById("twittatesto");
if (sharetext != '') mostratooltip();
});
$(document).click(function() {
var sharetext = getText();
var titolotooltip = null;
var newTooltipTitle = $("#twittatesto").attr("title");
if (newTooltipTitle == "") return;
if (newTooltipTitle !== titolotooltip) $('#twittatesto').animate({
opacity: 0
}, 30);
if (sharetext != "") mostratooltip();
});
$(window).resize(function() {
if ($('#twittatesto').show()) {
$('#twittatesto').animate({
opacity: 0
}, 30);
}
});
function mostratooltip() {
var pageURL = window.location.toString();
var twitterLink = "https://twitter.com/intent/tweet?text=" + getText() + "&via=" + AccountTwitter + "&url=" + pageURL;
$('#twittatesto').show();
$('#twittatesto').animate({
opacity: 1
}, 30);
$('#InviaTwitter').attr('href', twitterLink);
}
function getText() {
shareTxt = '';
if (window.getSelection) {
shareTxt = window.getSelection();
generateTooltipPosition();
} else if (document.getSelection) {
shareTxt = document.getSelection();
generateTooltipPosition();
}
return shareTxt;
}
function generateTooltipPosition() {
var selection = window.getSelection && window.getSelection();
if (selection && selection.rangeCount > 0) {
range = selection.getRangeAt(0);
pos = $(window).scrollTop();
selection_text = selection.toString(), rect = range.getBoundingClientRect();
$('#twittatesto').css({
top: (rect.top + pos - 20) - 32 + 'px',
left: rect.left + (rect.width / 2) + 'px',
});
}
}
/*]]>*/
</script>
<script>
/*<![CDATA[*/
var AccountTwitter =  "parsifal32";
/*]]>*/
</script>
<div class='twittatesto' id='twittatesto'>
<div class='IpCeItooltip'><a class='condividilink' href='' id='InviaTwitter'><span/></a></div>
</div>
<!-- Twittare testo selezionato - Fine -->

L'unica cosa da modificare è il nome utente al posto di parsifal32 è che sarà visualizzato nei tweet condivisi con questo sistema. Se nel vostro sito fosse già presente la libreria jQuery allora potete fare a meno di incollare nuovamente lo script cancellando dal codice la riga evidenziata di giallo.




4 commenti :

  1. C'è da chiedersi su cosa abbia ancora voglia di investire la casa madre... Mah

    RispondiElimina
  2. Ciao Ernesto.
    Ottimo, ma ci vorrebbe uno script per avvisare i lettori di questa possibilità, altrimenti se ne accorgeranno solo i "Blogger" copioni. P.S. Ne ho, casualmente, scovato uno che copia i Post sia qui che nel mio sito.

    RispondiElimina
    Risposte
    1. Il visitatore casuale può darsi non se ne accorga ma quello abituale prima o poi qualche testo lo selezionerà. Si può comunque sempre mettere un avviso nella sidebar. I Blogger copioni non andranno mai sa nessuna parte. Danno fastidio, sono d'accordo, ma provocano pochi danni Google se ne accorge facilmente e non li vedrai mai nei primi post dei risultati delle ricerche che è quel che conta.
      @#

      Elimina
    2. Sono d'accordo con te, infatti non prendo provvedimenti. Copiano pari pari e non si accorgono neanche di quello che c'è scritto; in un Post che avevo pubblicato prima dell'uscita di W10, avevo scritto, riguardo una funzionalità dell'OS, "...che arriverà con l'uscita di Windows 10". Il copione ha pubblicato il Post qualche giorno fa lasciando anche la sopracitata frase :-) (due mesi e mezzo dopo l'uscita di W10). Ciao.

      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.