10 naina da izmenite svoju WordPress temu

Autor: Goran Magdic Izrada sajta

WordPress je CMS platforma koja ubedljivo najbre raste u dananjoj Web dizajn industriji.
Dobar deo akcija koje se deavaju u WordPress zajednici su uglavnom pokrenute tritem
WordPress tema.
irok izbor besplatnih i komercijalnih tema je upravo jedna od stvari koje ine WordPress
tako atraktivnim za korienje. Ali tema je esto samo poetna taka ka daljim
prilagoavanjima. Web diveloperi i vlasnici web sajtova vole da ponu sa nekom temom, a
onda da je dalje prilagoavaju svojim potrebama dok ne doe do eljenog izgleda ili dok ne
udovolje eljama klijenta.
Mnoge teme, naroite one koje su komercijalne, dolaze upakovane sa jasnom stranom sa
opcijama vezanim za tu temu, koja vam dozvoljava da kofiguriete veinu aspekata. Najbolje
je da pogledate sve opcije koje tu postoje pre nego to zaronite u kod. Drugaije reeno,
svaka tema ja razliita od druge, pa ponekad morate da zavrnete rukave i uete u kod kako
bi je potpuno prilagodili svojim potrebama.
U nastavku teksta navedene su stvari koje vlasnici web sajtova vole da menjaju i naravno
kako se te promene rade! Ovaj lanak je pisan pod pretpostavkom da imate bar poetno
znanje web dizajna, editovanja koda i da ste upoznati sa WordPress platformom.
Jedan savet pre nego to krenete u detalje: esto je dobra ideja da modifikacije pre radite na
Detetu temi (Child Theme) nego na Temi roditelju (Parent Theme). Prednost ovog
postupka je u tome to kada autor teme objavi update svoje teme moete je lako updateovati, a da ne izgubite modifikacije koje ste napravili. Pogledajte WordPress.org Codex za
vie informacija o Child temama.
1. Editovanje CSS-a teme

Ako elite da menjate boje, font, layout, pozadine, spacing i druge vizuelne elemente najbolje
je da ponete sa editovanjem CSS-a. U najveem broju sluajeva stilovi koje koristi vaa
tema se nalaze u fajlu pod nazivom style.css. Ovaj fajl se uvek nalazi u temi, jer ovaj fajl
definie tema u WordPress admin delu. Ponekad se tu nalaze i neki dodatni stilovi, koji
mogu da se nalaze u podfolderima.
Najbolji nain da pronaete stil koji treba da izmenite i lokaciju stila u fajlovima teme jeste da
instalirate alat za web development, kao to je recimo FireBug. Ovo je dodatak za FireFox
koji vam omoguava da pregledate CSS u letu i da brzo locirate stil i liniju koju treba da
promenite. Ako ne koristite FireBug, vreme je da ponete.
2. Prikazati odlomak posta ili ceo sadraj
Ponekad, po default-u, vaa tema prikazuje kompletan sadraj postova na poetnoj strani.
Recimo da biste radije prikazali kratak odlomak, isto da privuete interesovanje italaca
kako bi kliknuli dalje i pogledali ceo tekst. Ili moda obrnuto tema pokazuje odlomke, a vi
biste radije odmah sve prikazali.
Evo dva tag-a koje treba da zamenite:
Ovaj tag prikazuje ceo sadraj postova:
<?php the_content(); ?>
Vie informacija o ovom tag-u.
Ovaj tag prikazuje odlomak posta (kada editujete post, to je tekst koji unosite u tekst boxu
odmah ispod tekst boxa za sadraj celokupnog posta):
<?php the_excerpt(); ?>
Ako nikakvi izuzeci nisu nameteni automatski e prikazati prvih par reenica vaeg posta.

Vie informacija o ovom tag-u.

3. Kreirajte svoj template za odreenu stranu
Deava se da je potrebno da kreirate odreenu stranicu koja mora da ima svoj poseban
layout neto drugaije od drugih. eleli biste malo fleksibilnosti u HTML kodu, ali da
promene koje unesete ne utiu na druge strane koje ve postoje na vaem sajtu. WordPress
ini da kreiranje jedinstvenih templejta i dodeljivanje istih odreenoj strani bude poprilino
lako. Evo kako:
1.

Napravite kopiju fajla page.php koji se nalazi u vaoj temi. Ovo je fajl koji
WordPress koristi da prikae strane.
2.
Promenite ime kopiji u koje god elite. U ovom primeru nazvaemo
ga, cene.php (napraviemo jedinstvenu stranu za prikaz cena).
3.
Na vrhu strane dodajte ovaj deo koda:
<?php
/*
Template Name: Cene
*/
?>
1.
2.

Modifikujte html kod i CSS za ovu stranu kako god elite.

Napravite u okviru WordPress-a page sa nazivom Cene. Koristei padajui meni za
izbor templejta izaberite Cene.
3.
Snimite stranu. Sada e se strana prikazivati koristei template koji ste kreirali.
4. Napravite loop: Iskljuenje/Ukljuenje kategorije
Recimo da elite da prikaete postove iz svih kategorije osim iz jedne. Ovo je jako est
zahtev iz raznih razloga. Jedan primer bi bio da imate istaknute postove u obliku slajdera na
poetnoj strani koji prikazuje postove iz kategorije Istaknuto. eleli biste da prikaete
postove i ispod slajdera, ali tako da ne ukljuite u tom prikazu postove iz kategorije
Istaknuto, jer bi se u tom sluaju duplirali na strani. Evo kako to da uradite:
Dodajte ovu liniju pre loop-a:
<?php query_posts(cat=-8); ?>
Ovo e iskljuiti iz prikaza sve postove koji su iz kategorije sa ID-jem 8. Dakle neophodno je
da znate ID kategorije koju elite da iskljuite to moete videti u admin delu sajta za
administraciju kategorija.

Moda elite da uradite obrnuto: Prikaz postova samo iz odreene kategorije. Prosto!
Sklonite pre ID-a vae kategorije:
<?php query_posts(cat=8); ?>
Vie informacija o Loop-u i Query Post-ovima.
5. Seckanje navigacije na laki nain

Mnoge teme prikazuju sve vae strane na vrhu sajta uz pomo padajueg menija ili
hijerarhijske navigacije. Ali recimo da elite da izbegnete neke strane u navigaciji. Ponekad
ete imati strane koje nema potrebe da budu odmah izloene, kao to su na primer Uslovi
korienja. Evo lakeg naina da iskljuite odreenu stranu iz prikaza u meniju. Pronaite
kod koji prikazuje listu strana:
<?php wp_list_pages(); ?>
Promenite je u:
<?php wp_list_pages(exclude=5); ?>
Na ovaj nain kaete WordPress-u:Izlistaj mi sve strane koje sam napravio osim one koja
ima ID 5.. Naravno ne morate da izgovorite to na glas, dovoljna je ova linija koda :). Kao i u
prethodnom sluaju sa kategorijama i ovde morate znati ID strane koju elite da iskljuite.
Vie informacija: WP List Pages
6. Ukljuivanje menu managment-a u WordPress-u 3.0
Da li elite da imate kompletnu kontrolu nad navigacijom na vaem sajtu kao to je na primer
nametanje vaeg eljenog redosleda, ukljuivanje/iskljuivanje strana, kategorija i eksternih
linkova? Ko ne bi? WordPress 3.0 donosi jednu kul novu opciju nazvanu Menus, koja vam
daje ovu fleksibilnost. Meutim, ovu opciju moete koristiti samo ako vaa tema podrava
istu.

Evo kako da promenite tradicionalnu navigaciju (korienjem wp_list_pages()

novu koja moe da se kontrolie iz admin dela.

NAPOMENA: Morate imati WordPress 3.0+.
Prvo, morate da ukljuite ovu mogunost dodavanjem sledee linije koda
u functions.php fajl:
<?php add_theme_support(nav-menus); ?>
Nakon toga dodajte svoj meni u temu, negde u header.php fajlu:
<?php wp_nav_menu(); ?>
Naravno, moraete da kreirate i svoj meni tako to odete u Appearance > Menus.
Vie informacija: WP Nav Menu
7. Napravite jednostavan IF
Ponekad biste eleli da se neki deo sadraja menja u zavisnosti od toga koju stranu korisnik
gleda. Na primer, kada korisnik gleda stranu Cene, elite da vam se sa strane prikae
poruka Cene za svaki budet, ali na svim drugim stranama biste umesto te poruke prikazali
Kvalitetni proizvodi, pouzdana usluga!.
Evo naina da ovo namestite koristei IF:
<?php if ( is_page(Cene)) { ?>
<p>Cene za svaki budet!</p>
<?php } else { ?>
<p>Kvalitetni proizvodi, pouzdana usluga!</p>
<?php } ?>
Vie informacija: Conditional Tags
8. Post thumbnails

WordPress 2.9 je uveo jednu zgodnu opciju nazvanu Post Thumbnails. Kao to ime kae,
dozvoljava vam da podesite thumbnail sliku svom postu, bez potrebe da definiete custom
polje ili da sliku ubacujete u sadraj posta.
NAPOMENA: U WordPress-u 3.0, ovoj opciji je promenjeno ime u Featured Image, ali je
funkcionalnost ostala ista.
Post thumbnails je korisna opcija za ubacivanje boja u listu vaih postova ili ako koristite
WordPress postove kao svoj portfolio. Postoji jo dosta drugih situacija kada thumbnail-ovi
stupaju na scenu. Evo kako moete ovu opciju da ukljuite u svojoj temi:
Kao i sa opcijom menus, Post Thumbnails se mora ukljuiti u temi. Dodajte ovu liniju koda
ufunctions.php fajl:
<?php add_theme_support( post-thumbnails ); ?>
Onda, unesite post thumbnail sliku u okviru loop-a,koristei sledei tag:
<?php the_post_thumbnail(); ?>
Moda ete eleti da doterate izgled koristei CSS. Moete takoe dodati mogunost
razliitih veliina i opciju za seenje slika. Pogledajte ovaj tutorijal o opciji Post Thumbnails
za vie informacija.
9. Dodavanje neega na kraj posta
U nekim situacijama ete poeleti da dodate neto na kraj svakog posta neto konstantno,
recimo poruku promocije vaih servisa, link ka prijavi za newsletter, neku reklamu i sl.
Fajl koji elite da editujete je single.php. Ovo je template koji prikazuje lanke na blogu.
Otvorite taj fajl i pronaite zgodno mesto da dodate eljeni sadraj. Dobro mesto je obino
ispod lanka, ali pre komentara:
<?php the_content(); ?>
Va dodatni sadraj

<?php comments_template(); ?>

Vaa tema bi mogla da ima u dodatne tagove ili ta ve, ali ovo e vas uputiti u pravom
smeru.
10. Dodavanje Google Analytics koda

Svi ele da znaju koliko ljudi dolazi na sajt koji poseduju. Google Analytics je najpopularniji
alat za praenje posete na vaem sajtu. Nametanje Google Analytics-a je veoma lako. Kada
napravite svoj besplatan nalog Google e vam prikazai nekoliko linija koda koji bi trebalo da
smestite na svoj sajt.
Do skoro se koristio tradicionalni analytics kod koji se smetao pri dnu strane tj. pre samog
zatvaranja body dela odnosno pre </body> taga. To mesto se nalazi u footer.php fajlu.
Sada se koristi novi tzv. Asinhroni kod koji se dodaje pre zatvaranja head dela tj.
pre </head>taga. Novi nain praenja posete je daleko efikasniji i taniji.