El document functions.php

Al costat dels documents bàsics per la creació d’un theme de Wrodpress no podem obviar functions.php. Aquest és un document opcional per a un framework de WordPress però molt necessàri per activar i editar determinades funcionalitats en un theme una mica més avançat.

El document functions.php, se situa a l’arrel del directori del theme i queda automàticament vinculat al mateix. Entre moltes altres, les funcions principals permeten activar i editar plugins de WordPress, com ara l’edició de menus, la creació d’àrees de ginys (widgets), l’associació de miniatures als articles (thumbnails) o el control de la llargada dels resums de les entrades o posts del weblog …

A continuació trobareu un recull comentat del codi que hem treballat a classe per tal d’afegir aquestes funcionalitats extres al nostre framework.

functions.php

01. <?php
 
<!-- 'register_nav_menus' és una funció permet la creació de menus personalitzats per al theme. En aquest cas s'ha definit tres menus diferents: un primari, un secundari i un per a dispositius mòbils. Afegint aquesta funció s'activen les funcionalitats menus al tauler d'Aparença' de l'administrador. -->
 
02. register_nav_menus( array(
03.    'primary' => __( 'Menú principal', 'framework' ),
04.    'secondary' => __( 'Menú secundari', 'framework' ),
05.    'mobile' => __( 'Menú mòbil', 'framework' )
06. ));
 
07. function framework_theme_widget() {
08.   register_sidebar( array(
09.     'name' => 'Widget Peu',
10.     'id => 'footer_left',
11.     'before_widget' => '<div>',
12.     'after_widget' => '</div>',
13.     'before_title' => '<h4>',
14.     'after_title' => '</h4>',
15.  ));
16. }
 
17. add_action( 'widgets_init', 'framework_theme_widget' );
18. add_theme_support( 'post-thumbnails' );
 
19. ?>



La funció The Loop

The Loop és un codi PHP utilitzat per WordPress per mostrar publicacions. Mitjançant The Loop, WordPress processa cada entrada per mostrar diferents element de la mateixa (títol, autor, data, hora, contingut, categoria, resum, imatge destacada, …) a la pàgina en que hem inserit el codi. en aquest cas ho inserirem a l’arxiu index.php, tot ampliant el que ja vàrem comentar en el post anterior.

Qualsevol codi HTML o PHP del The Loop es processarà en cada publicació. D’aquesta manera disposem d’un gran control sobre la forma en que es mostra la publicació.

index.php
18. <!-- ampliació de la lliçó anterior -->
19. <section>
20. <?php if ( have_posts() ) :
while ( have_posts() ) : the_post(); ?>
Aquí comença The Loop. Es tracta d'una estructura reiterativa que inserirà un article i tot el contingut que sol·licitem per cada entrada publicada.
 
21. <article>
22. <h3><?php the_title(); ?></h3>
Insereix el títol de l'entrada en forma de títol de nivell 3.
 
23. <p><small><?php echo get_the_date(); ?></small></p>
Insereix el la data de l'entrada per cada entrda.
 
24. <p><?php the_excerpt(); ?></p>
Insereix el resum de l'entrada.
 
25. </article>
26. <?php endwhile; else : ?>
27. <?php endif; ?>
Aquí tanquem i aturem la sentència reiterativa.
 
28. </section>


En funció del disseny i el contingut que desitgem mostrar, hi ha altres funcions que poden incrustar, per exemple, el contingut amb the_content();, l’autor amb the_author();, la categoria amb the_category(); i l’hora amb the_time, entre altres. Al codex de WordPress s’hi recullen les diferents opcions i els arguments que permeten personalitzar la forma com es mostren.

Existeixen molts themes disponibles per wordpress. Els themesés un directori d’arxius que modificquen l’aspecte del weblog i que permet personalitzar la manera com es mostra i estructura el contingut. Canvia aspectes com els colors, la capçalera, la pàgina principal, el format de les dades, etc.

Molts d’aquests themes són gratuïts i lliures, d’altres, sovint els més atractius i complets, són de pagament i amb drets de reproducció limitats.

En aquesta entrada comencem una lliçó que ocuparà diferents articles destinats a aprendre a crear un theme de wordpress, original i des de zero.

El framework bàsic

Les plantilles de WordPress estan composades per llarga corrua d’arxius PHP que inclouen diversos llenguatges, d’arxius CSS i JavaScript, entre altres. En aquest primer post plantegem la creació d’un framework (marc de treball) que permeti visualitzar els continguts que s’editen i publiquen des de la interfície d’administrador de WordPress (dashboard).

Per realitzar aquest framework més bàsic, necessitarem dos arxius, a tot estirar tres:

• index.php Aquest arxiu allotjarà el document HTML i les instruccions més bàsiques en PHP perquè es mostrin els continguts de wordpress.
• style.css Aquest arxiu allotja el codi CSS, que permet modificar la forma en que es mostra la pàgina, i una capçalera dins d’un comentari que dona nom i descriu la plantilla per a wordpress.
• screenshot.png Aquest arxiu és la imatge que identifica la plantilla des de l’apartat themes de wordpress. Aquesta imatge cal que sigui de 1200X900 píxels, com a mínim, per no perdre resolució i que es vegi correctament des del perfil d’administrador de WordPress.

En aquest article s’explica pas a pas com instal·lar WordPress en un ordinador personal mitjançant un servidor local. Disposar d’un WordPress local és molt útil per què permet treballar-hi com en un banc de proves. És molt útil per dissenyar un blog o una web abans de publicar-ho a Internet.

Primer pas: Servidor local

El primer que cal fer és activar el servidor local. Un servidor local és una aplicació que simula el funcionament d’un servidor web real però en el pla local. Inclou el sistema de servidors web Apache i les aplicacions addicionals Mysql y PHP, entre altres.

Existeixen diferents opcions, sovint associades a diferents sistemes operatius. Tenim MAMP, per a MAC i Windows. WAMP per a Windows, i XAMPP per a Linux, Windows i MAC.

Tria l’opció que més s’adigui a les teves necessitats i al teu equip i instal·la-la. Un cop instal·lada, activa tots els serveis.

Segon pas: Creació de la base de dades.

Per instal·lar WordPress i aconseguir que desplegui totes les seves funcions, necessitarem crear una base de dades. Per crear-la obrirem el servvei PhpMyAdmin del servidor. És possible que et demani contrasenya o usuari. En servidors locals acostuma a ser “root”.

Un cop dins l’aplicació PhpMyAdmin anem a “Database” i creem una base de dades. Cal recordar el nom de la mateixa. En aquest pas a pas l’anomenarem wpsample.

Tercer pas: Preparació del directori WordPress.

En aquest pas prepararem el directori d’instal·lació i allotjament de WordPress. El primer que ens cal és baixar els documents del CMS de WordPress. Clicant aquí pots descarregar la versió oficial en català. Comprovarem que WordPress se’ns descarrega en una carpeta comprimida en .zip. Cal extreure el contingut al directori de lectura i emmagatzematge del Servidor local. En el cas de MAMP server cal seguir la ruta següent.

c://MAMP/htdocs/wpsample

Com podeu comprovar aquí hem canviat el nom de la carpeta (de wordpress a wpsample) per poder referenciar millor el tutorial.

Quartpas: Instal·lació del CMS WordPress.

Cal activar tots els serveis del servidor local i obrir el navegador i escriure la ruta següent a la barra d’adreces.

http://localhost/wpsample

En aquest punt comprovarem que se’ns presenta una pàgina d’instal·lació molt senzilla de seguir. Ens demanarà informació relativa a la base de dades i a l’usuari i la contrasenya d’accés al mateix. Si seguim els passos, la instal·lació és ràpida i senzillai rapidament podrem gaudir d’una mostra local del gestor de continguts més famós.

WordPress és un sistema de gestió de continguts de codi obert per a la publicació de continguts, la creació i la gestió de blogs i webs.

Hi ha dos versions de WordPress en funció de si l’allotjament i el domini el gestiona el propi WordPress o si el gestiona l’usuari des d’un servidor web alternatiu. En el primer cas ens adreçarem a WordPress.com, ens registrarem i seguirem unes instruccions molt senzilles per obrir el lloc web. Te algunes limitacions quan al disseny i la personalització, però és una bona forma de començar a experimentar amb la publicació de continguts.

En el segon cas en que l’allotjament i domini estan gestionats pel propi usuari necessitem disposar d’un servidor propi o tenir contractats els serveis amb una empresa de comercialització de hostings i dominis. La majoria d’aqiestes ja disposen de paquets d’instal·lació automàtics de wordpress. No obstant, si no és així, haurem d’anar a ca.wordPress.org per descarregar els arxius necessaris per a la instal·lació.

A WordPress se li poden afegir funcionalitats per mitjà de connectors i extensions, i també és possible canviar l’aparença visual per mitjà de temes predefinits. A més, l’usuari pot modificar al seu gust el codi XHTML, HTML i CSS de les seves pàgines mitjançant l’editor WYSIWYG que inclou.

En aquest curs aprendrem a fer anar el sistema de publicació de wordpress, a instal·lar-lo en un servidor local, a aplicar plantilles i extensions i, fins i tot, a fer una plantilla completament original.