Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. Theme Development
Code

Sviluppare il tuo primo tema WordPress: Giorno 1 di 3

by
Difficulty:IntermediateLength:LongLanguages:
This post is part of a series called Developing Your First WordPress Theme.
Developing Your First WordPress Theme: Day 2 of 3

Italian (Italiano) translation by Margherita Caggiari Piu (you can also view the original English article)

I temi sono una parte enorme di ciò che rende così popolare  WordPress, e in questa serie di tre articoli vi accompagneremo  passo dopo passo attraverso un processo graduale che si tradurrà nel completo un funzionante tema WordPress. Non è richiesta nessuna precedente conoscienza, questo è il posto perfetto per iniziare se siete completamente nuovi a WordPress!

Temi WordPress

Benvenuti alla prima puntata di questa serie in tre parti su come iniziare a sviluppare temi per WordPress. I temi sono una delle cose migliori di WordPress ed è facilite trovarli, installarli e modificarli è uno dei fattori che ha contribuito che WordPress diventasse il gigante che è oggi - oltre 20 milioni di Blog sono ospitati sul solo WordPress.com.

Di milioni di persone che utilizzano WordPress, è probabile che una grande maggioranza di tali utenti non sanno come per produrre un modello di sito Web, per non parlare di creare un tema WordPress. È anche abbastanza probabile che molti utenti di WordPress non hanno familiarità con termini come 'FTP' o 'Caricamento'. Grazie al motore di ricerca integrato del tema e tema installer, gli utenti non devono conoscere i dettagli tecnici o gli aspetti del funzionamento dei temi o anche come caricarli sul loro hosting.

Questo aspetto di facilità d'uso di temi rendono WordPress la robusta piattaforma di blogging che è, potenziando non solo Blog personali e diari, ma alcuni dei più grandi tecnologici e nuovi blog su internet di oggi. Ci sono anche interi mercati che si basano su temi di WordPress, ad esempio ThemeForest, dove gli autori fanno milioni di dollari ogni anno.

Così abbiamo stabilito che i temi sono importanti, ma probabilmente tutto questo lo sapete già. Se state leggendo, poi è ovvio che si desidera saltare a bordo e iniziare a creare i propri temi per uso personale, per condividerli con gli altri, o per venderli su un marketplace o simili. Affinché il tema abbia impatto o divenga popolare , è importante capire il make-up di un buon tema.


Cosa rende buono un tema?

Un tema di WordPress è facile da mettere insieme, ma un buon tema richiede pianificazione, preparazione e molta fatica. Molte persone fanno una buona vita dalla vendita di temi WordPress perché sanno ciò che rende un buon tema e sanno come mettere quella conoscenza in pratica - un talento che  speriamo di acquisire.

Questa serie di articoli si concentra sul prendere di un preesistente HTML/CSS design e convertirlo in un vivo , respirante WordPress theme. Ovviamente questo significa che è necessario avere un design che potete convertire, ma non preoccupatevi se non ne avete uno in quanto provvederemo a fornirvene uno semplice nella seconda parte pratica.

Poiché andrete a progettare i temi senza il nostro aiuto, diamo un'occhiata ad alcune delle cose che distinguono i migliori temi venduti dal tema omaggio standard che lascia il tempo che trova.

Disegno complessivo

Questo punto è un po' difficile da descrivere, ma un tema ha bisogno di essere ben progettato attraverso gli standard del design moderno. Quello che voglio dire con questo è che è importante conoscere le tendenze e le aspettative di un moderno web design. Oggi, la sostituzione dei font, gradient CSS3, box trasparenti e 'noisy background' sono la moda online, ma 10 anni fa era ancora all'ordine del giorno avere il cursore trails, gif animate e testo in fiamme...

Quanti di voi hanno appena rabbrividito ? Naturalmente, tutti questi trucchi e tendenze sono oltre la portata di questa serie e spetta a voi decidere sull'attrattiva di un design. È sempre una buona idea avere il feedback della comunità da siti come Dribbble o Forrst in quanto sono sede di molti rinomati theme designers e sviluppatori.

Supporto widget

Qualcosa di comune a tutti i temi più popolari è il loro supporto per i widget. Per coloro che hanno vissuto sotto una roccia per tutti questi anni ; I widget sono piccoli , componenti aggiuntivi personalizzabili che spesso vengono visualizzati nella barra laterale o a piè di pagina di un tema . I widget sono un'altra grande opzione di estendibilità di WordPress che contribuiscono a renderlo così popolare.

Molti temi vengono personalizzati con widget costruiti specificamente per quel tema, WordPress viene inoltre fornito con un set di  in-built widget standard come un calendario, un box di ricerca o archivi. Attraverso il dashboard è possibile personalizzare in quale ordine i widget sono visualizzati e anche in quale area ( barra laterale , piè di pagina o in qualsiasi altro posto) appaiono.

I widget sono grandi perché offrono agli utenti un ottimo modo per aggiungere funzionalità a un tema senza dover toccare una riga di codice. I Widgets (per lo più) utilizzano le classi CSS standardizzate, significa che non dovete prepararne per ogni singolo widget che fate, ma basta fornire alcune semplici regole da seguire per tutti.

Commenti e Trackback supporto

Uno degli errori più comuni che vedo fare a molti dei nuovi sviluppatori WordPress è dimenticare il trackbacks, e non supportare propriamente il sistema di commento. Anche se non tutti i blog utilizzano il trackbacks, è importante rendersi conto che potrebbe essere un insucesso per molti blog che visualizzano trackbacks.

Per chi non conosce o non è interamente consapevole di cosa sono i trackbacks ; sono un ottimo modo per costruire link in entrata e far parte della rete con altri blogger. Ma sono diversi dai commenti.

Una nuova idea degli sviluppatori riguardo la trackback potrebbe semplicemente mostrare insieme trackbacks misti ai commenti - qualcosa che dovrebbe essere evitato per non causare disordine nei commenti Un utente leggendo i commenti ad un post per trovare quello che cerca deve scorrere tra un mix di ping, trackback e commenti ed è facile prevedere questo tipo di comportamento

Da WordPress 2.7, i commenti nidificati sono stati una funzione fondamentale. I commenti nidificati consentono agli utenti di rispondere non solo al post o a una pagina, ma anche di rispondere a un commento, molto simile ai siti Tuts + (come mostrato sopra). I commenti nidificati sono un piccolo trucco da implementare come la maggior parte di altre funzionalità, ma sono una fantastica funzionalità  che quando è fatta correttamente può essere in grado di migliorare notevolmente il valore di un tema in quanto i commenti annidati promuovono il comment activity  - cosa favorita molto dai blogger.

Gravatars

Riconosciuta a livello mondiale gli avatar sono una grande funzionalità da aggiungere a qualsiasi tema, sono sicuro che probabilmente tutti li conoscete , ma per chi non ha familiarità con il termine; un gravatar è un avatar associato con il tuo indirizzo email - così ogni volta che si commenta su un blog si vede l'avatar da voi settato .

i gravatars sono molto facili da implementare, fintanto che sono correttamente collocati nel vostro design (non come un ripensamento). Anche se alcuni temi funzionano meglio senza, generalmente i gravatars offrono agli utenti un rapporto più stretto con un blog ed aggiungono un po' di personalità ai commenti.

Featured Posts and Avatars

Se andate su un marketplace noto come ThemeForest e sfogliate i temi più popolari della settimana, si noterà che quasi tutti hanno all'interno qualche forma di post avatar . Diamo un'occhiata a uno dei temi più popolari disponibili su ThemeForest — Striking:

Ogni post ha un'immagine con settata la larghezza e l'altezza che agisce come un avatar. Includendo un post avatar, le immagini aiutano spezzare  il testo e a dare alla pagina un buon flusso. Naturalmente gli avatar non devono essere così, qui c'è un modo diverso di visualizzare avatar sui post utilizzati sul nostro sito sorella Nettuts+ :

Un' altra via per visualizzare i post è quella di utilizzare una sezione di post. Generalmente questi sono più comuni nei temi stile magazine (noi non lo useremo nel nostro tema personale) ma da al tema un grande valore aggiunto di funzionalità. Ecco un esempio da un tema popolare:

Come potete vedere, nella parte superiore del tema abbiamo una grande immagine con sovrapposto un titolo e un brano o la descrizione del post/pagina a cui porta . I post consigliati possono essere i post più popolari del mese, o solo i post più recenti. Essi sono spesso un po' invadenti per i Blog personali, quindi è buono offrirli come un'opzione piuttosto che una parte obbligatoria del design. Più  è personalizzabile un tema, maggiore è la probabilità di diventare popolare.

Custom Post Types

Naturalmente, non tutto ciò che viene pubblicato su un blog è solo un post di blog. I blogger potrebbero anche semplicemente voler condividere una qualche forma di media, ad esempio un vimeo, YouTube video o audio. Un fantastico esempio di questo tipo di integrazione è un recente tema chiamato Gridlocked

Gridlocked utilizza un custom post type (in questo caso il post type è un Vimeo post ) che incorpora un vimeo nel tema splendidamente. Alcune delle altre opzioni che il tema supporta sono i video di YouTube, un lettore audio e post avatar. Tutti questi tipi (utilizzando il loro rispettivo custom post type) appaiono belli a tutta larghezza senza margini o spazi sul top del layout.

I post personalizzati sono sia efficaci che facili da implementare, il blogger specifica semplicemente un pezzo di meta informazioni, il tema prende queste informazioni e decide quale codice deve visualizzare.


I componenti di un tema

Sono sicuro che probabilmente siete a conoscenza di come, i temi sono costituiti da molti file differenti, ognuno dei quali svolge la loro rispettiva parte alla visualizzazione o la funzionalità di un tema . Diamo un'occhiata ad alcuni dei più comuni file che WordPress riconosce di default con cui avremo a che fare. La maggior parte dei file si spiega con il loro solo nome:

header.php

Di solito questo file contiene il nostro tema fino a < / head> , che svolge anche la sede della funzione wp_head ( ) , che è uno dei ganci più essenziali in WordPress.

sidebar.php

Un file opzionale chiamato mediante l'uso di get_sidebar, è possibile utilizzare questo file per una sidebar, navigazione o qualcosa di similare. questo è anche dove comunemente si trova il codice che permette l'esecuzione dei widget, se il vostro tema lo consente

footer.php

Una parte facile da indovinare, questa è dove il tema si conclude ed anche dove potete registrare una seconda area per visualizzare i widget Naturalmente è possibile visualizzare i widget ovunque si voglia, ma la barra laterale e il piè di pagina sono i più comuni.

page.php

Utilizzato per visualizzare una singola pagina - non deve essere confuso con un post.

single.php

Il file post, utilizzato per visualizzare un singolo blog post  molto simile a page.php nel codice.

index.php

Come potrete intuire, index svolge il lavoro per un blog; visualizzare i messaggi, risultati di ricerca, notificare i messaggi di errore e così via.

functions.php

Il file di funzioni può essere nuovo per voi. Questo è dove vengono immagazzinate le specifiche funzioni del tema - più comunemente le funzioni di registrare aree widget ready.

comments.php

Consente di visualizzare un ciclo simile a index. php che scorre attraverso i commenti. Qui è anche dove si trovano trackback, commenti nidificati ed altre funzionalità connesse.

Un tema può utilizzare  molti o pochi file di tema a seconda di ciò che si desidera, ma questi sono i file più comuni per quasi ogni tema. La struttura del file di tema è essenzialmente decisa dallo sviluppatore  - per esempio ci potrebbe essere un file vimeo.php, youtube.php e audio.php che visualizzano i loro rispettivi  post types piuttosto che avere tutto il codice impacchettato in una  page. php o single. php.


Rendere il vostro tema personalizzabile con una pagina di opzioni

Una pagina di opzioni che permette la facile personalizzazione di un tema può essere un buon esecutore. Una stragrande maggioranza dei temi popolari hanno una sorta di pannello di opzioni che allevia da qualsiasi necessità per i blogger di dover modificare alcun codice o file grafico. Questo è un ottimo punto per la vendita, dato che non tutti i blogger che utilizzeranno il vostro nuovo tema sapranno che #000000 significa nero.

La pagina delle opzioni potrà essere un semplice layout di una pagina con alcune caselle di controllo, aree di testo e cursori, o potrà essere un pannello di amministrazione intero all'interno della dashboard con più pagine per controllare diversi elementi di un tema. In genere, la pagina delle opzioni consente la personalizzazione di elementi come:

  • Schema di colori
  • Logo (testo o immagine)
  • Favicon
  • Dettagli per i flussi dei social media (ad esempio nome utente Twitter)
  • Varie opzioni di stile
  • Molti altri

È Impossibile elencare tutte le opzioni, dato che ogni tema è diverso dall'altro e richiede differenti opzioni extra. Un piccolo tema personale può non richiedere una pagina di opzioni in piena regola,però è importante ricordare che la maggioranza dei blogger non sono esperti di tecnologia.


La settimana prossima

La settimana prossima saltaremo direttamente alla redazione del nostro codice per iniziare a lavorare su un tema base di WordPress personale. Vi invitiamo - prendete coraggio - ad utilizzare il layout che desiderate convertire in un tema di WordPress, ma non preoccupatevi se non ne avete uno, perchè ve ne verrà fornito uno con un layout semplice.

I prerequisiti per la prossima settimana sarà una conoscenza di HTML di base, alcune conoscenze di base PHP e - preferibilmente - una comprensione dei CSS. Non dovrete conoscere nulla dei temi WordPress perchè cominceremo da zero!

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.