Come costruire un sito web di foto in Drupal, parte 3

Per la parte finale di questa serie, ti guideremo attraverso le fasi finali della creazione di un sito web di fotografia da zero utilizzando il sistema di gestione dei contenuti Drupal (CMS).

I siti web creati utilizzando un CMS sono più sofisticati di quelli costituiti da pagine di testo fisse o "statiche" e sono essenziali per la visualizzazione delle immagini.

In quanto CMS open source per scopi generali, Drupal vanta una vasta comunità di sviluppatori che contribuiscono ed è popolare tra governi, aziende senza scopo di lucro e istituzioni educative.

Costruire un sito web in Drupal è più complicato che farlo in altri CMS come WordPress, quindi attirerà le persone informatiche a cui piace l'idea di andare "dietro le quinte" di un sito web.

La ricompensa sarà un sito web su misura e sicuro costruito su una piattaforma altamente personalizzabile in cui vengono conferite funzionalità aggiuntive tramite l'installazione di moduli (funzionalità extra) e temi (che determinano l'aspetto grafico).

Per arrivare a questo punto, abbiamo avviato la realizzazione del nostro sito in ambiente locale, utilizzando l'host locale Acquia Dev Desktop.

Inizia scaricando Acquia Dev Desktop ed eseguendo il programma di installazione, quindi avvia il software e seleziona Avvia da zero.

Usa l'impostazione predefinita suggerita per individuare i file codebase sul tuo sistema, inserisci il nome del tuo sito e accetta le richieste predefinite per la versione di PHP e il nome del database. Scegli v8.9.1 in Installa una distribuzione Drupal, inserisci le informazioni richieste e Drupal verrà installato.

Successivamente, installa il modulo Galleria multimediale e il tema Showcase Lite. Quindi inizia a creare le tue gallerie …

Di cosa hai bisogno per creare un sito web di foto in Drupal

  • Computer
  • accesso ad Internet
  • Immagini pronte per il caricamento
  • Applicazione di sviluppo (stiamo utilizzando Acquia Dev Desktop)
  • Tempo: 1 settimana (build)

Le tre fasi di sviluppo di un sito Drupal

1. Inizia impostando il tuo nome di dominio

A differenza di wordpress.com, Drupal non offre un'opzione di hosting, quindi dovrai prendere tu stesso questi accordi.

Prima di iniziare, dovrai anche acquisire un nome di dominio per il tuo sito: visita Domain.com, Bluehost o www.123-reg.co.uk oppure cerca un fornitore online.

Inserisci il nome del sito desiderato e otterrai un elenco di estensioni disponibili (.com, .co.uk, ecc.) E le tariffe di registrazione.

2. Sviluppa il tuo sito Drupal sul tuo computer

Potresti installare Drupal su un sito di web hosting e costruirlo lì, ma sviluppare il tuo sito su un host locale (il tuo computer) rende le cose molto più semplici. Puoi costruire il sito secondo i tuoi ritmi, risolvendo eventuali ostacoli che si presentano e perfezionando l'aspetto grafico mentre procedi.

3. Distribuisci il sito finito al tuo provider di hosting

Quando il tuo sito è pronto, puoi distribuirlo al tuo provider di hosting. Il trasferimento dei file sul sito host e la configurazione di tutte le impostazioni potrebbero richiedere fino a un giorno, ma poi il tuo sito web di foto è pronto per la sua grande rivelazione.

Crea un sito Web di foto Drupal in 10 passaggi

Utilizzando l'ambiente locale Acquia Dev Desktop, continuiamo a sviluppare il nostro
sito prima del test e della successiva distribuzione su una piattaforma di hosting di siti Web …

01 Crea collegamenti di menu per le gallerie

Dopo aver creato alcune gallerie, le abbiamo collegate alla navigazione principale in modo che i visitatori del sito possano sfogliarle facilmente. Nell'area di amministrazione, abbiamo fatto clic su Struttura, quindi su Navigazione principale e Menu Modifica.

Abbiamo inserito un titolo per il collegamento del menu, quindi abbiamo digitato "/ media_gallery / 1" nel campo Collegamento, ripetendo questo passaggio per le altre gallerie, sostituendo "/ 1" con "/ 2", "/ 3" e così via.

02 Miglioramento della visualizzazione delle immagini

Le nostre gallerie trarrebbero vantaggio da un "lightbox" per visualizzare le foto. Selezionando un'immagine si aprirà una sovrapposizione pop-up, su cui possiamo fare clic per visualizzare tutte le immagini visualizzate nella galleria.

Colorbox è un popolare plug-in lightbox che ha funzionato con diverse versioni di Drupal, quindi è ben consolidato e viene mantenuto attivamente.

Puoi trovare la sua pagina qui: dai un'occhiata alla descrizione del plug-in per vedere cosa può fare.

03 Scarica il modulo Colorbox

Noterai dalla descrizione che ci sono due elementi distinti in Colorbox - un modulo e un plug-in - e il plug-in è un download separato.

Cominciamo con il modulo. Scorri fino in fondo alla pagina e individua la versione di Drupal 8 (è la prima delle due caselle verdi), passa il mouse sul link tar.gz, fai clic con il tasto destro e seleziona Copia indirizzo link.

Torna nell'area di amministrazione del sito, fai clic sulla scheda Estendi, fai clic su Installa nuovo modulo, incolla l'URL e fai clic su Installa.

04 Scarica il plug-in Colorbox

Torna alla pagina di download di Colorbox; immediatamente sotto Dipendenze, fare clic sul collegamento Colorbox Plugin 1.x. Ciò salverà un file di archivio compresso nella posizione designata dal tuo computer per i download.

Ora devi creare una directory sul tuo sistema per i file plug-in di Colorbox. Secondo le istruzioni sulla pagina di download di Colorbox, creare una directory in modo che il percorso dei file diventi (nome sito) / libraries / colorbox /, quindi decomprimere l'archivio in quella posizione.

05 Posiziona i file plug-in non compressi

Con l'archivio non compresso, dovresti essere in grado di vedere 14 file nella directory, incluso l'importantissimo file JavaScript jquery.colorbox-min.js.

Se la tua cartella mostra qualcosa di diverso, assicurati di cercare nel posto giusto: la cartella (sitename) / modules / colorbox presenta una sintassi molto simile. (Questa cartella dovrebbe contenere 22 file, incluse otto sottocartelle - vedi riquadro, sopra.)

06 Abilita il modulo Colorbox

Avendo già installato il modulo Colorbox, ora dobbiamo abilitarlo. (Questo processo non è automatico). Torna all'area di amministrazione del tuo sito e fai clic sulla scheda Estendi.

Scorri verso il basso di due terzi della pagina; nella sezione Media, metti un segno di spunta a sinistra di Colorbox. In fondo alla pagina, fai clic su Installa.

Vai a Rapporti ed esegui un rapporto sullo stato: se Colorbox non è elencato in Errori trovati, allora va tutto bene.

07 Guarda l'effetto del nostro nuovo lightbox

Ora vediamo che differenza ha fatto avere un lightbox di immagini. Fai clic su Torna al sito nell'angolo in alto a sinistra dello schermo e richiama una delle gallerie che hai aggiunto alla navigazione principale.

Fare clic su un'immagine e verrà aperta in una sovrapposizione a comparsa. Un paio di pulsanti nell'angolo in basso a sinistra ti consentono di spostarti tra le immagini nella galleria, mentre una X in basso a destra chiude il popup: tutto funziona correttamente.

08 Rivedi le informazioni sulla didascalia dell'immagine

Un'altra caratteristica di Colorbox è la sua capacità di visualizzare una didascalia per le immagini, che si apre dalla parte inferiore dell'immagine visualizzata quando ci passi il mouse sopra.

Al momento, utilizza il testo alternativo (una breve descrizione usata dagli screen reader o quando un'immagine non viene caricata) che inseriamo per ogni foto durante il caricamento dei file immagine. Per modificare le didascalie, apri il file immagine nel menu Contenuto / File.

09 Aggiungi alcune altre pagine chiave al sito

Ora che la visualizzazione delle immagini ha un aspetto migliore, possiamo iniziare a costruire il sito e aggiungere altri elementi chiave. Prima di tutto, creiamo una pagina Informazioni per delineare i servizi fotografici che stiamo offrendo.

Fare clic sulla scheda Contenuto, fare clic su Aggiungi contenuto e selezionare Pagina di base. Immettere il testo desiderato più un'immagine in linea ritagliata a una dimensione appropriata. (Abbiamo utilizzato 200 x 200 pixel.) Altre pagine da creare includono la pagina di benvenuto.

10 Valuta i progressi e aggiungi altri elementi

Quindi ora abbiamo un sito web di fotografia completamente funzionante, organizzato in una serie di gallerie che mostrano le immagini in una sovrapposizione pop-up con informazioni sui sottotitoli.

È un buon inizio, ma questo è solo l'inizio. Altri elementi del sito che potresti pensare di aggiungere includono post di blog regolari, per aprire una conversazione con i visitatori del tuo sito - e questa è un'altra funzione che Drupal supporta immediatamente.

Passaggi finali: distribuisci il tuo sito locale in rete

Quindi hai completato la tua build e hai risolto alcuni aspetti difficili testandola completamente: ora è il momento di distribuire il tuo sito su Internet e rivelarlo a un pubblico globale. Ecco come si fa …

1. Trova un fornitore di servizi di hosting

Una volta che il tuo sito è stato completamente creato e testato e tutti i bug o gli intoppi sono stati risolti, è pronto per essere rilasciato a un pubblico globale.

Il primo passo è trovare un provider di hosting. Assicurati che il tuo provider di hosting possa supportare PHP e MySQL, entrambi richiesti da Drupal.

2. Scarica un client FTP sul tuo computer

File Transfer Protocol (FTP) è il mezzo con cui carichi i file del tuo sito locale sul tuo provider di hosting web. Uno dei client FTP più popolari è FileZilla, che funziona sia su Windows che su macOS. Puoi trovare FileZilla qui.

3. Carica i file utilizzando il Pannello di controllo

Il tuo provider ti darà accesso a un pannello di controllo, per la gestione del sito tutto in un unico posto: cPanel è un'opzione popolare. Segui le istruzioni del tuo provider per l'implementazione, ma tieni presente che il trasferimento dei file e la configurazione delle impostazioni potrebbero richiedere fino a un'intera giornata.

è la rivista di fotografia preferita al mondo. Ogni numero è ricco delle ultime notizie, recensioni, tutorial, consigli di acquisto di esperti, suggerimenti e immagini stimolanti. Inoltre, ogni numero viene fornito con una selezione di regali bonus di interesse per i fotografi di tutte le abilità

I migliori siti di hosting di siti Web per fotografi: porta il tuo portfolio online
Le migliori opzioni di archiviazione cloud gratuite per i fotografi: piattaforme e app
I migliori corsi di fotografia online: dalle guide per principianti alle masterclass
I migliori costruttori di siti web per fotografi
I migliori gestori di password
Il miglior laptop per studenti
Miglior software di fotoritocco

Articoli interessanti...