Aggiungere un feed twitter Wed Aug 10, 2011 12:58 pm
Pubblicato da: Spacca Spacca
Aggiungere un Twitter feed / ticker sul tuo sito.
Nessuna modifica dal template, o abilità richiesta!
Si tratta di un codice globale, può essere utilizzato nel portale, widget forum, messaggio homepage, una pagina HTML.
Strumenti di cui avete bisogno:
Un piccolo Twitter icona se si desidera modificare il valore predefinito 1 che ho preparato.
Un portale attivo (io ho scelto il portale perché il feed guarda i migliori del portale).
Il Tutto in 15 Minuti.
Preparazione del portale.
Propongo questo distacco feed nella colonna di centro, o nei moduli superiore o inferiore. Il feed sembra davvero buono, se si trova in quelle sezioni.
Vai al Pannello di amministrazione-> Moduli -> gestione del portale -> struttura
Scorrere l'elenco e fare clic su Crea un nuovo widget.
L'aggiunta del codice.
Dopo aver fatto clic su creare un nuovo widget, digitare il nome in "feed Twitter" per refrence veloce.
Selezionare "Sì" per usare le tabelle standard (a meno che non si desidera personalizzare il blocco).
Non c'è bisogno di un titolo.
Nella casella si incolla questo codice:
- Spoiler:
- Code:
<div class="twitterfeed" style="margin-top:5px !important;margin-bottom:5px !Important;"> <div id = "" stile twitter_div = "margin-left: 35px; padding-top: 3px; "> id <ul =" "stile twitter_update_list =" list-style-image: url (http://hitskin.com/themes/13/34/38/i_icon_minipost_participate.png); font-size: 12px; line-height : 15 px "> <li style="padding-top: 3px; padding-left 20px;"> </ li> </ ul> </ div> <p align =" "stile destra =" margin-top: 2px ; font-size: 11px; "> Twitter di recente <a href="twitter.com/forumotion"> Forumattivo </ a> </ div> tipo di script <= "text / javascript" src = "http://twitter.com/javascripts/blogger.js" > </ script> <script type="text/javascript" src="http://twitter.com/statuses/user_timeline/forumotion.json?callback=twitterCallback2&count=1"> </ script>
Adesso:
- Spoiler:
- Code:
clas"twitterfeed"> <div - questa è una classe speciale supplementare ho aggiunto per mantenere il vostro feed allineati. Se si desidera modificare il Twitter feed che lo farò per questa classe.
<strong> <div id="twitter_div ...> </ strong> - questa è la base per la definizione del codice javascript, non modificare . gli unici oggetti è possibile modificare in questo div è lo stile ="";>< br />
<strong> <ul id="twitter ...> </ strong> - questa è una lista che non organizzata è necessario per il javascript. L'unica cosa che è possibile modificare l'url dell'immagine. Questa è la mini-icona (la scatola blu nel mio esempio) il suo punto di proiettile. È possibile modificare il punto se lo si desidera. />
Il resto degli interni è necessario lasciare da solo ... ma quando si vede questa parte:
<strong> di recente Twittered il </ strong>
La parte finale è la più importante. E' l'alimentazione reale.
- Code:
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"> </ script> tipo di script <= "text / javascript" src = "http://twitter.com / status / user_timeline / forumotion.json? callback = twitterCallback2 & count = 1 ">
Ci sono 2 cose che si deve modificare qui.
1) - status / user_timeline / il tuo Twitter name.json account?
* - Cambiare il Twitter account da Forumattivo al tuo Twitter conto
2) - twitterCallback2 & count = 1
* - Il mio codice visualizzato solo il tuo ultimo tweet. Se si desidera che gli ultimi 2 o 3 dovete cambiare il "conte" per il numero desiderato di tweets. (Non andare oltre il 5 che non è carino)
Una volta terminata la modifica - salvare e aggiungere il vostro nuovo widget per il vostro portale (consigliato al centro, sopra, sotto colonna)
CSS integrazioni
E 'stato divertente lasciarlo così ... ma si devono aggiungere poche classi CSS.
Vai al pannello di amministrazione -> Schermo - colori -> scheda CSS
Tutto quello che dovete fare è incollare queste classi:
- Spoiler:
- Code:
# Twitter_div a: link (
color: # fff;
) # twitter_div a: hover (
color: # 03a5b4; br /> <br) < /> # twitter_div
(color: # 006.383; /> <br). twitterfeed
(margin: 0 auto; /> <br larghezza: 700px, altezza
: 40px; <br / > background-image: url (http://i33.tinypic.com/14kblfo.png); / * desiderata Twitter immagine * /
background-repeat: no-repeat;
)
Per modificare il Twitter si utilizza la twitterfeed # class.
Si può modificare la sua larghezza, l'altezza e l'icona.
Il twitter_div # a: link e a: hover sono i colori della Witter link e la recente Wittered ai collegamenti
di modificare il colore a seconda del vostro sfondo forum.
Ciao...