Approfondimento Tecnico — Tema Child WordPress

Panoramica tenica del progetto WordPress basato su un tema child creato da zero. Il lavoro è focalizzato su override dei template, layout personalizzati e funzioni PHP semplici, per mostrare un flusso di sviluppo reale senza plugin superflui. Il progetto è in evvoluzione e verrà ampliato con nuove funzionalità.

Obiettivo tecnico del progetto

Questa demo nasxce con l’obiettivo di mostrare come lavoro su WordPress quando serve intervenire direttamente sul codice. Ho creato un tema child basato su Twenty Twenty-Five e ho sovrascritto i principali template per avere un controllo completo su layout, contenuto e struttura.

Il risultato è un ambiente semplice, ma utile per vedere:
come organizo il codice, come gestisco gli override e come imposto blocchi e sezioni personalizzate.

Struttura del tema child

La struttura del tema child è volutamente essenziale, per rendere chiaro quali file controllano cosa. La cartella contiene principalmente:

L’obiettivo è avere un set minimo di file che permetta di controllare l’intero comportamento del sito, senza toccare il tema originale.

Overrride della home (front-page.php)

La home è stata completamente sostituita con un file personalizzato. Qui imposto il contenitore, i blocchi informativi e la lista degli articoli in formato card.

<main class="container-simone">
  <h1>HOME OVERRIDE — CHILD THEME</h1>

  <div class="box-info">
    La home è generata da un file personalizzato.
  </div>

  <p>Questa sezione mostra il layout creato tramite il tema child.</p>

  <?php get_template_part('template-parts/card-articoli'); ?>
</main>

La strttura è pensata per essere ampliata con ulteriori sezioni o componenti personalizzati.

Override degli articoli (single.php)

Anche il template dei singoli articoli è stato riscritto per avere un layout pulito, leggibile e centrato. Sono presenti un box introduttivo, il contenuto dell’articolo e la sezione “Altri articoli” in formato card.

<main class="container-simone">

  <div class="box-info">
    <strong><?php the_title(); ?></strong><br>
    Pubblicato il: <?php the_date(); ?>
  </div>

  <article>
    <?php the_content(); ?>
  </article>

  <?php get_template_part('template-parts/card-articoli'); ?>

</main>

CSS personalizzato del tema child

Gli stili sono semplici e gestiscono il contenitore, i box e le cards. Lo scopo è mantenere il layout ordinato e distinguibile dai template originali.,

.container-simone {
  max-width: 900px;
  margin: 40px auto;
  background: #fff;
  padding: 40px;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}

.box-info {
  background: #fff3cd;
  padding: 18px;
  border-left: 5px solid #ffca2c;
  border-radius: 6px;
}

Sezione “Altri articoli” — generazione card

La sezione finale mostra tre articoli recventi in formato card. Lo scopo è dare continuità alla navigazione e mostrare come gestisco query personalizzate in WordPress.

$query = new WP_Query([
  'post_type' => 'post',
  'posts_per_page' => 3,
  'post__not_in' => [get_the_ID()],
]);

while ($query->have_posts()) {
  $query->the_post(); ?>

  <div class="card-articolo">
    <h3><?php the_title(); ?></h3>
    <p><?php echo wp_trim_words(get_the_excerpt(), 18); ?></p>
    <a href="<?php the_permalink(); ?>">→ Leggi tutto</a>
  </div>

<?php }
wp_reset_postdata();

Evoluzioni tecniche previste

Il progetto è pensato per essere ampliato in modo molto graduale, aggiungendo piccole funzionalità utili dal punto di vista dello sviluppo WordPress.

← Torna alla pagina del progetto