Installazione e configurazione di Statamic in ambiente ServBay
Cos'è Statamic?
Statamic è un moderno sistema di gestione dei contenuti (CMS) basato su Laravel, adatto per la costruzione di vari tipi di siti web. Statamic è noto per la sua flessibilità e le sue potenti funzionalità, utilizzando il file system per memorizzare i contenuti, ma è anche possibile utilizzare un database.
Passaggi per installare Statamic
In questo articolo, vedremo come installare e configurare Statamic in ambiente ServBay utilizzando Composer.
Passaggio 1: Creare la directory del progetto
Innanzitutto, creare una nuova directory del progetto nella directory www
di ServBay:
cd /Applications/ServBay/www
mkdir servbay-statamic-app
cd servbay-statamic-app
2
3
Passaggio 2: Creare il progetto Statamic utilizzando Composer
ServBay include già Composer, quindi possiamo utilizzare Composer per creare il progetto Statamic:
composer create-project statamic/statamic .
Passaggio 3: Configurare il server web
Aggiungere un nuovo sito web
Aprire ServBay e fare clic sulla scheda "Host", aggiungere un nuovo sito web:
- Nome:
My Statamic Site
- Dominio:
servbay-statamic.local
- Tipo di sito:
PHP
- Versione PHP: Selezionare la versione PHP appropriata
- Directory radice del sito:
/Applications/ServBay/www/servbay-statamic-app/public
- Nome:
Salvare la configurazione
Salvare la configurazione e riavviare ServBay.
Passaggio 4: Configurare Statamic
Modificare il file di configurazione dell'ambiente
Nella directory radice del progetto, copiare il file
.env.example
e rinominarlo in.env
:bashcp .env.example .env
1Generare la chiave dell'applicazione
Eseguire il seguente comando per generare una nuova chiave dell'applicazione:
bashphp artisan key:generate
1
Passaggio 5: Avviare Statamic
Accedere a Statamic
Aprire il browser e accedere a
https://servbay-statamic.local
, vedrai la pagina di benvenuto di Statamic.Accedere al pannello di controllo
Aprire il browser e accedere a
https://servbay-statamic.local/cp
, vedrai la pagina di login del pannello di controllo di Statamic.Creare un account amministratore
Seguire le istruzioni per creare un account amministratore, inserire nome utente, password e indirizzo email, quindi fare clic su "Crea account".
Passaggio 6: Installare plugin e temi
Installare plugin
Accedere al pannello di controllo di Statamic, fare clic sull'icona "+" e poi su "Plugin", cercare e installare i plugin necessari.
Installare temi
Fare clic sull'icona "+" e poi su "Temi", scegliere e installare un tema.
Costruire un sito web con Statamic
Ora che hai installato e configurato correttamente Statamic in ambiente ServBay, puoi iniziare a utilizzarlo per costruire il tuo sito web. Ecco alcune operazioni comuni:
Creare contenuti e collezioni
Creare una collezione
Nel pannello di controllo di Statamic, fare clic su "Contenuti" -> "Collezioni", creare una nuova collezione, inserire il nome della collezione e altre impostazioni, quindi fare clic su "Salva".
Creare contenuti
Fare clic su "Contenuti" -> "Collezioni", selezionare la collezione appena creata, fare clic su "Nuovo", inserire il titolo del contenuto e il contenuto, quindi fare clic su "Salva".
Configurare il menu di navigazione
Creare una navigazione
Nel pannello di controllo di Statamic, fare clic su "Contenuti" -> "Navigazione", creare una nuova navigazione, inserire il nome della navigazione e altre impostazioni, quindi fare clic su "Salva".
Aggiungere voci di navigazione
Aggiungere collezioni e contenuti alla navigazione, quindi fare clic su "Salva".
Personalizzare template e stili
Modificare i template
Modificare i file template Blade nella directory
resources/views
per personalizzare il layout e la presentazione dei contenuti del sito. Ad esempio, modificare il filedefault.blade.php
:html<!-- resources/views/layouts/default.blade.php --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>{{ $title ?? 'My Statamic Site' }}</title> <link rel="stylesheet" href="{{ mix('css/app.css') }}"> </head> <body> <header> <nav> <ul> @foreach ($navigation as $item) <li><a href="{{ $item->url() }}">{{ $item->title() }}</a></li> @endforeach </ul> </nav> </header> <main> @yield('content') </main> <script src="{{ mix('js/app.js') }}"></script> </body> </html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25Aggiungere gli stili
Creare un file CSS nella directory
resources/css
e fare riferimento ad esso nel file template. Ad esempio, creare il fileapp.css
:css/* resources/css/app.css */ body { font-family: Arial, sans-serif; }
1
2
3
4Fare riferimento al file CSS nel file template:
html<!-- resources/views/layouts/default.blade.php --> <link rel="stylesheet" href="{{ mix('css/app.css') }}">
1
2Aggiungere gli script
Creare un file JavaScript nella directory
resources/js
e fare riferimento ad esso nel file template. Ad esempio, creare il fileapp.js
:javascript// resources/js/app.js document.addEventListener('DOMContentLoaded', function() { console.log('Hello, Statamic!'); });
1
2
3
4Fare riferimento al file JavaScript nel file template:
html<!-- resources/views/layouts/default.blade.php --> <script src="{{ mix('js/app.js') }}"></script>
1
2Compilare le risorse
Eseguire i seguenti comandi per compilare i file CSS e JavaScript:
bashnpm install npm run dev
1
2
Con questi passaggi, hai installato e configurato con successo Statamic in ambiente ServBay e hai iniziato a utilizzarlo per costruire il tuo sito web. La flessibilità e le potenti funzionalità di Statamic lo rendono una scelta ideale per costruire vari tipi di siti web.