In molti mi hanno chiesto come ho fatto a mettere sotto ogni articolo la barra di OKNotizie, con il pulsante di Facebook e quello di Twitter. E’ molto utile perchè permette di avere sott’occhio i tre network principali per la diffusione dei nostri post.
Ho deciso allora di scrivere questo articolo, così che tutti possiate integrarlo nel vostro blog, se la cosa vi interessa.
Procediamo con il tutorial:
- Scaricate l’ottimo plugin di Traffyk per inserire l’iframe di OKNOtizie.
- Aprite il file
OKNOtizie.php. - Sostituite le righe dalla 69 alla 72 con tutto questo codice:
$link = get_permalink($id);
$meta_string .=
"<div id=\"okno\">
<strong>Ti è piaciuto l'articolo? Vota Ok oppure No. Grazie Mille!</strong><br />
<script type=\"text/javascript\" language=\"javascript\">
<!--
document.write('<iframe src=\"http://oknotizie.virgilio.it/go_frametop.html.php?us=$meta_id\" allowtransparency=\"true\" style=\"width:100%;height:40px;\" scrolling=\"no\" frameborder=\"0\"></iframe>');
-->
</script>
</div>
<div id=\"fbshare\">
<a href=\"http://www.facebook.com/share.php?u=$link\" onclick=\"window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(location.href)+'&t='+encodeURIComponent(document.title),'sharer','toolbar=0,status=0,width=626,height=436'); return false;\">
<img src=\"" . get_bloginfo('template_url') . "/images/facebook.jpg\" alt=\"Condividi su Facebook\" /></a>
</div>
<script type=\"text/javascript\">
tweetmeme_url = '$link';
</script>
<div id=\"retweet\">
<script type=\"text/javascript\" src=\"http://tweetmeme.com/i/scripts/button.js\"></script>
</div>
<div class=\"clear\"></div>";
$meta_string .=
"<div id=\"okno\">
<strong>Ti è piaciuto l'articolo? Vota Ok oppure No. Grazie Mille!</strong><br />
<script type=\"text/javascript\" language=\"javascript\">
<!--
document.write('<iframe src=\"http://oknotizie.virgilio.it/go_frametop.html.php?us=$meta_id\" allowtransparency=\"true\" style=\"width:100%;height:40px;\" scrolling=\"no\" frameborder=\"0\"></iframe>');
-->
</script>
</div>
<div id=\"fbshare\">
<a href=\"http://www.facebook.com/share.php?u=$link\" onclick=\"window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(location.href)+'&t='+encodeURIComponent(document.title),'sharer','toolbar=0,status=0,width=626,height=436'); return false;\">
<img src=\"" . get_bloginfo('template_url') . "/images/facebook.jpg\" alt=\"Condividi su Facebook\" /></a>
</div>
<script type=\"text/javascript\">
tweetmeme_url = '$link';
</script>
<div id=\"retweet\">
<script type=\"text/javascript\" src=\"http://tweetmeme.com/i/scripts/button.js\"></script>
</div>
<div class=\"clear\"></div>";
- Aprite il file
style.cssdel vostro template ed incollate le seguenti regole di stile:
#okno{
text-align:center;
border:1px solid #548ada;
clear: both;
width:408px;
float:left;
margin-right:15px;
margin-top:20px;
}
#retweet, #fbshare{
float:left;
margin-top:20px;
}
#fbshare{
margin-right:15px;
}
text-align:center;
border:1px solid #548ada;
clear: both;
width:408px;
float:left;
margin-right:15px;
margin-top:20px;
}
#retweet, #fbshare{
float:left;
margin-top:20px;
}
#fbshare{
margin-right:15px;
}
- Personalizzate il codice CSS qua sopra come preferite, in base al vostro tema.
- Caricate il tutto sul server e attivate il plugin.
- Eventualmente impostate le opzioni del plugin che preferite, dal pannello admin.
- Inutile dire che l’immagine
facebook.jpgnon è inclusa e dovrete cercarvene una voi, per poi inserirla nella cartellaimagesdel vostro tema. - Potete inoltre integrare il pulsante “Condividi su Facebook” con Facebook Connect, seguendo questa guida.
Un’ultima nota: il contatore di ReTweet utilizza il servizio gratuito di Tweetmeme. Vi rimando alla documentazione per ulteriori personalizzazioni.
Ho provato ad estrapolare solo i bottoni di share di facebook e twitter.
per twitter nonostante abbia compiato questo codice e incollato in basso all’articolo non funziona. Non riesce a prendere il link infatti esce un “?” ad ogni modo il codice è questo:
<?php
$link = get_permalink($id);
$meta_string .="
tweetmeme_url = ‘$link’;
“;
mentre per facebook non ho alcun problema.. è bastato incollare questo:
Come risolvo con twitter? è solo un problema di link che non riesce a prendere
grazie mille
Ciao, ho installato… però ho solo un piccolo problema. Perché non mi appare il counter di facebook?? ho anche inserito una immagine… tipo come ce l’hai tu.. ma sopra di essa non mi appare il counter. Inoltre… non c’è una soluzione per non rendere manuale la segnalazione su ok notizie? grazie
Nella mia barra attuale ho aggiunto il contatore per Facebook, lo trovi su questo sito.
rettifico… non posso nemmeno segnalare tutte le notizie.. solo 3 al giorno… e in questo caso non ho la possibilità di far apparire la barra con i collegamenti se poi non segnalo la notizia.. mmmm ma un plugin che faccia tutto questo con i social e aggregatori qual è? grazie mille
Non credo esista niente che lo faccia in automatico.
Ciao! Prima di tutto ti ringrazio per la guida. Solo ho un problema…
Ho trovato il plugin Sharecount for Facebook e non mi riesce inserirlo nel codice al posto dell’immagine statica. Ho messo manual nella configurazione del plugin e mi dice di scrivere echo facebook_sharecount(); (presumo con i tag di php) Ora non so se è lo stesso plugin da te usato.
Sì, è lo stesso servizio che uso io, ma ho lasciato perdere il plugin ed ho inserito direttamente il codice javascript: http://www.fbshare.me/
Ci avevo provato anche io ma mi da errore di sintassi proprio alla riga del codice
EDIT: nulla ho risolto! Semplice errore nel cancellare il codice precedente! Ti ringrazio per la disponibilità
ciao vorrei inserire tale barra in un sistema di open cms che però non adotta php… come posso fare?
Ciao, vorrei integrare il pulsante “Condividi su Facebook” con Facebook Connect, ma come faccio???
Ho scritto un’altra guida in proposito
Innanzi tutto giungi troppo a fagiuolo
Ti ricordi che oggi tempestavo Twitter con le mie lamentele su Sociable?! Questa è decisamente un’ottima alternativa! E’ vero è un pò limitata come numero di social però direi che è inutile aggiungerne tanti: meglio pochi ma buoni!
Una curiosità: io uso già il plugn di Traffik per OkNotizie e so che se non segnali il post su OkNotizie non appare il box nel post. Che mi dici delle icone di Facebook e Retweet?! Se non segnali il post su OkNotizie che succede?! Non si vedono, si vedono lo stesso ma rimane lo spazio bianco del banner, o si vede tutto comunque?!
Comunque sei un grande, è due sere di fila che, cercando di risolvere i miei problemi, giungo sul tuo blog e risolvo
Ma che bello! Google mi vuole bene!
Il limite di questa soluzione è quello che dici tu: se non segnali su oknotizie, non compaiono nemmeno le altre due icone. D’altronde, l’ho fatto per me e io segnalo sempre su oknotizie ^^
Ciao Ghido! Questa barra è molto interessante..ne vedrei una piccola evoluzione con l’integrazione di altri due servizi abbastanza importanti: delicious e stumbleupon. Che ne pensi?
Il fatto è che, se aggiungo troppe cose, poi la barra di OKNOtizie diventa sempre più piccola. Stavo pensando invece di metterci il pulsantino di diggita..
Comunque sotto c’è anche share-this con tutte le altre
Grazie risolto!
Ciao scusa,
la le regole di stile in che punto bisogna inserirle?
Nel tuo file style.css dove vuoi… alla fine, ad esempio.
Ciao Daniele!
Ottima questa modifica e sopratutto utilissima…
Non credi, però, che a forza di aggiungere roba dopo il post il lettori si stufi? Io punto tutto sull’iscrizione ai Feed, ma ho già aggiunto gli articoli correlati e un Adsense…
Che dici?
L’importante è mettere le cose con ordine, in modo che il lettore non si perda.
Certo, non bisogna esagerare, però i pulsanti dei social sono essenziali di questi ultimi tempi per poter sfruttare la molla virale.
Gran bella modifica, complimenti!! E grazie per il link
Magari in una prossima release potrei inserire il tuo lavoro automatizzando però la parte relativa all’inserimento del codice css e selezionando quali bottoni far apparire o meno, il tutto ovviamente con un bel link di ringraziamento e rimando ulteriore al tuo articolo
Fammi sapere e grazie ancora!
Ciao Raffaele, è un piacere averti da queste parti
Sarebbe un’ottima idea integrarlo nel plugin, sono sicuro che tornerebbe utile a molti!
Ovviamente il link al mio articolo è più che gradito
A presto e tienimi aggiornato