Recent m-am apucat sa-mi incerc norocul ca programator de tema WordPress (n-am talent la grafica, nu ma bag :) ). Si, avand in vedere ca poti intelege cel mai bine un lucru daca incerci sa-i explici altuia, m-am decis sa scriu o serie de articole despre ce se ascunde in spatele temelor pentru cea mai populara platforma de blogging.

Orice tema WordPress este compusa din urmatoarele fisiere:

  • header.php – antetul paginii
  • footer.php – partea de la capatul de jos (nu stiu un termen potrivit pentru aceasta parte a paginii, ma ajutati? :) )
  • sidebar.php – bara laterala
  • comments.php – tabelul pentru parerile cititorilor
  • index.php – care unifica toate celelalte
  • style.css – efectiv responsabil pentru cum arata blogul tau (culori, tipuri de litere, etc) + contine informatiile despre tema. Nu se poate activa o tema fara style.css!

Si azi incep cu disecarea celui mai important – dar totodata celui mai simplu – fisier din orice tema WordPress: index.php.

WordPress foloseste o serie de functii PHP pentru a “chema” fisierele temei la locul lor. Acestea se pot chiar inlocui cu cate o functie “include”,  dar functiile folosit de WP fac mai mult: in cazul in care nu gasesc fisierul cautat in directorul temei actuale, o iau pe cele de la tema “Default” care este inclusa in fiecare instalare a platformei.

In fine… index.php incepe cu expresia get_header(), ceea ce pozitioneaza fisierul header.php pe partea de sus a paginii.

Partea responsabila pentru citirea din baza de date si afisarea continutului blogului se numeste “the loop”, adica bucla. Un loop simplu arata in felul urmator:

<?php get_header() ?>
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
<h1><a href=”<?php the_permalink(); ?>”><?php the_title(); ?></a></h1>
<?php _e(’Category&#58;’); ?><?php the_category(’, ‘); ?><?php the_time(’F jS, Y’) ?> <?php _e(’by’); ?>
<?php the_author(); ?><?php comments_popup_link(’No Comments &#187;’, ‘1 Comment &#187;’, ‘% Comments &#187;’); ?>
<?php the_content(’Read More…’); ?>
<?php endwhile; ?>
<?php endif; ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Loop-ul pur (cu header.php gol) genereaza o pagina de genul celui de mai jos:

Tema WordPress compusa dintr-un index.php cu loop gol.

Arata cam najpa, asa-i? Dar acest lucru face deja ceva fara care nici un blog nu poate functiona: afiseaza articolele. E si asta ceva!

Sa vedem care parte a loop-ului raspunde pentru care parte a continutului afisat:

<?php get_header() ?> – cheama header.php – despre el voi scrie intr-un alt articol.

<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>

Tradus, aceasta linie de cod inseamna: daca avem articole in baza de date, si pana mai sunt, citeste articolele. Nimic afisat pana acum.

<h1><a href=”<?php the_permalink(); ?>”><?php the_title(); ?></a></h1>

Acest “heading 1″ contine deja titlul articolului. the_permalink() genereaza o legatura permanenta catre articol, iar the_title() citeste titlul articolului (in cazul nostru Test Post 1 si Test Post 2).

<?php _e(’Category&#58;’); ?><?php the_category(’, ‘); ?><?php the_time(’F jS, Y’) ?> <?php _e(’by’); ?>
<?php the_author(); ?><?php comments_popup_link(’No Comments &#187;’, ‘1 Comment &#187;’, ‘% Comments &#187;’); ?>

Acest sir de cod afiseaza informatii de genul: categoriile din care face parte articolul, data si ora la care s-a inregistrat articolul, autorul si numarul de pareri.

<?php the_content(’Read More…’); ?>

Aceasta functie afiseaza textul articolului, iar textul intre paranteze si apostrofuri este cel afisat in cazul in care autorul introduce un tag “more” in text, inseamnand ca pana la acest tag se afiseaza textul pe prima pagina. In editorul vizual pe care cred ca il folositi mai toti, acest tag se poate introduce prin apasarea butonului .

<?php get_sidebar(); ?> – cheama sidebar.php
<?php get_footer(); ?> – cheama footer.php

<?php endwhile; ?> si <?php endif; ?> nu afiseaza nimic, ei doar inchid bucla.

Cam asta ar fi partea mai importanta a fisierului index.php din tema noastra WordPress. Elementele de mai sus care afiseaza diverse parti ale continutului sunt impartite foarte bine, astfel incat fiecare poate fi afisata in mod diferit.

Cei care vor sa descarce tema YourBLOG v0.1 (se poate vedea live pe http://dev.yourblog.ro) o pot face de aici.

Related posts:

  1. Anatomia unei teme WordPress [Partea II - header.php si footer.php]
  2. Anatomia unei teme WordPress [Partea IV - CSS de baza]
  3. Anatomia unei teme WordPress [Partea III - sidebar.php, searchform.php, widgets, functions.php]
  4. Anatomia unei teme WordPress [Partea III - sidebar.php, searchform.php, widgets, functions.php]
  5. 5 teme frumoase WordPress in verde