joi, 13 august 2009

Cum sa adaugi 3 coloane in footer pe Blogger

Dupa cum stiti blogurile de pe Blogger sunt prevazute cu o singura coloana pentru footer, exceptie facand doar sabloanele care sunt modificate deja.
3 coloane in footer-ul sablonului aduce un plus de flexibilitate  in adaugarea continutului, mai ales daca aveti widget-uri care nu au o latime prea mare.


Acest truc este gasit aici (Create Three Column Footer in Blogger)


Aceasta metoda creeaza 3 noi coloane in footer lasand totusi intacta coloana pe care o aveti deja in footer. Din pacate gadget-urile deja existente vor fi afectate, dar modalitatea de a le pastra este urmatoarea:
Inainte de a umbla la html-ul sablonului duceti-va la Aspect --> Elemente de pagina si mutati toate gadgeturile din footer in sidebar, sau sub postare. Asta pana cand vom modifica footer-ul, apoi le veti putea muta din nou la loc.

Acum vom trece la modificarea sablonului. Urmati calea Aspect --> Editati Html si primul lucru pe care il veti face este sa salvati o copie a sablonului, in calculatorul vostru.
Lasati casuta pentru extinterea sablonului NEBIFATA.

Cautati urmatorul cod:

]]></b:skin>

si inainte de el copiati codul de mai jos.

#footer-column-container {
clear:both;
}


.footer-column {
padding: 10px;
}

Al doilea pas consta in gasirea urmatorului grup de coduri:

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

Codul va arata asa doar daca ati mutat gadget-urile din footer, sau daca nu aveati oricum nici un gadget adaugat.
Acum pentru a termina treaba inlocuiti aceasta linie:
<b:section class='footer' id='footer'/>
cu acest cod:

<div id='footer-column-container'>

<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>

<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>

<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>

<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>

<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>

<div style='clear:both;'/>

<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>

<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text2' locked='false' title='' type='Text'/>
</b:section>

</div>
<div style='clear:both;'/>

</div>

Previzualizati pentru a vedea daca va da vreo eroare si apoi salvati. Duceti-va la Elemente de pagina si veti vedea ca cele 3 coloane s-au format, nemaitrebuind decat adaugarea de continut in ele. Observati ca a ramas si coloana originala. In ea puteti la fel sa adaugati continut, sau puteti sa o lasati goala.






Daca vreti sa personalizati footer-ul nu trbuie decat sa adaugati definitii dupa acest cod:
#footer-column-container {
dar daca folositi si footer-ul original atunci trebuie sa il personalizati si pe acesta.

16 comentarii:

  1. Super, sa vad cand fac ceva timp si sa ma sacrific, ... adica, ... sa incerc ... chestia asta ! Multumim, Daniel ! :)

    RăspundețiȘtergere
  2. Merge, deocamdata pe "TestBlog", foate fain ...

    RăspundețiȘtergere
  3. Naspa, ....... pe Blog, nu vrea, nu apare nimic .... x(

    RăspundețiȘtergere
  4. Merg numai "Expunerile de diapozitive" .....:(

    RăspundețiȘtergere
  5. Da, ... am reusit, dar am facut altfel ! Asa nu vrea sa lucreze, nu stiu care ar putea fi chestia. ~x( Daca vrea cineva sa stie cum am facut, ... sunt pe aici ! ;)

    RăspundețiȘtergere
  6. Aici cum se face chenar la cele 3 coloane din footer, se aplica aceiasi metoda ca si la "Cum sa creezi sabloane cu trei coloane pentru Blogger" !?

    RăspundețiȘtergere
  7. Gata, am rezolvat eu ! Am inceput sa-mi raspund singur la comentarii ! =))

    RăspundețiȘtergere
  8. si daca nu am deloc footer si vreau sa imi pun, ce fac?

    RăspundețiȘtergere
  9. sal,am facut si eu acest lucru insa am o nelamurire sau mai bine zis nu stiu cum sa fac.
    eu toate linkurile(cuvintele) le am incepute cu majuscula dar se pare ca in urma instalarii acestor 3 coloane mi le scrie(afiseaza0 fara majuscule.
    Care e dilema ? :)

    ms. o seara buna sa ai

    RăspundețiȘtergere
  10. pentru coloana originala ce trebuie sa modific pentru ca inceputul cuvantului sa fie scris cu majuscula.Eu asa le am scrise dar imi apar cu litera mica.

    RăspundețiȘtergere
  11. daca nu am footer, cum pot sa adaug? Ms.

    RăspundețiȘtergere
  12. Salut,am o problema la blogspot>
    tema pe care o am nu are footer si mi-ar prinde bine un footer pentru blog, va rog sa ma ajutati, chiar am nevoie de footer

    RăspundețiȘtergere
  13. şi dacă vreau să-l transform din 3 în 4, se poate?

    RăspundețiȘtergere
  14. Adaugarea asta se poate face si in header?

    RăspundețiȘtergere
  15. cum pot adauga unei teme de blogspot un footer, de o coloana?(tema respectiva nu are nici un footer)

    RăspundețiȘtergere