WordPress je CMS platforma koja ubedljivo najbrže raste u današnjoj web-dizajn industriji. Dobar deo akcija koje se dešavaju u WordPress zajednici su uglavnom pokrenute tržištem WordPress tema.

Širok izbor besplatnih i komercijalnih tema je upravo jedna od stvari koje čine WordPress tako atraktivnim za korišćenje. Ali tema je često samo početna tačka ka daljim prilagođavanjima. Web diveloperi i vlasnici web sajtova vole da počnu sa nekom temom, a onda da je dalje prilagođavaju svojim potrebama dok ne dođe do željenog izgleda ili dok ne udovolje željama klijenta.

Mnoge teme, naročite one koje su komercijalne, dolaze upakovane sa jasnom stranom sa opcijama vezanim za tu temu, koja vam dozvoljava da kofigurišete većinu aspekata. Najbolje je da pogledate sve opcije koje tu postoje pre nego što “zaronite” u kod. Drugačije rečeno, svaka tema ja različita od druge, pa ponekad morate da zavrnete rukave i uđete 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 početno 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 možete je lako update-ovati, a da ne izgubite modifikacije koje ste napravili. Pogledajte WordPress.org Codex za više 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 počnete sa editovanjem CSS-a. U najvećem broju slučajeva stilovi koje koristi vaša tema se nalaze u fajlu pod nazivom style.css. Ovaj fajl se uvek nalazi u temi, jer ovaj fajl definiše tema u WordPress admin delu. Ponekad se tu nalaze i neki dodatni  stilovi, koji mogu da se nalaze u podfolderima.

Najbolji način da pronađete 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 omogućava da pregledate CSS u letu i da brzo locirate stil i liniju koju treba da promenite. Ako ne koristite FireBug, vreme je da počnete.

2. Prikazati odlomak posta ili ceo sadržaj

Ponekad, po default-u, vaša tema prikazuje kompletan sadržaj postova na početnoj strani. Recimo da biste radije prikazali kratak odlomak, čisto da privučete interesovanje čitalaca kako bi kliknuli dalje i pogledali ceo tekst. Ili možda obrnuto – tema pokazuje odlomke, a vi biste radije odmah sve prikazali.

Evo dva tag-a koje treba da zamenite. Ovaj tag prikazuje ceo sadržaj postova:

<?php the_content(); ?>

Više 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 sadržaj celokupnog posta):

<?php the_excerpt(); ?>

Ako nikakvi izuzeci nisu namešteni automatski će prikazati prvih par rečenica vašeg posta.

Više informacija o ovom tag-u.

3. Kreirajte svoj template za određenu stranu

Dešava se da je potrebno da kreirate određenu stranicu koja mora da ima svoj poseban layout — nešto drugačije od drugih.  Želeli biste malo fleksibilnosti u HTML kodu, ali da promene koje unesete ne utiču na druge strane koje već postoje na vašem sajtu. WordPress čini da kreiranje jedinstvenih templejta i dodeljivanje istih određenoj strani bude poprilično lako. Evo kako:

• Napravite kopiju fajla page.php koji se nalazi u vašoj temi.  Ovo je fajl koji WordPress koristi da prikaže strane.
• Promenite ime kopiji u koje god želite.  U ovom primeru nazvaćemo ga, cene.php (napravićemo jedinstvenu stranu za prikaz cena).
• Na vrhu strane dodajte ovaj deo koda:

<?php
/*
Template Name: Cene
*/
?>

• Modifikujte html kod i CSS za ovu stranu kako god želite.
• Napravite u okviru WordPress-a page sa nazivom “Cene”. Koristeći padajući meni za izbor templejta izaberite “Cene”.
• Snimite stranu.  Sada će se strana prikazivati koristeći template koji ste kreirali.

4. Napravite loop: Isključenje/Uključenje kategorije

Recimo da želite da prikažete 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 početnoj strani koji prikazuje postove iz kategorije “Istaknuto”. Želeli biste da prikažete postove i ispod slajdera, ali tako da ne uključite u tom prikazu postove iz kategorije “Istaknuto”, jer bi se u tom slučaju duplirali na strani. Evo kako to da uradite:

Dodajte ovu liniju pre loop-a:

<?php query_posts(‘cat=-8′); ?>

Ovo će isključiti iz prikaza sve postove koji su iz kategorije sa ID-jem 8. Dakle neophodno je da znate ID kategorije koju želite da isključite što možete videti u admin delu sajta za administraciju kategorija.

Možda želite da uradite obrnuto: Prikaz postova samo iz određene kategorije. Prosto! Sklonite ” – ” pre ID-a vaše kategorije:

<?php query_posts(‘cat=8′); ?>

Više informacija o Loop-u i Query Post-ovima.

5. Seckanje navigacije na lakši način

Mnoge teme prikazuju sve vaše strane na vrhu sajta uz pomoć padajućeg menija ili hijerarhijske navigacije. Ali recimo da želite da izbegnete neke strane u navigaciji. Ponekad ćete imati strane koje nema potrebe da budu odmah izložene, kao što su na primer “Uslovi korišćenja”.

Evo lakšeg načina da isključite određenu stranu iz prikaza u meniju. Pronađite kod koji prikazuje listu strana:

<?php wp_list_pages(); ?>

Promenite je u:

<?php wp_list_pages(‘exclude=5′); ?>

Na ovaj način kažete 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 slučaju sa kategorijama i ovde morate znati ID strane koju želite da isključite.

Više informacija: WP List Pages

6. Uključivanje menu managment-a u WordPress-u 

Da li želite da imate kompletnu kontrolu nad navigacijom na vašem sajtu kao što je na primer nameštanje vašeg željenog redosleda, uključivanje/isključivanje strana, kategorija i eksternih linkova? Ko ne bi? WordPress od verzije 3.0 donosi jednu kul novu opciju nazvanu “Menus”, koja vam daje ovu fleksibilnost. Međutim, ovu opciju možete koristiti samo ako vaša tema podržava istu.

Evo kako da promenite tradicionalnu navigaciju (korišćenjem wp_list_pages()😉 u novu koja može da se kontroliše iz admin dela.

NAPOMENA: Morate imati WordPress 3.0+.

Prvo, morate da uključite ovu mogućnost dodavanjem sledeće 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, moraćete da kreirate i svoj meni tako što odete u Appearance > Menus.

Više informacija: WP Nav Menu

7. Napravite jednostavan IF

Ponekad biste želeli da se neki deo sadržaja menja u zavisnosti od toga koju stranu korisnik gleda. Na primer, kada korisnik gleda stranu “Cene”, želite da vam se sa strane prikaže poruka “Cene za svaki budžet”, ali na svim drugim stranama biste umesto te poruke prikazali “Kvalitetni proizvodi, pouzdana usluga!”.

Evo načina da ovo namestite koristeći IF:

<?php if ( is_page(‘Cene’)) { ?>

<p>Cene za svaki budžet!</p>

<?php } else { ?>

<p>Kvalitetni proizvodi, pouzdana usluga!</p>

<?php } ?>

Više informacija: Conditional Tags

8. Post thumbnails

WordPress 2.9 je uveo jednu zgodnu opciju nazvanu “Post Thumbnails”.  Kao što ime kaže, dozvoljava vam da podesite thumbnail sliku svom postu, bez potrebe da definišete custom polje ili da sliku ubacujete u sadržaj 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 vaših postova ili ako koristite WordPress postove kao svoj portfolio. Postoji još dosta drugih situacija kada thumbnail-ovi stupaju na scenu. Evo kako možete ovu opciju da uključite u svojoj temi:

Kao i sa opcijom menus, Post Thumbnails se mora uključiti u temi. Dodajte ovu liniju koda u functions.php fajl:

<?php add_theme_support( ‘post-thumbnails’ ); ?>

Onda, unesite post thumbnail sliku u okviru loop-a,koristeći sledeći tag:

<?php the_post_thumbnail(); ?>

Možda ćete želeti da doterate izgled koristeći CSS.  Možete takođe dodati mogućnost različitih veličina i opciju za sečenje slika.  Pogledajte ovaj tutorijal o opciji Post Thumbnails za više informacija.

9. Dodavanje sadržaja na kraju posta

U nekim situacijama ćete poželeti da dodate nešto na kraj svakog posta — nešto konstantno, recimo poruku promocije vaših 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 pronađite zgodno mesto da dodate željeni sadržaj. Dobro mesto je obično ispod članka, ali pre komentara:

<?php the_content(); ?>

Vaš dodatni sadržaj…

<?php comments_template(); ?>

Vaša 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 praćenje posete na vašem sajtu. Nameštanje 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 smeštao 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 način praćenja posete je daleko efikasniji i tačniji.