În primul rând scuzaţi absentarea de ieri, providerul a avut ceva probleme, era duminică şi am fost offline. Dar revin astăzi cu un prim articol ce vorbeşte despre înţelegerea temelor de wordpress, nu crearea, nu designul, înţelegerea lor. Temele de wordpress, înţelese, sunt extrem de simple, doar câteva fişiere, ceva taguri şi gata. Dar privind de afară e posibil să aveţi ceva probleme.
Am pregătit, ca de obicei, schiţe, imagini, explicaţii. Un prim articol dintr-o altă serie începută de mine, legată de designul - temele wordpress. Să vedem.
Secţiuni şi fişiere
Ca exemplu voi lua o temă generală cu header, conţinutul articolelor, sidebar şi footer. Am făcut o schiţă împărţită pe secţiuni ca treburile să fie mai clare:
Header-ul
Headerul temei reprezintă în primul rând începerea d.p.d.v. al sursei al unei pagini web, în cazul nostru, startul temei (reprezentat prin <html><head> …</head><body>). D.p.d.v. al designului, header-ul este o porţiune ce se repetă peste tot în blog. Headerul Tehnic NET de exemplu este porţiunea cu logo şi meniul, se repetă în fiecare articol, pe index, în arhivă, peste tot.
Headerul trebuie salvat sub numele header.php, numele e în setările implicite wordpress şi e recunoscut de tagurile de recunoaştere, deci nu vă jucaţi cu el. Lăsaţi-l aşa şi neapărat sub extensia .php, rulează php şi e complet necesar.
Înţelegerea sursei: Sursa headerul este cam cea mai uşoară, are taguri ce trebuie să fie neapărat prezente. Am pregătit o versiune “lite” unui fişier header, cu tagurile complet necesare:
<html>
<head>
<title><?php bloginfo(’name’); ?> <?php if ( is_single() ) { ?> » Blog Archive <?php } ?> <?php wp_title(); ?></title> // Reprezintă titlul blogului, postului în formatul său original<meta name=”generator” content=”WordPress <?php bloginfo(’version’); ?>” /> // Ajută contorizarea blogurilor ce rulează wordpress
<meta http-equiv=”Content-Type” content=”<?php bloginfo(’html_type’); ?>; charset=<?php bloginfo(’charset’); ?>” /> // Defineşte charset-ul şi tipul html al pagini<link rel=”alternate” type=”application/rss+xml” title=”<?php bloginfo(’name’); ?> RSS Feed” href=”<?php bloginfo(’rss2_url’); ?>” /> // Defineşte locul rss-ului, ca utilizare dacă rulaţi Firefox, Opera, în bara de adresă observaţi, în dreapta, iconiţa rss
<link rel=”pingback” href=”<?php bloginfo(’pingback_url’); ?>” /> // Defineşte link-ul către sistemul de pingback wordpress
<link rel=”stylesheet” href=”<?php bloginfo(’stylesheet_url’); ?>” type=”text/css” media=”screen” /> // Defineşte locul către stilul .css al temei wordpress
<?php wp_head(); ?> // Cum spuneam, e folosit pentru recunoaştere şi introducere a unui conţinut suplimentar în header, trebuie să stea înainte de tagul ‘</head>’</head>
<body>
‘Tot ce e mai sus trebuie introdus în fişierele header.php ale temelor, sunt taguri complet necesare. Despre meta taguri, utilitare SEO, voi scrie într-un articol viitor.
Conţinutul paginii de start - index
Conţinutul paginii de start într-o temă obijnuită Wordpress nu prezintă nimic altceva decât o înşiruire de articole, ale cărui număr îl setaţi voi din panoul de administrare wordpress (Options > Reading). Fişierul trebuie să aibe numele index.php, este şi cel mai esenţial, fără el neputând rula o temă wordpress deloc, sau cum trebuie.
Ca şi la header, am făcut o versiune lite cu explicaţiile pentru tagurile necesare, să vedem:
<?php get_header(); ?> // (1) Tagul reprezintă preluarea headerului, adică ordonă php-ului sa fiseze headerul<?php if (have_posts()) : ?> // (2) Daca sunt articole, asta e conditia, daca e respectata se afiseaza continutul de mai jos
<?php while (have_posts()) : the_post(); ?> // (3) Daca sunt articole, sa se afiseze. Acesta este inceputul fiecarui articol<a href=”<?php the_permalink() ?>” rel=”bookmark” title=”Permanent Link to <?php the_title(); ?>”><?php the_title(); ?></a> // Acesta e titlul articolului cu link catre pagina acestuia<?php the_time(’F jS, Y’) ?> // Tag optional: Afiseaza data la care s-a scris articolul, in formatul international php
<?php the_author() ?> // Tag optiona: Afiseaza autorul articolului
<?php the_category(’, ‘) ?> // Tag optional: Afiseaza categoriile in care a fost introdus articolul<?php the_content(’Read more..’); ?> // (4) Afiseaza continutul articolului, intre ‘ ‘ fiind introdus textul ori portiunea de cod ce se afiseaza in cazul in care articolul are <!– more –> in el!!! Daca aveti taguri ale diverselor pluginuri dedicate articolelor (etichete, rating, view-uri) sau orice ce se refera la fiecare articol trebuie introsu intre tagul (3) si (5) !!!
<?php endwhile; ?> // (5) Acest tag semnifica finalul fiecarui articol, orice cuvant, cod introdus intre (3) si acest tag se repeta la fiecare articol.
<?php else : ?> // (6) Tot ce e intre tagul (2) si acest tag se afiseaza in cazul in care sunt articole. Ce e dupa acest tag si tagul (7) e continutul afisat daca nu sunt articole.
Aici se introduce continutul afisat in cazul in care nu sunt articole, de ex:
Inca nu sunt articole!
<?php endif; ?> // (7) Sfarsitul continutul afisat in cazul in care nu sunt articole, si finalul acelui “daca sunt articole”, un lucru de memorat, fiecare <?php if(ceva()) : ?> in cadrul unui fisier de tema wordpress trebuie sa aiba un final, reprezentat prin <?php endif; ?>. Daca un <?php if(()) : ?> nu are un tag de final <?php endif; ?> sau daca e un tag de final in plus, pagina prezinta erori.
<?php get_sidebar(); ?> // (8) Tagul reprezinta comanda preluarii sidebar-ului, fisier de care vorbim mai jos
<?php get_footer(); ?> // (9) Tagul reprezinta comanda preluarii footerului, la fel, fisier amitit mai jos.
Pagina unui articol & Comentariile
Pagina unui articol e reprezentată prin fişierul signle.php, şi reprezintă pagina creată fiecărui articol în parte. Difrenţa dintre ea şi pagina de start este afişarea a numai un articol, articolul în parte şi comentariile. Pentru a afişa comentariile trebuie să introduceţi un simplu tag, următorul:
<?php comments_template(); ?>
La partea de comentarii lucrurile se complică, sunt două părţi esenţiale: lista comentariilor şi formularul de comentarii. Şi aici am pregătit o versiune lite a unui evenual fişier de comentari, fişier ce apropo, e necesar să aibă numele comments.php. Pentru a înţelege mai bine am împărţit fişierul în cele două părţi de care vorbeam:
Lista Comentariilor:
<?php // Acest tag nu trebuie sa dispara, preia si trimite datele, basenam-ul si statusul comentariiol pentru post, nu aveti ce umbla la ei
if (’comments.php’ == basename($_SERVER['SCRIPT_FILENAME']))
die (’Please do not load this page directly. Thanks!’);if (!empty($post->post_password)) {
if ($_COOKIE['wp-postpass_' . COOKIEHASH] != $post->post_password) { // Acest tag pune situatia de a afisa un mesaj in cazul in care articolul e protejat din dashboard cu o parola ?><p class=”nocomments”>Aici introduci textul afisat in cazul in care articolul e protejat cu o parola.</p><?php
return;
}
}
?><?php if ($comments) : ?> // (1) Daca sunt comentarii, tot ce e sub acest tag pana la <?php endif; ?> se afiseaza dac asunt comentarii
<?php comments_number(’No Responses’, ‘One Response’, ‘% Responses’ );?> to “<?php the_title(); ?>” // Tag optional: afiseaza numarul de comentarii al articolului cu pricina
<?php foreach ($comments as $comment) : ?> // (2) Tagul de start al fiecarui comentariu in parte
<?php comment_author_link() ?> // Tag optional: Acest tag introduce autorul fiecarui comentariu
<a href=”#comment-<?php comment_ID() ?>” title=”"><?php comment_date(’F jS, Y’) ?> at <?php comment_time() ?></a> <?php edit_comment_link(’edit’,’ ‘,”); ?> // Tag optional: Acest tag introduce data fiecarui comentariu in parte
<?php if ($comment->comment_approved == ‘0′) : ?> // (3) Acest tag pune optiunea ca daca cineva trimite un comentariu si acesta e tinut sub moderare sa apara un mesaj, cel de mai jos
Aici apare mesajul afisat in cazul in care comentariul e tinut sub moderare
<?php endif; ?> // (4) Sfarsitul tagului ce punea optiunea unui mesaj in caz de moderare
<?php comment_text() ?> // (5) Acest mesaj introduce textul propriuzis al fiecarui comentariu
<?php endforeach; ?> // (6) Tagul de final al fiecarui comentariu in parte, tot ce e intre tagul (2) si (6) se repeta la fiecare comentariu
<?php else : ?> // (7) Acest tag inchide optiunea tagului (1) care afisa pana aici un continut in cazul in care erau comentarii, ce e dedesubt de acest tag pana la urmatorul (9) e un continut afisat daca nu e inca nici un comentariu
<?php if (’open’ == $post->comment_status) : ?> // (8)
Aici vine mesajul afisat in cazul in care nu sunt comentarii
<?php else : ?> // (9) Si o alta situatie, intre acest tag si tagul (10) se afiseaza continutul in cazul in care comentariile sunt inchise
Aici vine mesajul afisat in cazul in care comentariile sunt inchise
<?php endif; ?> // (10) Acesta este tagul de final al tuturor afisajelor
<?php endif; ?> // (11) Acesta este tagul de final al listei de comentarii
Formularul de comentarii
<?php if (’open’ == $post->comment_status) : ?> // (1) Acest tag “ordona” blogului sa afiseze formularul dar doar in situatia in care statusul comentariilor e favorabil, adica ori nu e parola ori e comentariile sunt deschise<?php if ( get_option(’comment_registration’) && !$user_ID ) : ?> // (2) Daca wordpressul e setat ca doar cei cu user si autentificati sa
Mesajul afisat in cazul in care e necesar sa fi autentificat ca sa scrii comentarii
<?php else : ?> // (3) Acest tag introduce un alt continut, cel afisat in cazul in care nu e necesar sa fi autentificat, ci simpu vizitator <form action=”<?php echo get_option(’siteurl’); ?>/wp-comments-post.php” method=”post” id=”commentform”> // Acesta e inceputul formularului de comentarii<?php if ( $user_ID ) : ?> // (4) Acest tag introduce optinea ca daca esti autentificat sa poti sari peste completarea numelui, a emailului si a site-ului web cand comentezi, ele sunt deja completate in profilul de administrator<p>Logged in as <a href=”<?php echo get_option(’siteurl’); ?>/wp-admin/profile.php”><?php echo $user_identity; ?></a>. <a href=”<?php echo get_option(’siteurl’); ?>/wp-login.php?action=logout” title=”Log out of this account”>Logout »</a></p>
<?php else : ?> // (5) Acest tag introduce continutul afisat in cazul in care nu esti autentificat, respectiv numele, emailul si site-ul
<p><input type=”text” name=”author” id=”author” value=”<?php echo $comment_author; ?>” size=”22″ tabindex=”1″ /> // (5.1) Campul si textul pentru numele celui ce comenteaza
<label for=”author”><small>Name <?php if ($req) echo “(required)”; ?></small></label></p> // (5.3) Campul si textul pentru numele celui ce comenteaza
<p><input type=”text” name=”email” id=”email” value=”<?php echo $comment_author_email; ?>” size=”22″ tabindex=”2″ />
<label for=”email”><small>Mail (will not be published) <?php if ($req) echo “(required)”; ?></small></label></p> // (5.2) Campul si textul pentru mailul celui ce comenteaza
<p><input type=”text” name=”url” id=”url” value=”<?php echo $comment_author_url; ?>” size=”22″ tabindex=”3″ />
<label for=”url”><small>Website</small></label></p> // (5.3) Campul si textul pentru site-ul celui ce comenteaza
<?php endif; ?> // (6) Acest tag introduce continutul afisat atat in cazul in care esti cat si in cel in care nu esti autentificat, respectiv campul pentru continutul comentariului
<p><textarea name=”comment” id=”comment” cols=”100%” rows=”10″ tabindex=”4″></textarea></p>
<p><input name=”submit” type=”submit” id=”submit” tabindex=”5″ value=”Submit Comment” /> // (7) Aici este butonul de trimitere a comentariului, textul Submit Comment putand fi inlocuit cu ce vrei sa apara pe buton
<input type=”hidden” name=”comment_post_ID” value=”<?php echo $id; ?>” />
</p>
<?php do_action(’comment_form’, $post->ID); ?>
</form>
<?php endif; ?> // (8) Tagul de final pentru afisarea dupa situati - autentificat sau nu
<?php endif; ?> // (9) Tagul de final pentru toate comentariile
Sidebar-ul
Sidebarul e reprezentat printr-un fişier ce poartă numele sidebar.php. Sidebar-ul e de obicei navigatorul, acolo se află categoriile, blogroll-ul, eventual paginile şi orice ajută la navigare şi nu e introdus deja altundeva. În sidebar nu există anumite taguri ce trebuie neapărat introduse, totuşi fac o versiune a unui posibil fişier cu cele mai populare combinaţii:
<?php wp_list_pages(’title_li=<h2>’ . __(’Pagini’) . ‘</h2>’ ); ?> // Acest tag introduce o lista cu paginile voastre, titlul fiind << Pagini >> (fără << >>)<?php wp_list_categories(’&title_li=<h2>’ . __(’Categorii’) . ‘</h2>’ ); ?> // Acest tag introduce lista cu categoriile voastre, titlul fiind << Categorii >> (fara << >>)<?php wp_list_bookmarks(”); ?> // Acest tag introduce blogroll-ul vostru, categoriile le organizati din administrare<h2> Ultimele Articole </h2>
<?php
$lastposts = get_posts(’numberposts=5′);
foreach($lastposts as $post) :
setup_postdata($post);
?>
<li> <a href=”<?php the_permalink(); ?>” id=”post-<?php the_ID(); ?>”><?php the_title(); ?></a></li>
<?php endforeach; ?>
// Aceasta e o simpla modalitate de a afisare a ultimelor 5 articole de pe blog (sau mai multe, modificati numarul de dupa numberposts=X).
<?php wp_get_archives(”); ?> // Acest tag va introduce arhiva lunara a articolelor
Footerul
Footerul e un simplu fişier - footer.php, e doar un tag ce trebuie introdus şi pagina trebuie închisă, asta e tot, adică:
<?php wp_footer(); ?> // La fel ca la header, unele pluginuri pot introduce scripturi in pagina, acest tag le introduce in footer.</body>
</html>
Concluzia
Temele sunt reprezentate prin nişte fişiere .php conectate între ele. Fişierul principal e index.php care printr-un tag introduce header.php ce semnifică începutul pagini, introduce sidebar-ul şi semnătura. Fiecare fişier al unei teme are unele taguri implicite wordpress, de recunoaştere, e un sistem pe care trebuie să îl memoraţi:
<?php if(ceva()) : ?> - Dupa cum se citeste, if=daca. Deci pune o conditie. De ex: <?php if(have_posts()) : ?> ar veni daca sunt articole, deci pune conditia ca continutul ce umreaza dupa el sa se afiseze doar daca sunt articole.
<?php else : ?> - Acesta pune conditia total opusa if-ului, de ex daca if pune conditia a afisa un continut doar daca sunt articole, else pune conditia afisarii unui continut doar daca nu sunt articole
<?php endif; ?> - Daca observati, celealte doua taguri de mai sus au “:” (doua puncte) ceea ce semnifica un continut, endif are “;” ceea ce semnifica finele lui.
Ca un exemplu in practica:
<?php if(have_posts()) : ?>
Continut afisat in cazul in care sunt articole<?php else : ?>
Continut afisat in cazul in care nu sunt articole<?php endif; ?>
Fiecare <?php if .. ?> trebuie sa aiba un <?php endif; ?> Altfel pagina nu se va afisa si apare un mesaj de eroare ce sa semnifice acest lucru.
Alta constructie pe care trbuie sa o tineti minte e <?php while (conditie()) : rezultat(); ?>. Sa intelegeţi, vă dau un exemplu: <?php while (have_posts()) : the_post(); ?> vine cam aşa: Atâta timp cât sunt posturi, adică condiţia if e respectată (aceste taguri trebuie sa stea mereu intre <?php if .. ?> si <?php endif; ?>), să se afişeze unul. Acest tag are finalul prin <?php endwhile; ?>. Deci, daca conditia ca fiind articole e respectata, se vor afisa fiecare articol in parte, in ordine cronologica descrescatoare.
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
Aici e continutul postului.
<?php endwhile; ?><?php endif; ?>
Da, dar voi aveti cate 5 articole in index.php, nu? Da. Setaţi în dashboard câte articole să poată fi vizualizate şi porţiunea între <?php while .. ?> Şi <?php endwhile; ?> se vor repeta dupa setarea din dashboard.
Astea sunt structurile. Sunt taguri specifice pentru fiecare fisier in parte, sunt si alte fisiere posibile, archive.php, page.php, dar nu obligatorii pentru o functionalitate minima a blogului. Voi vorbi despre fiecare fisier in articole urmatoare, e o serie ce discuta despre teme wordpress si sfarseste printr-o colectie de designuri si teme pe care o construiesc de ceva timp.
Până atunci însă, sper să fi înţeles totul.
Dacă totuşi aveţi nelămuriri, comentariile sunt de partea voastră.
Numai bine!
Vezi toate articolele scrise de: 
Loading ...
