Forum gratuit: forum de suport al utilizatorilor
Doriți să reacționați la acest mesaj? Creați un cont în câteva clickuri sau conectați-vă pentru a continua.

Adaugarea unui feed Twitter pe portal

Vezi subiectul anterior Vezi subiectul urmator In jos

Tutorial Adaugarea unui feed Twitter pe portal

Mesaj Scris de Luky Mar Noi 24, 2009 9:32 pm

Feed Twitter pe portal

Adaugarea unui feed twitter pe site-ul dumneavoastra.
Nu necesita editarea template-urilor!
Acesta este un cod global, care poate fi folosit in: portal, widget-urile forumului, mesajul paginii de start sau o pagina html  


Rezultatul:

Adaugarea unui feed Twitter pe portal Twitte10

Lucruri de care ati putea sa aveti nevoie:


Un mic icon twitter daca doriti sa il schimbati pe cel de origine(default)
Un portal activ (am ales portalul pentru ca feed-urile arate cel mai bine pe portal)
Motivare si 15 minute


Adaugarea unui feed Twitter pe portal Jpkje8 Pregatirea portalului


As sugera postarea acestui feed in coloana de pe centru, sau in modulele de sus sau de jos. Feed-ul va arata cel mai bine daca este adaugat in acele zone.
Intrati in Panou de Administrare-> Module -> Portal & Widget-uri -> Configurarea portalului -> Structura
Mergeti in josul paginii si dati click pe butonul "Creati un widget personalizat".


Adaugarea unui feed Twitter pe portal 2pt8jo1Adaugarea codului


Dupa ce ati dat click pe "Creati un widget personalizat", la nume adaugati "feed twitter" pentru a il gasi mai rapid.  
Selectati "Da" pentru a utiliza un tablou standard (asta in cazul in care nu doriti sa personalizati si tabloul)
Nu este nevoie de titlu, daca nu vreti sa adaugati unul.

In campul "Sursa widget" copiati acest cod:
Cod:
<div class="twitterfeed"><div id="twitter_div" style="margin-left: 35px; padding-top: 3px;"><ul id="twitter_update_list" style=" list-style-image : url(http://hitskin.com/themes/13/34/38/i_icon_minipost_participate.png); font-size: 12px; line-height: 15px;"><li style="padding-top: 3px; padding-left 20px;"> </li></ul></div><p align="right" style="margin-top: 2px; font-size: 11px;">recently twittered on <a href="twitter.com/forumotion">Forumotion</a></div><script type="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>


Sa va explic despre ce este vorba in acest cod:
Cod:
<div class="twitterfeed">
- aceasta este o clasa aditionala speciala pe care am adaugat-o eu ca sa mentina feed-ul aliniat. Daca doriti sa modificati feed-ul twitter veti face asta in aceasta clasa.

Forumotion  - asigurati-va ca schimbati "forumotion" din link cu numele contului dumneavoastra de pe twitter si "Forumotion" cu numele forumului.


Ultima parte si cea mai importanta este feed-ul insusi.[/size]
Cod:
<script type="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>


Sunt 2 lucruri care trebuie sa le modificati aici.
1) - [b]statuses/user_timeline/numele contului dvs de pe twitter.json?

* - schimbati numele din forumotion cu numele contului dvs de pe twitter. Asigurati-va ca pastrati .json dupa nume

2) - twitterCallback2&count=1
* - codul meu afiseaza doar ultimul tweet. Daca doriti ultimele 2 sau 3 va trebui sa schimbati "count" cu numarul de tweet-uri dorit de dumneavoastra. (Nu depasiti 5 insa pentru ca nu se va vedea frumos)


Dupa ce ati terminat de modificat - Salvati si adaugati noul widget in portal (Este recomandat sa il adaugati in coloana din centru/sus/jos)

Adaugarea unui feed Twitter pe portal 9jondsAdaugari in CSS

Puteti sa il lasati si asa dar ar fi mai frumos daca adaugati si cateva clase CSS.
Intrati in Panou de Administrare -> Afisare -> Culori -> sectiunea "Foaie de stil CSS"

Tot ce aveti de facut este sa copiati urmatoarele clase

Cod:
#twitter_div a:link{
color: #fff;

}
#twitter_div a:hover{
color: #03a5b4;
}
#twitter_div{
color: #006383;
}.twitterfeed{
margin: 0 auto;
width: 700px;
height: 40px;
background-image: url(https://2img.net/h/oi33.tinypic.com/14kblfo.png); /* desired twitter image */
background-repeat: no-repeat;

}
Pentru a modifica blocul twitter folositi clasa #twitterfeed .
Puteti sa ii modificati latimea, inaltimea si icon-ul.
#twitter_div a:link si a:hover sunt culorile pentru link-urile twitter si cele mai recente twitter-uri pentru a modifica culoarea in functie de culoarea de fundal a forumului dumneavoastra.

Luky

Luky
Membru onorific
Membru onorific

Mesaje : 3467
Varsta : 36
Localizare : Bucuresti
Data înscrierii : 27/12/2007
Mulțumiri : 25
Internet Explorer phpBB3

Luky a fost mulțumit de autorul acestui subiect.

Vezi subiectul anterior Vezi subiectul urmator Sus

- Subiecte similare

Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum