posjeta od 06.08.2008.

Zurek - moj blog s predlošcima

Ako nešto ne razumijete, pitajte u komentarima.

Komentari, pitanja, prijedlozi...

Navigacija:


Kako napraviti predložak
1. Uvod u izradu predložaka
2. Style dio
3. Dodavanje slike u predložak
4. Završni post

• Kako napraviti banner

• Kako prilagoditi predložak s BlogSkins-a

• Što je uopće HTML? / Tagovi

• Da i ne kod dizajna predložaka i pisanja bloga

• Korisni linkovi

• Aplikacija za praćenje komentara

• Zaštita bloga lozinkom

• O meni




Style dio

1. Body


Body dio se odnosi na cijelu stranicu, u ovom slučaju blog, tj. to su temeljne postavke izgleda bloga. U određenim dijelovima ih možete mijenjati i prilagoditi nekom dijelu (npr. povećati veličinu slova za naslove, mijenjati boju teksta, ukrašavati tekst).

Negdje na vrhu koda pronađite dio:


Font


  • font-family

    Font (vrsta slova) označen je kao "font-family: Arial". Arial možete zamijeniti s bilo kojim osnovnim fontom (u to spadaju svi fontovi koje niste downloadali, nego su došli "u paketu" s računalom), npr. Century Gothic, Franklin Gothic Book, Georgia, Times New Roman...

    Veličina slova


  • font-size

    Veličina slova izražava se u pikselima (px). Ovdje je zadano 10px, što vi možete izmijeniti u bilo koju drugu brojku- 11px; 12px...

    Boja slova


  • color

    Sad će vam trebati PhotoFiltre ili ovo.
    U HTML/CSS zapisu svaka boja ima svoje ime, i to u obliku heksidecimalnih kodova koji se sastoje od 6 brojki ili slova. Npr. crna je #000000, bijela #FFFFFF, crvena #FF0000 itd..
    U ovom predlošku je zadana crna boja, #000000, a vi #000000 možete izmijeniti u bilo koju boju iz tablice s gornjeg linka ili u PhotoFiltre-u klikom na kapaljku pa na određeni dio slike.
    U malom okviru desno od slike prikazat će se kod boje, kopirajte ga i zalijepite umjesto #000000.

    Boja pozadine


  • background-color

    Isti postupak kao i s bojom slova. Jednostavno zamijenite #000000 sa nekim drugim kodom za boju.

    2. Linkovi


    Pronađite ovaj dio:

    "A" označava linkove kakve ih vidite na blogu, a "A:hover" linkove kad je na njima kursor.
    Možete mijenjati boju slova, veličinu itd., zapravo gotovo sve kao i kod običnog teksta koji ste gore uređivali (body), osim što se kod linkova upotrebljava i text-decoration.

    Text-decoration može biti:
    text-decoration: none (normalan tekst)
    text-decoration: underline (potcrtano)
    text-decoration: overline (linija iznad teksta)
    text-decoration: line-through (linija koja prolazi kroz tekst)
    text-decoration: blink (tekst žmirka)

    3. Naslovi


    Za naslove boxeva i postova u predlošku je upotrijebljen sljedeći kod:

    Opet možete sve mijenjati.
    Tu se pojavljuje i font-weight. Primjer: ovo je font-weight: normal, a ovo font-weight: bold. Više saznajte ovdje. Font-weight možete kopirati i u ostale kodove, npr. u body, u linkove (A ili A:hover)...

    4. Komentari



    I u ovom dijelu možete sve mijenjati. Mislim da je očito da ovaj dio označava komentare koji se nalaze ispod posta.

    5. Sadržaji ispod posta



    Odnosi se na nešto kao "Komentari(16) | On/Off | Print | #" koje se nalazi ispod svakog posta.

    6. Kalendar



    Eto, piše vam je što je što pa mijenjajte što hoćete; boje, veličine, ukrašavanje teksta...

    Sada ste završili sa style dijelom koji zapravo određuje temeljne dijelove HTML koda.



    Komentari, pitanja, prijedlozi... | Print | #




  • Blog.hr koristi kolačiće za pružanje boljeg korisničkog iskustva. Postavke kolačića mogu se kontrolirati i konfigurirati u vašem web pregledniku. Više o kolačićima možete pročitati ovdje. Nastavkom pregleda web stranice Blog.hr slažete se s korištenjem kolačića. Za nastavak pregleda i korištenja web stranice Blog.hr kliknite na gumb "Slažem se".Slažem se