Come creare un sito web in un'ora con Drupal

In questo tutorial vedremo come realizzare un sito web dinamico in una sola ora con Drupal 7.

Vediamo le specifiche del progetto che andremo a realizzare:
abbiamo la necessità di creare un sito web aziendale in cui sia possibile inserire periodicamente delle news. Queste news saranno costituite da:

  • Un titolo
  • Una descrizione
  • Un’immagine

La struttura del sito sarà costituita da:

  • Homepage con la lista delle ultime news inserite
  • Pagina “Chi siamo”
  • Pagina “Contatti”

Per riuscire a completare la realizzazione del nostro sito web nell’ora prevista abbiamo però bisogno di alcuni requisiti, quali:

  • Un server web PHP
  • Un server MySQL (è utile installare anche phpMyAdmin)

1 - Scarichiamo i sorgenti di Drupal

Colleghiamoci al sito web ufficiale di Drupal, drupal.org, clicchiamo a sinistra sul bottone verde “Get started with Drupal” e nella pagina successiva su Download Drupal 7.17. A quel punto salviamo il pacchetto ed estraiamone il contenuto nella nostra www-root (la www-root è il path in cui teniamo i files che il nostro Apache processa, è essenzialmente la cartella dove teniamo le nostre pagine web).

Per velocizzare il tutto, possiamo cliccare qui per scaricare Drupal.

Avremo bisogno anche della traduzione italiana, che la community italiana ci fornisce puntualmente in ogni release. Per scaricarla rechiamoci a questo indirizzo e clicchiamo sul link di download corrispondente alla versione corrente (7.17). Salviamo il file con estensione po e copiamolo nella seguente sottocartella di Drupal precedentemente creata nella www-root, e cioè in /profiles/standard/translations/.

Per velocizzare nuovamente il tutto possiamo cliccare su questo link diretto.

2 - Installiamo Drupal

È arrivato il momento di installare Drupal.

Per prima cosa è necessario creare un database. Recandoci all’indirizzo http://localhost/phpmyadmin, ci dobbiamo loggare con i nostri nome utente e password e creare un nuovo database.
Chiamiamolo ad esempio drupal.

Ora apriamo il browser all’indirizzo http://localhost/drupal-7.17. La pagina di installazione di Drupal comparirà davanti a noi. Selezioniamo il tipo di installazione standard e clicchiamo sul bottone Save and continue. Se avremo corettamente copiato il file di traduzione potremo scegliere la lingua Italian (Italiano) e proseguire premendo Save and continue.

Lasciamo selezionato il tipo di database di default MySQL, MariaDB o equivalente e specifichiamo la configurazione del database in base ai dati inseriti durante la sua creazione, ad esempio:

  • Nome Database: drupal
  • Nome Utente Database: drupal
  • Password Database: drupal

Clicchiamo su Salva e continua per far partire l’installazione di Drupal.

L’installazione è quasi completata, prima di terminare ci vengono richieste le informazioni principali sul sito:

  • Nome del sito: mettiamo il nome dell’azienda
  • Indirizzo e-mail del sito: mettiamo il nostro indirizzo email
  • Profilo di manutenzione del sito: si tratta dell’utente che avrà accesso all’area di amministrazione del sito.
  • Nome utente: Admin
  • Indirizzo e-mail: mettiamo il nostro indirizzo email
  • Password: mettiamo una password
  • Conferma la password: ripetiamo la password inserita in precedenza

Selezioniamo Paese e Fuso orario predefinito per il sito.

Clicchiamo su Salva e continua ed avremo il nostro sito drupal pronto per essere configurato.

3 - Cambiamo look al nostro sito

Drupal fornisce una directory di temi già pronti liberamente scaricabili. Per questo sito abbiamo scelto di scaricare Acquia Marina, un tema molto pulito. Clicchiamo su questo link per scaricarlo immediatamente.

I temi scaricati vanno posizionati nella cartella sites/all/themes/, estraiamo quindi in quella cartella l’archivio appena scaricato. Ora logghiamoci come amministratori con username e password scelti in precedenza e clicchiamo nel menu in alto su Aspetto. Vedremo che il tema Acquia Marina è presente nell’elenco sotto gli altri temi che Drupal fornisce di default nel pacchetto di installazione. Attiviamo Acquia Marina e rendiamolo predefinito cliccando su Abilita e imposta come predefinito. Ci ritroveremo con il nostro nuovo tema installato e funzionante.

4 - Creiamo la pagina “Chi siamo”

Creare la pagina Chi siamo è davvero banale con Drupal. Rechiamoci su Contenuto > Aggiungi contenuto > Pagina base. Di default Drupal fornisce un campo di testo per il titolo ed una descrizione per la pagina, oltre alla possibilità di posizionare una voce di menu per la pagina stessa oltre ad altre impostazioni che per ora non prenderemo in considerazione.
Assegnamo quindi il titolo alla pagina, il testo, ed un titolo per il menu. Premiamo Salva ed avremo creato la nostra pagina con la relativa voce nel menu. Dobbiamo rendere visibile il menu principale nel layout del nostro sito, rechiamoci quindi in Struttura > Blocchi e trasciniamo il blocco Menu principale all’interno della regione Prima barra laterale, quindi premiamo il bottone Salva blocchi.

5 - Creiamo la pagina “Contatti”

Per creare una pagina di contatto abbiamo bisogno di abilitare un nuovo modulo. Questo non è un modulo aggiuntivo da scaricare in modo separato ma è incluso con il pacchetto base di Drupal. Rechiamoci in Moduli e provvediamo ad attivare il modulo Contact.
Ora rechiamoci in Struttura > Form contatti e settiamo le opzioni di configurazione necessarie ad avere una pagina contenente il modulo di contatto con il link nel menu. Clicchiamo su Aggiungi categoria ed inseriamo:

  • Categoria: Form di contatto
  • Lista destinatari: Il solo nostro indirizzo email
  • Risposta automatica: Grazie per averci contattato, ti risponderemo al più presto.

Ora rechiamoci in Struttura > Menu. Clicchiamo su elenca le voci del menu e quindi su modifica accanto alla voce Contatto. Attiviamo il menu mettendo la spunta sulla checkbox Attivato e selezioniamo Menu principale come Link padre al posto di Navigazione ed un peso maggiore di zero. Navigazione infatti è il menu riservato agli utenti loggati, noi vogliamo invece che il link al modulo di contatto sia mostrato nel menu in cui abbiamo mostrato il link alla pagina Chi siamo. Come ultimo settaggio, dobbiamo abilitare il modulo di contatto per gli utenti anonimi, rechiamoci su Persone > Permessi (tab in alto a destra) ed abilitiamo per il modulo contact il permesso necessario (Usa il modulo di contatto del sito per il ruolo Utente anonimo). Perfetto, ora abbiamo anche il modulo di contatto configurato. Manca un solo step al completamento del nostro sito web.

6 - Creiamo la sezione dinamica News

Ora non ci resta che configurare una nuova tipologia di contenuto. Rechiamoci su Struttura > Tipi di contenuto > Aggiungi un tipo di contenuto.

Inseriamo:

  • Nome: News
  • Nome ad uso interno: news
  • Descrizione: La news è una tipologia di contenuto che rappresenta una notizia.

Clicchiamo su Salva e aggiungi campi: avevamo messo nelle specifiche, oltre ai soliti campi titolo e descrizione, un campo aggiuntivo per le news che consenta agli amministratori di inserire un’immagine relativa alla notizia.

Sotto Aggiungi un nuovo campo inseriamo come etichetta Immagine, come nome ad uso interno lasciamo il default field_immagine‎. Il tipo di campo e il widget saranno entrambi Immagine. Dopo aver premuto il bottone Salva nella pagina seguente possiamo caricare un’immagine predefinita da mostrare nel caso venga inserita una notizia senza immagine. Infine troviamo le opzioni per rendere il campo obbligatorio, la possibilità di inserire un testo di aiuto per il campo e la possibilità di limitare le dimensioni dei file caricati. Non è il nostro caso, potremo cliccare direttamente su Salva le impostazioni per vedere aggiunto il nostro campo tra quelli elencati.

7 - Fine

Perfetto, abbiamo terminato. Ora possiamo recarci in Contenuto > Aggiungi contenuto > News e provare ad inserire la nostra prima notizia.