Guida introduttiva allo sviluppo di temi WordPress: crea la tua prima opera partendo da zero.

Leggere in 2 minuti.
2026-03-14
2026-06-06
2,019
Guadagno delle commissioni quando fai acquisti tramite i link qui sotto, senza alcun costo aggiuntivo per te.

Configurazione dell’ambiente di sviluppo e nozioni di base

Il primo passo nell’ambito dello sviluppo di temi per WordPress è preparare un ambiente di sviluppo locale adatto. Questo non solo migliora l’efficienza dello sviluppo, ma facilita anche i test e la debug. Si consiglia l’utilizzo di ambienti integrati come XAMPP, MAMP o Local by Flywheel, che permettono di installare in un solo clic PHP, il database MySQL nonché i server Apache/Nginx, evitando così la necessità di configurazioni manuali complesse. Per quanto riguarda gli editor, Visual Studio Code, PhpStorm o Sublime Text rappresentano scelte eccellenti: forniscono un’eccellente evidenziazione del codice e suggerimenti per PHP, HTML, CSS e JavaScript.

Oltre all’ambiente in cui WordPress viene utilizzato, è fondamentale comprendere la struttura di base dei temi di WordPress. Un tema minimale richiede almeno due file principali:style.cssindex.php。任何WordPress主题都位于/wp-content/themes/Sono presenti all’interno del catalogo e vengono distinti dal nome della rispettiva cartella (che funge da identificatore del tema).

Definizione della parte superiore delle informazioni sull’argomento

Le informazioni sul tema vengono trasmesse tramite… style.css Le annotazioni presenti nella parte iniziale del file vengono utilizzate per dichiarare i dati relativi al tema. Questo blocco rappresenta, in sostanza, il “cartellino d’identità” del tema: il core di WordPress lo legge per riconoscere il nome del tema, l’autore, la versione e altri metadati. Ecco un esempio tipico di informazioni presenti nella parte iniziale del file:

Si consiglia di leggere Comprendere a fondo lo sviluppo dei plug-in di WordPress: da zero alla creazione di estensioni professionali

/*
Theme Name: 我的第一个主题
Theme URI: https://example.com/my-first-theme
Author: 你的名字
Author URI: https://example.com
Description: 这是一个用于学习WordPress主题开发的入门主题。
Version: 1.0.0
License: GPL v2 or later
Text Domain: my-first-theme
*/

Tra questi,Text DomainUtilizzato per l’internazionalizzazione (i18n) e per l’utilizzo successivo di funzioni di traduzione (come…)__()_e()L’identificatore che deve essere specificato quando si utilizza…index.phpSi tratta del file di template di ingresso predefinito per il tema; anche in assenza di altri file di template, WordPress lo utilizzerà per renderizzare la pagina.

UltaHost – Hosting per siti WordPress
Garanzia di rimborso entro 30 giorni, larghezza di banda illimitata e accesso ai database, protezione gratuita contro gli attacchi DDoS; sconto del 50% per l’acquisto di un piano valido per 3 anni (da 3 a 4 TB di spazio di archiviazione).

Struttura del file del modello principale

Un tema WordPress completo segue un insieme di regole chiamato “struttura gerarchica dei template” (template hierarchy). Queste regole determinano quale file di template WordPress utilizzerà automaticamente per visualizzare il contenuto in base al tipo di richiesta ricevuta dal sito. Comprendere questa struttura gerarchica è fondamentale per sviluppare temi flessibili e personalizzabili.

File di ingressoindex.phpSi trova all’ultimo livello della gerarchia dei template e funge da riserva predefinita per tutte le pagine. Tuttavia, nello sviluppo effettivo creiamo template più specifici per offrire una visualizzazione personalizzata. Ad esempio, quando si accede a un articolo singolo, WordPress cerca innanzitutto i dati relativi a quel template specifico.single-post.phpSe non esiste, effettua la ricerca.single.php…e solo alla fine si torna indietro.index.php

File di template comuni e il loro utilizzo

* header.phpTemplate per la parte superiore del sito web, che di solito include:<!DOCTYPE html>Dichiarazione,<head>Le aree pubbliche, nonché la parte superiore del sito web (come il logo e il menu principale). Da utilizzare in altri template.get_header()Introduzione alle funzioni.
* footer.phpTemplate posizionato in fondo al sito web, che contiene informazioni sul copyright, ecc. Da utilizzare.get_footer()Introduzione alle funzioni.
* sidebar.phpTemplate per la barra laterale. Utilizzalo.get_sidebar()Introduzione alle funzioni.
* functions.phpQuesto file contiene le funzioni utilizzate per configurare le caratteristiche di un tema. Non si tratta di un file di template, ma viene caricato automaticamente durante l’inizializzazione del tema stesso. Viene utilizzato per aggiungere funzionalità specifiche al tema, registrare menu e barre laterali, nonché per importare stili grafici e script necessari per il funzionamento corretto del tema.
* page.phpUtilizzato per visualizzare pagine statiche.
* single.phpUtilizzato per visualizzare un singolo articolo.
* archive.phpUtilizzato per visualizzare elenchi di archivi contenenti informazioni su categorie, tag, autori, date, ecc.
* front-page.phpUtilizzato per personalizzare la pagina iniziale del sito web (è necessario configurarlo nella sezione “Impostazioni” > “Letture” dell’interfaccia di amministrazione di WordPress).
* style.cssOltre a definire le informazioni relative al tema, rappresenta anche lo stile principale (il “stylesheet”) di quel tema.

Grazie a questa struttura modulare, gli sviluppatori possono facilmente riutilizzare le parti comuni (come il header e il footer) e realizzare design diversificati per i vari tipi di pagine.

Si consiglia di leggere Guida alla creazione di siti web professionali: dalla creazione di un sito web da zero allo sviluppo di un portale Internet efficiente e scalabile.

Funzioni.php e miglioramenti alle funzionalità del tema

functions.phpI file rappresentano il “cervello” di un tema: attraverso di essi è possibile estendere o modificare le funzionalità di base di WordPress, senza dover modificare direttamente i file principali del software. Il loro vero potere risiede nella possibilità di utilizzare l’ampia gamma di strumenti e risorse offerte da WordPress stesso.Action(Azione) eFilter(Filtro) Ganci utilizzati per intervenire nel flusso di esecuzione del programma.

Funzionalità supportate dall’iscrizione a un argomento (topic):

functions.phpNel codice sorgente del tema, è possibile specificare quali funzionalità integrate di WordPress il tema supporta. Ad esempio, abilitare la visualizzazione di immagini di rilievo per gli articoli, la creazione di menu personalizzati e l’utilizzo di un logo personalizzato rappresenta una configurazione di base per i temi moderni. Questo può essere realizzato aggiungendo opportuni codici nelle parti pertinenti del file sorgente del tema.add_theme_support()Implementazione della funzione:

function my_theme_setup() {
    // 添加对文章特色图像(缩略图)的支持
    add_theme_support('post-thumbnails');

// 注册导航菜单位置
    register_nav_menus(array(
        'primary' => __('主导航菜单', 'my-first-theme'),
        'footer'  => __('底部菜单', 'my-first-theme'),
    ));

// 添加对自定义Logo的支持
    add_theme_support('custom-logo', array(
        'height'      => 100,
        'width'       => 400,
        'flex-height' => true,
        'flex-width'  => true,
    ));
}
add_action('after_setup_theme', 'my_theme_setup');

Nel codice sopra menzionato,my_theme_setupSi tratta di una funzione personalizzata; la utilizziamo attraverso…add_action()Montarlo su…after_setup_themeAssicurati che questo “action hook” venga eseguito durante l’inizializzazione del tema.

hosting.com Hosting condiviso
Prestazioni elevate con CPU AMD EPYC, storage SSD NVMe e LiteSpeed, supporto interno di esperti 24 ore su 24, 7 giorni su 7, misure di sicurezza avanzate, tra cui SSL, brute force, malware e protezione DDoS, risparmi fino a 73%

Importare file di stili e script

Il modo corretto per introdurre i componenti necessari è fondamentale per garantire la manutenibilità e le prestazioni dei risorse front-end. Dovresti utilizzare…wp_enqueue_style()wp_enqueue_script()Funzione, e montarla…wp_enqueue_scriptsQuesto meccanismo consente a WordPress di gestire le dipendenze tra i componenti del sito, evitando il caricamento ripetuto di file e facilitando l’intervento da parte degli plugin.

function my_theme_scripts() {
    // 引入主样式表
    wp_enqueue_style('my-theme-style', get_stylesheet_uri());

// 引入自定义JavaScript文件
    wp_enqueue_script('my-theme-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '1.0.0', true);
}
add_action('wp_enqueue_scripts', 'my_theme_scripts');

Template tags and the loop system

I tag dei template sono strumenti essenziali nello sviluppo di temi per WordPress: in sostanza, si tratta di funzioni PHP utilizzate per generare dinamicamente contenuti all’interno dei file di template (come titoli di articoli, testi, autori, date, ecc.). Questi tag semplificano notevolmente la visualizzazione dei dati presenti nel database sulle pagine web.

Principio di funzionamento del ciclo principale

WordPress utilizza dei “cicli” (loop) per estrarre i contenuti dal database. La sua struttura di base prevede l’utilizzo di tali cicli per iterare attraverso i dati presenti nel database e visualizzarli correttamente sul sito web.ifLa frase è racchiusa in un contenitore (ad esempio, un tag HTML, un paragrafo, ecc.).whileCiclo:

Si consiglia di leggere Comprendere gli hook personalizzati di WooCommerce: una guida completa dall'introduzione all'applicazione avanzata.

<!-- 在这里使用模板标签输出单篇文章内容 -->
        <h2><p><strong>Questo testo verrà sostituito dal titolo dell'articolo corrente.</strong></p></h2>
        <div><p><strong>Questo testo è stato tradotto automaticamente. Se desideri una traduzione corretta, contattaci.</strong></p></div>

have_posts()La funzione verifica se la query attuale contiene articoli. Se sì, prosegue.whileCiclothe_post()La funzione è responsabile dell’impostazione delle variabili e dei dati globali, al fine di rendere disponibili tali informazioni per le etichette dei template successivi (come…)the_title()the_content()È in grado di visualizzare correttamente le informazioni relative all’articolo attuale.

Tag di output di contenuto più comuni utilizzati

* the_title()Titolo dell’articolo/pagina.
* the_content(): 输出文章/页面完整内容,包含<!--more-->Etichette e paginazione.
* the_excerpt()Riassunto dell’articolo:
* the_permalink()L’indirizzo URL permanente di un articolo o di una pagina viene spesso utilizzato per:<a>“Tag-based”hrefNelle proprietà.
* the_post_thumbnail()Mostra le immagini caratteristiche dell’articolo.
* the_author()the_date()the_category()Etc.: Esegue l’output dei metadati correlati.

Hosting condiviso InterServer
Hosting condiviso $2,50 USD al mese, primo mese $0,1 USD codice promozionale tryinterserver, 461 script di applicazioni cloud, installazione con un clic.

Oltre ai tag utilizzati per l’output del contenuto, esiste anche un tipo di tag utilizzati per i confronti logici (condizionali), ad esempio:is_single()is_page()is_home()is_front_page()Questi elementi permettono di eseguire logiche diverse all’interno dei file di template in base al tipo di pagina attuale.

Riassumendo

Lo sviluppo di temi per WordPress è un processo che combina creatività, design e tecnologie web. Inizia dalla creazione di un ambiente locale e dalla comprensione della struttura minima dei file, per poi approfondire gradualmente le conoscenze sui livelli dei template e sull’utilizzo delle funzionalità disponibili nel sistema.functions.phpPotenziare le funzionalità di un tema e utilizzare abilmente i tag delle template insieme ai cicli per visualizzare i contenuti in modo dinamico rappresenta una pratica fondamentale. Seguendo il principio di “dall’esterno all’interno”, si inizia costruendo gli elementi strutturali principali del sito (testata, piede di pagina, barra laterale, ecc.) per poi riempirli con il contenuto specifico di ciascuna pagina. Questo approccio consente uno sviluppo più efficiente. Ricorda che la pratica è il miglior maestro: creare personalmente un tema il più semplice possibile e continuare a migliorarlo rappresenta il modo più veloce per acquisire queste competenze.

FAQ - Domande frequenti

Quali sono le conoscenze preliminari necessarie per imparare a sviluppare temi per WordPress?

Ti consigliamo di possedere conoscenze di base di HTML e CSS, necessarie per costruire e migliorare la struttura delle pagine web. Inoltre, è importante conoscere la grammatica di base di PHP, poiché la logica principale dei temi di WordPress, nonché i tag utilizzati per le template, sono scritti in PHP. Una conoscenza preliminare di JavaScript sarà utile per aggiungere funzionalità interattive in seguito.

Perché il mio tema non viene visualizzato o non può essere attivato nel backend?

La causa più comune è…style.cssIl formato delle note nella parte iniziale del file che contiene le informazioni sul tema non è corretto, il contenuto è incompleto, oppure il file stesso non esiste. Per favore, controlla attentamente il blocco di note in cima al file per assicurarti che tutte le informazioni siano inserite correttamente, in particolare il “Nome del Tema” (Theme Name). Inoltre, assicurati che la cartella contenente i tuoi temi sia posizionata direttamente nella posizione prevista./wp-content/themes/Deve trovarsi all’interno del catalogo, e non essere inserito in un altro folder.

Quali conseguenze possono derivare da un errore nel file Functions.php?

functions.phpGli errori di sintassi o gli errori fatali presenti nei file del sito web possono causare la visualizzazione di una “schermata bianca” (una pagina che indica un errore grave) sul lato frontale del sito, oppure l’apparizione di un messaggio che indica che il tema utilizzato è danneggiato sulla pagina di gestione dei temi. In questi casi, WordPress passa automaticamente al tema predefinito per garantire che il sito sia comunque accessibile. È necessario correggere tali errori utilizzando FTP o un gestore di file.functions.phpGli errori presenti nel testo…

Come posso rendere il mio tema compatibile con più lingue (internazionalizzazione)?

WordPress utilizza il framework GNU gettext per l’internazionalizzazione. È necessario…style.cssLa testa efunctions.phpimpostazioni corretteText DomainPoi, utilizzare la funzione di traduzione in tutti i punti del testo che necessitano di essere tradotti.__('文本', 'my-theme-textdomain')_e('文本', 'my-theme-textdomain')Successivamente, è possibile utilizzare strumenti come Poedit per generare il contenuto desiderato..potFile di template, utilizzati dai traduttori per creare i contenuti da tradurre..po.moFile da tradurre.

Cosa sono i sottotemi (subtopics)? Perché dovrei crearne?

I sottotemi (subtopics) ereditano tutte le funzionalità e gli stili di un altro tema (tema principale, o “tema padre”). Quando si desidera modificare un tema esistente (soprattutto uno fornito da terze parti) mantenendo comunque la possibilità di ricevere futuri aggiornamenti di sicurezza, è necessario creare un sottotema. Un sottotema contiene soltanto…style.cssInsieme a eventuali file di template personalizzati, quando il tema principale viene aggiornato, le modifiche che hai apportato tu (nel tema figlio) non verranno sovrascritte. Questa è una delle migliori pratiche nello sviluppo di temi per WordPress.