Presidenza Club è il Club della Presidenza del Consiglio dei Ministri dedicato alla pubblicazione di convenzioni, agevolazioni e opportunità riservate ai soci. Il progetto ha riguardato la ricostruzione completa del sito esistente attraverso una nuova struttura grafica, tecnica ed editoriale.
Ho realizzato un sito WordPress con area soci progettando da zero tutte le pagine e i template con Elementor. Non ho utilizzato temi commerciali, demo preimpostate o layout importati: ho costruito personalmente homepage, header, footer, archivi, pagine delle categorie, template degli articoli e sezioni dinamiche.
Inoltre, ho sviluppato un sistema di accesso differenziato per amministratori, soci e visitatori. I soci autenticati possono visualizzare sconti e condizioni riservate, mentre gli utenti non collegati vedono soltanto le informazioni pubbliche.
Il progetto comprende anche categorie dinamiche gestite con Advanced Custom Fields, slide generate tramite codice personalizzato, filtri per tag, articoli correlati e template Elementor che permettono al responsabile del sito di pubblicare nuove convenzioni senza ricostruire ogni volta l’impaginazione.
Il Progetto Presidenza Club
- Progetto: Presidenza Club
- Settore: associazione, servizi e convenzioni per i soci
- Tipologia: sito WordPress con area pubblica e contenuti riservati
- Intervento: ricostruzione completa del sito esistente
- Progettazione: pagine e template creati da zero con Elementor
- CMS: WordPress
- Gestione dinamica: Advanced Custom Fields
- Funzionalità: area soci, convenzioni, filtri, categorie dinamiche e template editoriali
- Hosting: trasferimento su server Hostinger
- Dominio: mantenuto presso Aruba e collegato tramite configurazione DNS
- Ottimizzazione: velocità, prestazioni e organizzazione delle risorse
Il sito doveva rispondere a esigenze differenti ma collegate tra loro.
Da una parte, Presidenza Club aveva bisogno di presentare in modo ordinato le convenzioni disponibili. Dall’altra, doveva proteggere sconti e condizioni riservate, mostrando questi contenuti soltanto ai soci autenticati.
Inoltre, il responsabile del progetto doveva poter pubblicare nuovi articoli in autonomia, senza utilizzare Elementor per costruire manualmente ogni pagina.
Per questo motivo, ho progettato il sito come un sistema dinamico nel quale WordPress gestisce contenuti e utenti, mentre Elementor, ACF e il codice personalizzato controllano la presentazione delle pagine.
Ricostruzione Completa del Sito Esistente
Presidenza Club disponeva già di un sito, ma la struttura precedente non rispondeva più alle esigenze del progetto.
Invece di apportare correzioni parziali, abbiamo scelto di eliminare la vecchia impostazione e ricostruire il sito da zero. Il lavoro ha quindi interessato sia la parte grafica sia l’organizzazione tecnica ed editoriale.
Durante la ricostruzione ho ridefinito:
- architettura delle pagine;
- navigazione principale;
- homepage;
- pagina generale delle convenzioni;
- archivi delle categorie;
- pagina del singolo articolo;
- contenuti riservati;
- ruoli degli utenti;
- filtri per le convenzioni;
- template editoriali;
- sezioni degli articoli correlati;
- gestione delle immagini associate alle categorie;
- comportamento responsive.
Di conseguenza, il nuovo sito non rappresenta un semplice restyling. Al contrario, nasce da una nuova progettazione completa costruita intorno al funzionamento reale di Presidenza Club.
Un Progetto Realizzato a Quattro Mani
Ho sviluppato il sito in stretto confronto con il responsabile del progetto dell’associazione.
Il responsabile mi ha indicato come desiderava organizzare le convenzioni, quali informazioni dovevano rimanere riservate e quale percorso dovevano seguire soci e visitatori.
Successivamente, ho trasformato queste indicazioni in una struttura WordPress completa, traducendo le esigenze operative in pagine, categorie, tag, template e funzioni personalizzate.
Il lavoro condiviso ha seguito diverse fasi:
- analisi del sito precedente;
- definizione della nuova struttura;
- organizzazione delle convenzioni;
- distinzione tra contenuti pubblici e riservati;
- progettazione della grafica;
- creazione dei template;
- sviluppo delle funzioni dinamiche;
- verifica dei flussi editoriali;
- controllo dell’area soci;
- ottimizzazione finale.
In questo modo, il sito riflette le esigenze concrete dell’associazione e non una struttura generica adattata successivamente.
Sito WordPress Progettato da Zero con Elementor
Ho utilizzato WordPress come sistema di gestione per utenti, articoli, categorie, tag e convenzioni. Elementor è stato invece lo strumento con cui ho progettato e costruito da zero l’intera interfaccia.
Non ho installato un tema commerciale né importato una demo già pronta. Inoltre, non ho adattato template acquistati o layout preconfezionati.
Ho progettato personalmente:
- header;
- navigazione;
- footer;
- homepage;
- pagina generale delle convenzioni;
- pagine delle categorie;
- hero dinamiche;
- archivi degli articoli;
- template del singolo articolo;
- sezioni degli articoli correlati;
- area di accesso;
- percorsi dedicati ai soci;
- layout responsive.
Elementor non è quindi servito per modificare un sito già pronto. Al contrario, mi ha permesso di realizzare una struttura originale, progettata specificamente per Presidenza Club.
Successivamente, ho integrato Advanced Custom Fields e codice personalizzato per collegare immagini, categorie, slide, filtri e contenuti riservati.
Identità Visiva di Presidenza Club
La grafica doveva mantenere un tono istituzionale, ordinato e facilmente riconoscibile.
Per questo motivo, ho costruito un’interfaccia capace di valorizzare il logo, le categorie e le informazioni dedicate ai soci senza appesantire la navigazione.
L’interfaccia permette agli utenti di riconoscere immediatamente:
- identità del Club;
- menu principale;
- categorie delle convenzioni;
- contenuti disponibili;
- accesso all’area soci;
- articoli e offerte correlate.
Inoltre, la struttura può accogliere nuove categorie e nuove convenzioni senza richiedere ogni volta una modifica completa del layout.
Area Login con Amministratori e Soci
Il sito comprende un sistema di autenticazione con accessi differenziati.
I visitatori possono consultare le parti pubbliche, mentre i soci autenticati accedono agli sconti e alle condizioni riservate. Gli amministratori, invece, gestiscono utenti, contenuti e impostazioni.
Il sistema distingue quindi tre tipologie principali:
- visitatori: visualizzano le informazioni pubbliche;
- soci: consultano sconti, condizioni e contenuti riservati;
- amministratori: gestiscono sito, utenti e pubblicazioni.
Questa separazione consente all’associazione di presentare pubblicamente le proprie attività senza rendere accessibili a chiunque le condizioni dedicate ai soci.
Gestione dei Contenuti Riservati
La gestione dei contenuti riservati rappresenta una delle funzioni principali del progetto.
Quando un visitatore non ha effettuato l’accesso, il sito nasconde gli sconti e le condizioni destinate ai soci. Dopo il login, invece, il sistema mostra automaticamente le informazioni previste.
Ho quindi costruito una logica che modifica la visibilità dei contenuti in base allo stato dell’utente.
Questo sistema permette di:
- proteggere le condizioni delle convenzioni;
- riservare gli sconti ai soci;
- mantenere pubblica la presentazione generale;
- evitare pagine duplicate;
- gestire contenuti pubblici e privati nello stesso articolo;
- indirizzare l’utente verso il login quando necessario.
Di conseguenza, il sito conserva una parte informativa accessibile a tutti ma protegge le informazioni che costituiscono il valore riservato dell’associazione.
Pagina Generale delle Convenzioni
La pagina generale delle convenzioni rappresenta il principale punto di accesso alle categorie disponibili.
Ho progettato questa sezione attraverso slide dinamiche. Ogni slide richiama una categoria, utilizza l’immagine associata e conduce l’utente verso il relativo archivio.
Grazie a questa organizzazione, l’utente può individuare rapidamente l’area di interesse e raggiungere le convenzioni pertinenti.
Inoltre, il responsabile può aggiungere nuove categorie senza ricostruire manualmente la sezione. Il sistema recupera infatti i dati registrati in WordPress e li utilizza nella presentazione.
Advanced Custom Fields per Immagini e Categorie
WordPress gestisce nativamente nomi, descrizioni e archivi delle categorie, ma il progetto richiedeva anche immagini specifiche da utilizzare nelle slide e nelle hero.
Per questo motivo, ho utilizzato Advanced Custom Fields per aggiungere campi personalizzati alle categorie.
ACF permette di associare a ogni categoria:
- immagine rappresentativa;
- immagine della hero;
- contenuti grafici della slide;
- informazioni aggiuntive utilizzate dai template.
Successivamente, il codice personalizzato recupera questi dati e li mostra nelle sezioni corrette.
In questo modo, il responsabile può aggiornare una categoria e la relativa immagine direttamente dal pannello WordPress, senza intervenire su Elementor o sul codice.
Slide Dinamiche Sviluppate con Codice Personalizzato
Ho sviluppato una funzione custom per visualizzare le categorie delle convenzioni sotto forma di slide.
Il sistema recupera automaticamente:
- nome della categoria;
- immagine collegata tramite ACF;
- collegamento alla pagina della categoria;
- eventuali informazioni associate.
Le slide non sono quindi elementi statici creati manualmente uno alla volta.
Al contrario, il sito le genera utilizzando i dati presenti nelle categorie di WordPress. Pertanto, quando il responsabile modifica un’immagine o aggiunge una categoria, la presentazione può aggiornarsi senza ricostruire la pagina.
Pagine Dinamiche delle Categorie
Ogni categoria dispone di una pagina dedicata con una hero personalizzata e l’elenco delle convenzioni associate.
L’immagine della hero proviene dal campo ACF collegato alla categoria. Sotto la parte iniziale, WordPress mostra automaticamente gli articoli appartenenti a quell’area.
La struttura consente quindi di:
- presentare chiaramente la categoria;
- mostrare una hero specifica;
- visualizzare soltanto le convenzioni pertinenti;
- mantenere un layout uniforme;
- aggiungere articoli senza modificare la pagina;
- aggiornare automaticamente l’archivio.
Inoltre, ogni categoria mantiene una propria identità visiva pur restando coerente con il resto del sito.
Filtraggio delle Convenzioni Tramite Tag
All’interno delle categorie, gli utenti possono restringere ulteriormente i risultati attraverso i tag.
Questa funzione risponde a un’esigenza concreta: una categoria può contenere numerose convenzioni, ma gli utenti potrebbero cercare soltanto un argomento specifico.
Il flusso funziona in questo modo:
- l’utente apre una categoria;
- il sito carica gli articoli associati;
- l’utente seleziona un tag;
- il sistema filtra i contenuti;
- la pagina mostra soltanto le convenzioni pertinenti.
Categorie e tag svolgono quindi funzioni differenti.
Le categorie organizzano le grandi aree delle convenzioni, mentre i tag permettono una selezione più precisa all’interno di ciascuna area.
Template Elementor Creati da Zero per gli Articoli
Una parte importante del progetto riguarda la creazione dei template dinamici applicati agli articoli.
Ho progettato personalmente con Elementor la struttura delle pagine dedicate alle convenzioni. Non ho utilizzato template acquistati, kit grafici o layout già disponibili.
Ho costruito il modello partendo dal tipo di contenuti pubblicati dall’associazione e dalle informazioni che il responsabile deve inserire.
Il responsabile si occupa quindi di:
- titolo;
- testo;
- immagine principale;
- fotografie interne;
- categoria;
- tag;
- informazioni della convenzione;
- contenuti riservati.
Il template che ho creato gestisce invece:
- struttura grafica;
- posizione del titolo;
- immagine principale;
- area del contenuto;
- tipografia;
- spaziature;
- contenuti dedicati ai soci;
- articoli correlati;
- adattamento responsive;
- coerenza con le altre pagine.
In questo modo, il responsabile può pubblicare autonomamente nuovi articoli senza aprire Elementor e senza ricostruire ogni volta la pagina.
Pagina del Singolo Articolo
Il template dinamico gestisce automaticamente la pagina del singolo articolo.
La pagina può includere:
- titolo della convenzione;
- immagine principale;
- testo descrittivo;
- informazioni pubbliche;
- condizioni riservate ai soci;
- categoria;
- tag;
- articoli correlati.
Quando un socio effettua il login, la pagina mostra anche gli sconti e le condizioni riservate.
Il visitatore non autenticato, invece, visualizza soltanto la parte pubblica e l’eventuale invito ad accedere.
Articoli Correlati
Ho progettato anche una sezione dinamica dedicata agli articoli correlati.
Questa funzione permette all’utente di continuare la navigazione senza tornare alla pagina generale delle convenzioni.
Gli articoli correlati aiutano a:
- scoprire altre convenzioni;
- consultare contenuti della stessa categoria;
- raggiungere argomenti simili;
- ridurre i passaggi di navigazione;
- collegare tra loro i contenuti del sito.
Inoltre, la sezione utilizza lo stesso stile grafico del template e si aggiorna in base agli articoli disponibili.
Una Struttura Creata per Rendere Autonomo il Responsabile
Uno degli obiettivi principali era permettere al responsabile di pubblicare nuove convenzioni senza intervenire sulla grafica.
Per raggiungere questo risultato, ho separato il lavoro editoriale dalla progettazione delle pagine.
Io ho costruito struttura, archivi e template dinamici. Il responsabile deve invece inserire soltanto i contenuti necessari.
Il flusso editoriale prevede:
- creazione del nuovo articolo;
- inserimento del titolo;
- aggiunta di testo e immagini;
- assegnazione della categoria;
- selezione dei tag;
- inserimento dei contenuti riservati;
- pubblicazione.
Dopo la pubblicazione, il sistema applica automaticamente il template che ho progettato con Elementor.
Inoltre, l’articolo compare:
- nell’archivio della categoria corretta;
- nei risultati associati ai tag;
- nella pagina della convenzione con il layout prestabilito;
- nelle eventuali sezioni degli articoli correlati.
Di conseguenza, il responsabile mantiene autonomia nella gestione quotidiana, mentre la grafica rimane uniforme e sotto controllo.
Trasferimento del Sito su Hostinger
Oltre alla ricostruzione del sito, mi sono occupato del trasferimento dell’infrastruttura su un server Hostinger.
Il dominio è rimasto registrato presso Aruba. Pertanto, ho configurato i record DNS necessari per collegarlo al nuovo spazio hosting senza trasferirne la gestione.
Il lavoro ha compreso:
- preparazione del nuovo hosting;
- installazione e configurazione di WordPress;
- collegamento del dominio;
- gestione dei puntamenti DNS;
- verifica del corretto instradamento;
- controllo delle risorse del server;
- test delle pagine;
- verifica dell’area login;
- controllo delle funzioni riservate.
In questo modo, il sito utilizza l’infrastruttura Hostinger, mentre il dominio continua a rimanere presso Aruba.
Ottimizzazione di Velocità e Prestazioni
Durante il rifacimento ho lavorato anche sulla velocità e sulle prestazioni.
La ricostruzione completa mi ha permesso di eliminare la vecchia struttura e organizzare meglio pagine, template, immagini e risorse.
In particolare, ho controllato:
- configurazione dell’hosting;
- dimensione delle immagini;
- caricamento delle risorse;
- struttura delle pagine Elementor;
- componenti realmente necessari;
- script e fogli di stile;
- comportamento delle slide;
- template dinamici;
- prestazioni da dispositivi mobili.
Inoltre, il trasferimento sul nuovo server mi ha permesso di gestire direttamente l’ambiente di hosting e intervenire con maggiore controllo sulla configurazione tecnica.
Esperienza Responsive
Ho progettato il sito per adattarsi correttamente a desktop, tablet e smartphone.
Durante lo sviluppo ho verificato:
- header e navigazione mobile;
- visualizzazione della hero;
- comportamento delle slide;
- leggibilità delle categorie;
- utilizzo dei filtri;
- disposizione degli articoli;
- consultazione delle convenzioni;
- accesso all’area soci;
- visualizzazione dei contenuti riservati;
- sezione degli articoli correlati.
In particolare, slide e filtri devono rimanere facili da utilizzare anche su schermi ridotti.
Per questo motivo, ho adattato dimensioni, spaziature e disposizione dei componenti alle diverse risoluzioni.
Un Progetto tra Area Soci e Gestione Editoriale
Presidenza Club non rappresenta soltanto un sito di presentazione.
Il progetto integra infatti:
- ricostruzione completa del sito;
- progettazione da zero con Elementor;
- header, footer e pagine personalizzate;
- area login;
- ruoli amministratore e socio;
- contenuti riservati;
- convenzioni organizzate per categorie;
- filtri attraverso i tag;
- immagini delle categorie gestite con ACF;
- slide dinamiche sviluppate con codice custom;
- template automatici per gli articoli;
- articoli correlati;
- flusso editoriale semplificato;
- trasferimento dell’hosting;
- gestione dei DNS;
- ottimizzazione delle prestazioni.
Di conseguenza, il sito riunisce presentazione, gestione dei soci, pubblicazione delle convenzioni e organizzazione editoriale in un’unica struttura.
Tecnologie Utilizzate
- WordPress: gestione di utenti, articoli, categorie, tag e convenzioni.
- Elementor: progettazione da zero di pagine, archivi, header, footer e template dinamici.
- Advanced Custom Fields: collegamento di immagini e dati personalizzati alle categorie.
- HTML: struttura dei componenti e delle sezioni personalizzate.
- CSS: definizione della grafica e adattamento responsive.
- JavaScript: gestione di slide, filtri e interazioni dinamiche.
- PHP: funzioni WordPress, visibilità condizionale e logiche personalizzate.
- Hostinger: infrastruttura hosting del progetto.
- DNS: collegamento del dominio Aruba al nuovo server.
Risultato Finale
Il risultato è un sito WordPress con area soci ricostruito completamente da zero, senza utilizzare temi commerciali, demo o template preconfezionati.
Ho progettato personalmente con Elementor tutte le pagine, gli archivi e i template dinamici, creando una struttura specifica per le esigenze di Presidenza Club.
Le categorie organizzano le diverse aree delle convenzioni, mentre ACF collega a ciascuna categoria le immagini utilizzate nelle slide e nelle hero.
Inoltre, i filtri tramite tag permettono agli utenti di individuare più rapidamente i contenuti pertinenti all’interno delle singole categorie.
L’area soci gestisce invece la visualizzazione delle informazioni riservate: i visitatori consultano la parte pubblica, mentre gli utenti autenticati accedono agli sconti e alle condizioni dedicate.
I template Elementor che ho creato semplificano anche il lavoro editoriale. Il responsabile inserisce testi, fotografie, categorie e tag, mentre il sito applica automaticamente il layout e organizza il contenuto nelle sezioni corrette.
Infine, il trasferimento su Hostinger, la configurazione dei DNS e il lavoro sulle prestazioni hanno completato la ricostruzione tecnica del progetto.
Presidenza Club rappresenta quindi un lavoro completo di progettazione WordPress, sviluppo da zero con Elementor, area soci, contenuti riservati, funzioni personalizzate e gestione dell’infrastruttura.
