Molti mi chiedono consigli e “dritte”, ma non è certo un argomento che si può esaurire in una o due email…
Richiede studio, prove, approfondimenti e -trattandosi di grafica e quindi di “creatività”- anche una certa dose di talento (se non l’avete voi… potete sempre stringere una partnership con un bravo webdesigner)…

Nei corsi che tengo e nelle sessioni di coaching consiglio sempre l’ottimo Rockstar WordPress Designer (aff.), un ebook di oltre 300 pagine zeppo di esempi e casi pronti per i nostri “copia-incolla”, edito da RockablePress, della stessa “scuderia” di ThemeForest… una garanzia!

Allegati all’ebook trovate i 3 temi d’esempio con HTML, CSS e PSD. Sono i temi che si ottengono seguendo i capitoli del libro, in modo da essere subito operativi e potersi “sporcare le mani” sin dall’inizio.

Vedrete come realizzare 3 tipi di tema:

• un classico blog
• un portfolio
• un sito “classico”

Si va dal layout in Photoshop, alla trasformazione da PSD a HTML, fino alla inclusione di tutti i tag per il funzionamento con WordPress. In pratica da Photoshop a WordPress

La “mappa” degli argomenti:

Per farvi “toccare con mano” la ricchezza dei contenuti di questo e-book ho creato una “Mappa” degli argomenti trattati (che incollo qui di seguito), traducendo in italiano l’indice.

La mappa è dinamica: potete spostarla come spostereste una mappa di Google, condividerla con altri, zoommare, ecc.

Il testo è in inglese ma vi assicuro che è di una semplicità disarmante e non è un problema seguirlo anche con la semplice “infarinatura” da scuola media.

Rockstar WordPress Designer si acquista e scarica per $29 (poco più di 21 euro) dal sito di RockablePress

Per coloro che leggono questo articolo su dispositivi mobili e non visualizzano la mappa, ecco una sintesi di alcuni argomenti:

• Familiarizzare con WordPress
  • Introduzione
  • Installare WordPress
  • Concetti Principali
  • HTML, CSS, e PHP di base
  • Il Codex di WordPress
• Tutorial: Dal PSD a HTML
• Tutorial: Layout in Photoshop
• Introduzione ai Temi
  • [...]
  • Come funziona un tema
  • I Template tags
  • Il loop
  • I files: cosa sono e cosa fanno

• Costruire un tema di base: CreatifBlog
  • [...]
  • Portare il tuo HTML in WordPress
  • I menu di navigazione
  • Creare un post “in evidenza” con WP_Query
  • Costruire la Barra laterale (sidebar)
  • Mettere i Widget nella Barra Laterale

• [...]
• Strumenti avanzati per i temi
  • Le strutture Condizionali e l’ “IF”
  • Campi personalizzati
  • Aggiungere una pagina di opzioni al tema
  • Realizzare un plugin di base
  • Realizzare un Widget di base
  • Template di Pagina
  • Modificare le funzionalità di WordPress
• Realizzare un Tema Avanzato: CreatifPortfolio
  • [...]
  • Mostrare elementi del Portfolio e del Blog
  • Realizzare Sidebar multiple
  • Aggiornare l’HomePage
  • Creare le pagine d’album
• Realizzare un Tema “stile Sito”: CreatifSite
  • Preparare il Menu
  • Mostrare i sottomenu e i titoli di pagina
  • Creare la sezione “News”
  • L’home page del sito
  • [...]

Se vuoi saperne di più, puoi scaricare l’indice e le prime 27 pagine direttamente dal sito di Rockstar WordPress Designer

E ora la parola a voi: quali suggerimenti potete dare a chi vuole imparare a fare temi per WordPress?

Tenete conto che un tipo di post personalizzato come questo può essere trattato come qualsiasi altro post di WordPress. In particolare potrete usare un file all’interno del tema con lo stesso funzionamento di single.php, ma che avrà come nome single-type.php dove type è il nome del vostro custom post type (per il nostro esempio avremo quindi single-news.php).

L’uso più comune che farete dei custom post type è però attraverso query personalizzate all’interno dei vari files contenuti nei temi (ad esempio sidebar.php o footer.php).

Per continuare il nostro esempio apriamo index.php del vostro tema ed andiamo inserire in homepage la lista delle ultime 4 news all’interno di un box.

<div>
<h4>News</h4>
<?php
$my_query = new WP_Query(array('post_type'=>'news','showposts'=>4));
?>

<ul>
<?php while ($my_query->have_posts()) : $my_query->the_post(); ?>
<li>
<span class="date"><?php the_time('j F Y') ?></span>
<?php the_content(); ?>
</li>
<?php endwhile; ?>
</ul>
</div>

Grazie al codice visto e con gli opportuni stili Css e un po’ di Javascript potrete raggiungere un risultato simile a quello che vedete nella homepage di Alt Design Web Agency.

Conclusioni

Grazie a questo breve tutorial sarete in grado di realizzare con facilità i vostri Custom Post Type e un visualizzatore di brevi news per la vostra homepage.

L’uso dei custom fields all’interno di questi nuovi tipi di post vi permetterà di modellare qualsiasi tipo informazione che vorrete visualizzare nei vostri siti web realizzati con WordPress e sarà oggetto di un prossimo tutorial.

L’esempio classico è quello della collezione di CD, in cui create un nuovo post type “cd” e vi inserite, oltre al titolo e alla descrizione (editor TinyMce) come visto nel tutorial, anche: prezzo, casa discografica, tipo di musica e nome dell’artista/i.

Per chi non fosse familiare con la programmazione php, e in generale per WordPress, segnalo (non l’abbiamo provato) il plugin Custom Post UI che permette di creare nuovi custom post type in maniera del tutto visuale.

Questo Guest Post è stato scritto da Alt Design, una web agency specializzata nella realizzazione di siti web basati su WordPress. Potete seguirli nel loro blog dove discutono di Internet Marketing.

Nell’articolo di oggi mostreremo, attraverso lo sviluppo di un semplice caso reale, come creare ed usare i Custom Post Type. Svilupperemo un semplice gestore di news, da inserire ad esempio in un box all’interno della vostra homepage.

Per comodità scriveremo tutto il codice necessario all’interno del file functions.php, presente in tutti i temi di WordPress (se non c’è createlo), ma nulla vieta nella vostra implementazione finale di inserire il tutto in un plugin per mantenere il codice più pulito ed organizzato.

Creazione e configurazione dei Custom Type

La prima cosa da fare è: dichiarare a WordPress che vogliamo usare i Custom Post Type. Per fare questo aggiungeremo una action di inizializzazione scrivendo:

add_action('init', 'register_my_custom_post_type');

dove register_my_custom_post_type sarà la funzione che verrà invocate all’init di WordPress. Se già avete una funzione registrata a tale scopo potete aggiungere il codice che segue all’interno oppure, come nel nostro caso, scrivere:

function register_my_custom_post_type() {

/* 1) DICHIARAZIONE DELLE ETICHETTE */

$labels = array(
'name' => 'News',
'label' => 'News',
'singular_name' => 'News',
'add_new' => 'Aggiungi Nuova',
'add_new_item' => 'Aggiungi Nuova News',
'edit_item' => 'Modifica',
'new_item' => 'Nuova News',
'view_item' => 'Vedi News',
'search_items' => 'Ricerca News',
'not_found' =>  'Nessuna News',
'not_found_in_trash' => 'Nessuna News nel Cestino',
'parent_item_colon' => ''
);

/* 2) CONFIGURAZIONI */

$args = array(
'labels' => $labels,
'public' => true,
'supports' => array('title', 'editor')
);

/* 3) CHIAMATA ALLA FUNZIONE INTERNA A WP */

register_post_type('news', $args);

}

Descriviamo quindi nel dettaglio le varie parti.

1) Dichiarazione delle etichette

In questa sezione del codice si dichiarano tutte le “traduzioni” che saranno utilizzate per il vostro custom post all’interno delle voci del menù di amministrazione, nei pulsanti e, in generale, in tutte le schermate che trattano il vostro nuovo custom post per le News. Gli screenshot qui in basso valgono più di 100 parole.

Il nuovo tipo di post è già disponibile

Anche il menu di inserimento rapito è stato aggiornato...

2) Configurazioni Custom Post Type

Nella seconda sezione vengono indicate, attraverso un array associativo, una serie di proprietà che andranno ad impostare vari aspetti del nuovo tipo di post. Vediamole in dettaglio:

• labels – Vedi punto 1)
• public – Indica sostanzialmente se il nuovo post type è visibile ed utilizzabile nei temi. Il suo valore è il default per una serie di altre proprietà ad esso correlate.
  • publicicly_queryable (indica se è possibile eseguire query)
  • exclude_from_search (indica se includere il post type nei risultati delle ricerche)
  • show_ui (indica se mostrare le interfacce di amministrazione per il post type)
  • show_in_nav_menus (indica se mostrare il post type nell’editor per i menù)
• supports – un’array che indica le caratteristiche che il nuovo post type avrà nella modalità di edit. Nel nostro caso abbiamo inserito solo il titolo e l’editor di TinyMce, ma è possibile aggiungere l’excerpt, gli autori, la thumbnail, i commenti, i custom fields, ecc

Per maggiori informazioni e dettagli sui vari parametri disponibili vi rimando alla documentazione ufficiale presente qui http://codex.wordpress.org/Function_Reference/register_post_type

3) Creazione effettiva nuovo post type

L’ultima istruzione è una chiamata alla funzione di WordPress register_post_type che prende in input il nome del nuovo custom post type (nel nostro caso news) e l’array degli argomenti creati ai punti precedenti.

A questo punto, accedendo all’area amministrativa di WordPress, saremo già in grado di visualizzare il nuovo menù creato per il nostro nuovo gestore di news supportato dal custom post type news.

Il menu di gestione del nuovo tipo "news"

Clicchiamo su “News” e quindi sul pulsante “Aggiungi Nuova”.

Ci troveremo davanti alla classica schermata di WordPress per l’edit dei post ma saranno visualizzati solo il campo per il Titolo e l’editor TinyMce come dalla seguente figura:

L'edito per il nuovo tipo "news"

Secondo le esigenze del caso, ricordate che questa pagina può essere ulteriormente personalizzata aggiungendo un meta box che contenga dei campi personalizzati. Se già siete familiari con i meta-box vi basterà scrivere:

<?php

add_meta_box(
‘id_univoco’,
‘Titolo Meta Box’,
funzione_per_rendering_html,
‘nome-del-vostro-custom-post-type’ /* nel nostro esempio “news” */
);

?>

Magari l’esempio completo lo potremmo trattare in un futuro post. Se interessati, potete dare un’occhiata a questa pagina http://codex.wordpress.org/Function_Reference/add_meta_box o scrivetelo nei commenti!

Utilizzo nei temi dei custom Type

A questo punto siamo in grado di inserire tutte le news che vogliamo… ma come facciamo a visualizzarle nel nostro sito? Come modificare il tema di WordPress per pubblicare anche le nostre nuove News?

State sintonizzati, questo sarà l’argomento della seconda parte di questo tutorial.

Aggiornamento: la seconda parte, relativa alla modifica del tema WordPress è stata pubblicata.

Questo Guest Post è stato scritto da Alt Design, una web agency specializzata nella realizzazione di siti web basati su WordPress. Potete seguirli nel loro blog dove discutono di Internet Marketing.

(photo credit Riot Jane)

Sono ben felice quindi di annunciarvi che quindi ci sono ancora diversi “posti” disponibili: se ancora non vi siete prenotati è il momento di farlo: anche i 50 posti rischiano di finire in fretta!

Registrati subito al primo seminario di WordPress da Zero alla voce Installare WordPress.

Di cosa parleremo domani?

Come promesso vi spiegherò, così come spiego ai miei clienti,

• quali sono le varie strade per scegliere l’hosting per WordPress,
• registrare un dominio
• installare WordPress.
• Prima di terminare poi vedremo le configurazioni di base da cui partire.

Rispondo ad alcune delle domande che mi avete fatto via email:

• per partecipare basterà collegarsi all’indirizzo che vi invierò per email domani mattina: non serve nulla di particolare, basta che possiate sentire l’audio
• potete collegarvi con Windows, Mac, Linux, non c’è problema!
• se arrivate in ritardo collegatevi ugualmente
• L’idea di prendere appunti durante il seminario è ottima. Io comunque vi invierò al termine una dispensina con tutti i link citati, i punti essenziali e così via. Sto valutando se fare lo stesso con l’evento registrato.

Un ringarziamento speciale a tutti quanti si sono già prenotati… se tu non l’hai ancora fatto… cosa aspetti? Prenotati!

A domani gente!

Aggiornamento (23 maggio 2011): WordPress da Zero è ora un video corso completo. Clicca qui per saperne di più e iscriverti.

Dal prossimo venerdì 29 maggio, per 4 venerdì consecutivi, terrò 4 videoconferenze online (dette anche webinar) che ho intitolato WordPress da Zero pensate per chi vuole iniziare con WordPress ma è spiazzato dai termini tecnici, dalle astrusità online, e (a volte) dalle risposte sbrigative dei più esperti che liquidano tutto con un “ma dai che WordPress è facilissimo!“.

Si tratta di incontri rivolti quindi a chi vorrebbe farsi un blog ma non sa da dove iniziare a metà via tra il formativo e il divulgativo. Non sarà infatti un corso vero e proprio (che ci sarà in futuro, se tutto va bene ), piuttosto una carrellata di suggerimenti e indicazioni pratiche che nascono dalla mia esperienza pluriennale con WordPress, i blog, i blogger…

Per garantire una buona interazione potranno partecipare solo 20 persone per ogni seminario (vista l’ottima risposta sto cercando di allargare la possibilità di partecipare ad almeno 50 persone), per cui è necessario registrarsi alla pagina dedicata a WordPress da Zero

Ecco di cosa vi parlerò:

1. Come registrare un dominio, scegliere l’hosting giusto, installare e configurare WordPress.

Quando: venerdì 29 maggio ’09, ore 13:30 – 14:30 – Registrati Subito →

2. Usare WordPress: tutte le opzioni di WordPress per scrivere post e gestire i commenti.

Quando: venerdì 5 giugno ’09, ore 13:30 – 14:30 – Registrati Subito →

Prenotazione non ancora disponibile

3. Come usare i temi, i widget e le pagine per personalizzare WordPress.

Quando: venerdì 12 giugno ’09, ore 13:30 – 14:30 – Registrati Subito →

Prenotazione non ancora disponibile

4. Quali sono i plugin indispensabili per estendere le funzioni di WordPress e come installarli.

Quando: venerdì 19 giugno ’09, ore 13:30 – 14:30 – Registrati Subito →

Prenotazione non ancora disponibile

Magari sei un lettore di lunga data di WordPressMania, e questi 4 seminari di base non ti interessano, ma sono sicuro che conosci qualcuno a cui potrebbero essere utili.

Dammi una mano a spargere la voce, puoi Re-Twittare questo post oppure condividerlo con uno dei pulsanti qui sotto, o semplicemente segnalare ai tuoi amici l’indirizzo http://www.wpmania.it/corso-wp-da-zero