Widget scorrevole per Pagina Fan di Faceboo, Twitter, Google Plus e Iscrizione alla Newsletter di Feedburner. i installa in un gadget HTML/Javascript di Blogger.
In un commento mi è stato segnalato un widget scorrevole che si posiziona sulla destra del blog e che mostra il Like Box di Facebook, gli ultimi tweet su Twitter, il bottone di Google Plus e il campo per sottoscrivere la Newsletter con FeedBurner. Penso di fare cosa gradita a molti lettori se lo ripresento tradotto in italiano. Per la sua installazione non occorre modificare il modello ma basta andare su Layout > Aggiungi un gadget > HTML/Javascript.
Per poterlo utilizzare bisogna essere iscritti a Facebook e avere una nostra pagina fan, essere inoltre iscritti a Twitter e a Feedburner. I dati che servono sono l'username di Twitter, l'ID della pagina fan su Facebook e l'ID di Feedburner. Ecco la solita demo online
L'aspetto del widget sarà il seguente
Passando il mouse sopra ciascuna linguetta si visualizzeranno il Like Box di Facebook, gli ultimi tweet, il bottone di Google Plus e il modulo per l'iscrizione alla newsletter. Per l'installazione si va su Layout > Aggiungi un gadget > HTML/Javascript e si incolla il seguente
I dati essenziali da modificare sono stati evidenziati di giallo e riguardano
- ideepercomputeredinternet che è l'ID della pagina fan su Facebook cioè la parte dell'URL dopo www.facebook.com/
- parsifal32 è l'ID su Twitter ovvero il nome utente
- Le due occorrenze di ideepercomputeredinternet/zUQN che è la parte finale dell'URL dei feed del blog su Feedburner
Naturalmente si possono modificare anche altri parametri come gli URL delle 4 immagini delle linguette. Concludo ricordando che sono presenti gli script di Google Plus e di JQuery evidenziati di verde. Se fossero già presenti nel modello si può tralasciare il loro codice.
Fonte | Helper Blogger -
@EmanueleDrago
RispondiEliminaOnestamente non ti so dire il perché, forse va in conflitto con qualche widget del tuo sito. Ricordati che c'è JQuery. Si può naturalmente inserire il widget anche su Wordpress andando su Widget > Aggiungi widget > Testo e trascinando l'elemento in una sidebar o nel footer.
per togliere il +1 di google plus devo togliere la parte in verde?
RispondiEliminaE' un ottimo widget, grazie. Anche io però ho lo stesso problema per la finestra di Facebook. Forse non te ne sei accorto, ma anche sulla tua demo compare una finestra troppo corta. Ho provato a modificare la lunghezza della finestra sul codice adeguandola a quella di twitter (196 fb - 246 tw) ma non funziona.
RispondiEliminaAdesso funziona perfettamente. Sono riuscito a modificare il codice (anche se non ne capisco nulla. I miracoli della testardaggine!).
EliminaRiporto di seguito le modifiche che potrebbero interessare ad altri:
In tre posizioni che prevedono per facebook width 196 ho inserito 290.
In una posizione che prevede per facebook width 200 ho inserito 290.
Per l'altezza l'ho ridotta in tre posizioni da 353 a 300 e in una posizione da 426 a 300.
La finestra però iniziava troppo avanti pertanto ho dovuto modificare in tre posizioni il valore -200 in -292.
Infine risultavano soltanto nove foto di amici anziché 10, così ho modificato connections=9 in connections=10.
Spero di essere stato utile a qualcuno.
@GiancarloChieco
EliminaNon testo le tue modifiche perché non ne ho il tempo ma le prendo per buone e ti ringrazio comunque di averle condivise con i lettori. Mi ero accorto di quell'inestetismo ma mi sono visto costretto a lasciare le distanze del post originale sempre per la solita cronica mancanza di tempo :)
ciao Ernesto, come si può modificare il colore dei link nel box di twitter? grz
RispondiElimina@GaiaVincenzi
EliminaProva a scorrere il codice (non è mio) e cerca i CSS di Twitter tipo questo #twitter_left con color:#6CC5FF
Ciao Ernesto, anziché fare comparire le linguette sulla parte destra dello schermo, è possibile con qualche modifica farle comparire sulla sinistra?
RispondiEliminaGrazie mille
@EdoardoVanucci
EliminaPiù che modifiche bisognerebbe rifare tutto il codice e tutte le immagini visto che sono impostate per l'effetto slide sulla destra
Ah cavolo, una cosa molto complicata, almeno per me. Grazie comunque per la tua disponibilità Ernesto!
EliminaCiao ernesto, scusami...in "subscribe" quando inserisco un indirizzo email mi scrive "The feed does not have subscriptions by email enabled". Come mai? sono andato in feedburner a vedere cosa fosse ma non capisco cosa devo fare, puoi aiutarmi?
RispondiEliminaGrazie
Piergiorgio
Probabilmente non hai sostituito bene l'indirizzo dei feed nel codice. Devi inserire la parte finale di uno come questo
Eliminahttp://feeds.feedburner.com/ideepercomputeredinternet/zUQN
cioè la parte dopo
http://feeds.feedburner.com/
in due occorrenze
R @
@# E' cosa molto complessa
RispondiEliminaCiao Ernesto ho un widget simile sul mio blog per twitter , praticamente identico nel funzionamento e nel codice solo un po' diverso graficamente.Adesso però quando si apre il menu a tendina rimane azzurro senza visualizzare i twitter, ho notato che la stessa cosa accade nel tuo blog di prova! si può risolvere in qualche modo o è colpa di twitter ? Un caro saluto
RispondiElimina@# Può darsi che Twitter abbia modificato le API e che quindi le vecchie non siano più funzionanti
EliminaDovrebbe essere proprio così. Infatti molti moduli non sono più funzionanti. Twitter ha rilasciato la 1.1 che sostituisce la 1, x bloccare le estensioni di terze parti.
EliminaE come fare per farlo funzionare di nuovo?
Elimina@# Se trovo il modo di ovviare aggiorno il post o ne faccio uno nuovo
EliminaCiao Ernesto,come faccio ad inserire l'accout di google+? Ti ringrazio Simone
EliminaIl box di twitter non funziona più.
RispondiElimina@# Le vecchie API di Twitter sono state ritirate e ne sono state rilasciate di nuove
Eliminahttps://dev.twitter.com/blog/api-v1-is-retired
Bisognerebbe leggersi tutta la documentazione ... Se avrò un po' di tempo (e di voglia...)
Dove inserisco l url per GOOGLE + ?
RispondiEliminaNon è necessario inserire l'URL di Google Plus
Elimina@#
Salve a tutti, premetto che di programmazione non ne so un tubo. Io uso soltanto un programma per creare sito web, ma tutto in WYSIWYG. avrei bisogno del codice ma con solo facebook. Qualcuno mi può dare un aiuto?
RispondiElimina@# Prova a togliere il codice a partire da
Elimina<div id="on"><div id="twitter_right" style="top: 35%;"><div id="twitter_div">