wtorek, 28 lipca 2015

Kody CSS czyli pomoc dla każdego bloggera

Witajcie, 
Zważywszy na fakt iż każdego dnia przybywa blogerów i blogerek, a każdy (przynajmniej tak uważam) chce by jego blog był jego wizytówką i chce by wyglądał jak najlepiej pod każdym względem to też jako nie początkująca blogerka bo to mój trzeci blog(każdy o innej tematyce) chciałabym choć trochę pomóc tym którzy się na tych kodach nie znają.

Większość szczególnie nowych blogerów pewnie zastanawia się co to wg. jest ten Arkusz CSS w projekcie, tak więc objaśniam Arkusz CSS (szablon-> dostosuj-> zaawansowane).
Jest to ogromne ułatwienie dla osób nie znającym się na HTML, bo wystarczy tylko znaleźć kod, wkleić go i już można się cieszyć zmianami na blogu bez obaw, że coś zepsujemy.

A oto kilka przydatnych komend (pamiętaj, aby kopiować dokładnie całą, pogrubioną komendę. Czasem może zabraknąć jednej kropki i CSS nie załapie o co nam chodziło).
Porady z serii na temat Kodów CSS postanowiłam podzielić na kilka części, ponieważ jest ich sporo i gdybym wrzuciła wszystko w jeden post, to mógłby zapanować chaos, a tego nikt nie chce.

Dziś skupimy się na jedynej dynamicznej czyli samodzielnie zmieniającej się stronie czyli stronie głównej, to ta która wyświetla się jako pierwsza po wpisaniu adresu strony/bloga. Strona główna nazywana jest dynamiczną ponieważ sama bez potrzeby Naszej pracy zmienia się w każdym momencie opublikowania owego postu.

Jeszcze przed rozpoczęciem zmian zaznaczę ważną rzecz.
Jeśli korzystamy z zewnętrznych szablonów tzn. tych wgrywanych a nie oferowanych przez bloggera kody nie działają i trzeba bawić się w kodzie HTML w ustawieniach wyglądu, ale to troszkę wyższa szkoła jazdy.


Przed rozpoczęciem najlepiej zrobić kopię zapasową szablonu gdyby coś poszło nie tak, można to bez problemu zrobić w bloggerze, zakładka szablon w prawym górnym rogu.
Wyśrodkowanie tytułu posta:
h3.post-title, .comments h4 {text-align: center;} 
Wyśrodkowanie daty:
 h2.date-header {text-align: center;} 
Wyśrodkowanie gadżetów w środkowej kolumnie:
 .column-center-inner {text-align: center; }
Wyśrodkowanie gadżetów w lewej kolumnie:
.column-left-inner {text-align: center; }
Wyśrodkowanie gadżetów w prawej kolumnie: 
.column-right-inner {text-align: center; } 
Wyśrodkowanie górnego menu:
#PageList1 ul {
text-align: center;
}
#PageList1 ul li {
float: none;
display: inline;
Przesunięcie górnego menu na prawą stronę:
#PageList1 ul {
text-align: right;
}
#PageList1 ul li {
float: none;
display: inline;
}
Suwak w notce (można dopasować własne parametry)
.post { overflow: scroll; width: 465px; height: 400px; ) 
Cienie w lewej kolumnie (można dopasować własne parametry)
.column-left-inner {text-shadow: 1px 1px 5px}
Cienie w prawej kolumnie (można dopasować własne parametry)
.column-right-inner {text-shadow: 1px 1px 5px}
Cienie pod tytułem posta (można dopasować własne parametry)
h3.post-title, .comments {text-shadow: 1px 1px 5px}
Wyśrodkowanie nagłówka: 
.header-inner .widget div, .header-inner img {
margin-left:auto;
margin-right:auto;
}
Owocnych zmian, jeśli jednak coś pójdzie nie tak piszcie z chęcią pomogę.
Pozdrawiam.

Brak komentarzy:

Prześlij komentarz

Copyright © Szablon wykonany przez Blonparia