Al giorno d'oggi per diventare uno sviluppatore freelance di WordPress hai spesso bisogno di sviluppare contemporaneamente diversi siti WordPress per diversi clienti. Ecco come.
Ciò richiede che tu adotti quanto segue:
Con questa configurazione puoi facilmente:
In questo tutorial facciamo riferimento a Mac OS X ma puoi facilmente adattarlo a qualsiasi altro sistema operativo. Supponiamo inoltre che il server remoto abbia già installato Git e che l'accesso SSH sia configurato con l'autenticazione della chiave pubblica (le installazioni SSH e Git non rientrano nell'ambito di questo tutorial).
Lo scenario che vedremo è costituito da a Ambiente locale che consente lo sviluppo di un sito WordPress con plugin e temi e a Server remoto che ospiterà il sito WordPress "di produzione". Nell'ambiente locale useremo a Desktop computer e a Taccuino computer. Su entrambi i computer configureremo MAMP, Dropbox e Git in modo che tu possa lavorare sul tuo desktop quando sei in ufficio e sul tuo Notebook quando non sei in ufficio e tutte le modifiche saranno sincronizzate.
Useremo Dropbox per sincronizzare file e DB tra Desktop e Notebook, e useremo Git per tenere traccia delle modifiche localmente e per distribuirle sul server remoto.
Per semplicità definiamo www.site.dev
come il sito di sviluppo sull'ambiente locale e www.site.com
come sito di produzione sul server remoto.
Nell'ambiente locale:
Sul server remoto:
Nell'ambiente locale:
Esempi tipici di flusso di lavoro:
Scarica e installa Dropbox sul desktop e sul notebook (vedi qui per le istruzioni). Utilizza lo stesso account su entrambi i computer.
Nella cartella Dropbox sul desktop, crea la seguente struttura di directory:
Verificare che la stessa struttura di directory sia propagata su Notebook.
MAMP è un acronimo che sta per: Mac, Apache, MySQL e PHP, è un'applicazione che installa un ambiente server locale sul tuo Mac.
La sua installazione è molto semplice: scarica MAMP da qui, decomprimi l'archivio e fai doppio clic su di esso, quindi segui le istruzioni. Fatelo su desktop e notebook. Non avviare ancora MAMP: prima di farlo devi spostare il database e modificare la configurazione predefinita.
Sopra Desktop spostare la cartella del database dalla posizione standard di MAMP alla directory db su Dropbox, per fare ciò aprire un Terminale e utilizzare i seguenti comandi:
cd / Applicazioni / MAMP / db mv * ~ / Dropbox / Sviluppo / db /
Sopra Taccuino aprire un Terminale ed eliminare la cartella del database usando il seguente comando:
cd / Applicazioni / MAMP rm -rf ./db
Infine su entrambi Desktop e Taccuino creare un collegamento simbolico da MAMP a Dropbox con il seguente comando:
ln -s ~ / Dropbox / Sviluppo / db / Applicazioni / MAMP / db
Ora il collegamento simbolico / Applicazioni / MAMP / db punta alla cartella condivisa Dropbox ~ / Dropbox / sviluppo / db che contiene i database MAMP. Non avviare ancora MAMP: dobbiamo prima apportare una modifica alla configurazione.
MAMP utilizza le porte personalizzate per le istanze del server Apache e MySQL: Apache gira sulla porta 8888, MySQL gira sulla porta 8889. È possibile mantenere questa configurazione o, come suggeriamo, cambiarla per utilizzare le porte standard: 80 per Apache e 3306 per MySQL.
Per ripristinare le porte standard, avviare MAMP solo sul desktop , fare clic su "Preferenze ...", quindi su "Porte", fare clic su "Imposta su porte Apache e MySQL predefinite" e infine fare clic su "OK": MAMP salva la nuova configurazione e si riavvia automaticamente.
Ora sul desktop apri il tuo browser preferito e vai a http: // localhost / MAMP /: dovresti vedere la Home Page di MAMP.
Se non vedi la Home Page di MAMP probabilmente hai abilitato la Condivisione Web: apri le Preferenze di Sistema, fai clic su Condivisione e disattiva la Condivisione Web.
Non preoccuparti se Mac OS X richiede una password all'avvio di MAMP: abbiamo installato Apache per l'esecuzione sulla porta 80 che è una porta privilegiata e richiede una password di amministratore.
Perché in questa configurazione MAMP non può essere eseguito contemporaneamente sul desktop e sul notebook, esci da MAMP sul desktop, avvialo su Notebook e configuralo allo stesso modo. Quando finisci di interrompere MAMP.
La configurazione di MAMP Apache è memorizzata in /Applications/MAMP/conf/apache/httpd.conf. Modifica questo file con il tuo editor di testo preferito e aggiungi le seguenti righe (fallo su entrambi i tuoi Desktop e il tuo Taccuino):
# Include la configurazione condivisa sulla cartella Dropbox Include /Users/YOURUSERNAME/Dropbox/Development/conf/local-development.conf
Sostituire IL TUO NOME UTENTE
con il tuo nome utente Mac OS X (se non lo conosci, apri Terminale ed esegui chi sono
; ti fornirà il tuo nome utente).
Questa istruzione indica ad Apache di caricare un file di configurazione aggiuntivo dalla cartella Dropbox (sincronizzato tra Desktop e Notebook). In questo modo possiamo usarlo come il file di configurazione dell'ambiente locale.
Apache Virtual Host è una bella funzionalità che consente di eseguire più di un sito Web (ad esempio www.site1.com e www.site2.com) su un singolo server. Gli host virtuali possono essere "basati su IP", il che significa che hai un indirizzo IP diverso per ogni sito web o "basato sul nome", il che significa che hai più nomi in esecuzione su un indirizzo IP. L'ultima è la funzione che useremo (vedi qui per i dettagli).
Con il tuo editor di testo preferito apri il file di configurazione dell'ambiente locale /Users/YOURUSERNAME/Dropbox/Development/conf/local-development.conf e inserisci le seguenti linee:
AllowOverride All # # Named Virtual Host # LogFormat "% V% h% l% u% t \"% r \ "% s% b" vcommon CustomLog /Users/YOURUSERNAME/Dropbox/Development/logs/access.log vcommon ErrorLog / Users / YOURUSERNAME / Dropbox / Development / logs / errors.log UseCanonicalName Off VirtualDocumentRoot / Users / YOURUSERNAME / Dropbox / Development / vhosts /% 0
La stringa "0%
"lancia la magia: quando il server Apache riceve una richiesta per il dominio www.site.dev cerca una directory di nome www.site.dev nel / Users / nomeutente / Dropbox / sviluppo / vhosts /, e se trovato serve i file da esso.
Le altre istruzioni indicano ad Apache dove scrivere errori e accedere ai file di registro.
Ora siamo pronti per configurare il sito di sviluppo di WordPress www.site.dev. Per fare questo dobbiamo creare un www.site.dev directory (sul desktop).
e dobbiamo modificare (su desktop e notebook) / etc / hosts file per mappare il nome host www.site.dev all'indirizzo IP dell'host locale. Con il tuo editor di testo preferito apri il file / etc / hosts e aggiungi le seguenti righe alla fine del file (Mac OS X richiede la tua password per modificare questo file di sistema):
# sviluppo locale 127.0.0.1 www.site.dev
A questo punto potrebbe essere utile fare qualche controllo: apri Terminale ed esegui il seguente comando:
ping -c 3 www.site.dev
Dovresti avere una risposta simile a questa:
Ora è il momento di configurare WordPress: scarica il pacchetto WordPress da qui e decomprimi in una cartella temporanea. Sposta tutto il contenuto della cartella temporanea all'interno /Users/YOURUSERNAME/Dropbox/Development/vhosts/www.site.dev/.
Sul desktop avviare MAMP e aprire il browser all'indirizzo http: // localhost / MAMP /. Fare clic sulla scheda phpMyAdmin e creare un nuovo database denominato site_dev
:
Apri il tuo browser su www.site.dev e completa l'installazione di WordPress usando questi valori:
Fermare MAMP sul desktop, attendere la sincronizzazione di Dropbox e avviarlo su Notebook. Apri il tuo Browser Notebook su www.site.dev: WordPress è già configurato!
Alla fine del passaggio 3 abbiamo un ambiente di sviluppo WordPress locale basato su MAMP e sincronizzato tra Desktop e Notebook tramite Dropbox, ora è il momento di configurare il server remoto.
Git è un sistema di controllo della versione distribuito che registra le modifiche a un file o un insieme di file nel tempo e consente di trasferire le modifiche a un server remoto (descrizione più dettagliata qui). In questo tutorial assumiamo che Git sia già installato sul tuo server. Di conseguenza, procediamo con la configurazione.
Per prima cosa devi accedere al server. Supponiamo che tu abbia un account con accesso SSH e autenticazione a chiave pubblica. In questo modo non devi inserire una password ogni volta che accedi. Apri una finestra di terminale e connettiti al server:
ssh [email protected]
Imposta alcune impostazioni predefinite Git su utente ed e-mail per evitare che Git chieda loro ogni volta:
git config --global user.email "[email protected]" git config --global user.name "Il tuo nome"
Installazione e inizializza un repository vuoto:
mkdir site.git cd site.git git init --bare
Per consentire la distribuzione dallo sviluppo al sito di produzione, è necessario configurare a Git hook (Uso Vi come editor di testo per il server remoto):
cd hooks vi post-ricevi
Quindi inserisci le seguenti linee:
#! / bin / bash # docroot = "/ home / yourusername / www" mentre leggi oldrev newrev ref do branch = "echo $ ref | cut -d / -f3" if ["master" == "$ branch"]; quindi git --work-tree = $ docroot checkout -f $ branch fi done
Imposta la variabile docroot
al server Web DocumentRoot e quindi effettuare post-ricezione
eseguibile:
chmod 755 post-ricevi
Questo hook viene richiamato al termine del processo di invio delle modifiche da un client (desktop o notebook) al server remoto. Effettua la distribuzione nella directory DocumentRoot del server Web di produzione (vedere qui per i dettagli su Git Hooks).
I comandi Git ne usano alcuni variabili ambientali; dobbiamo impostarne due: GIT_DIR
e GIT_WORK_TREE
. Il primo specifica il percorso del repository, il secondo il percorso dell'albero di lavoro (il DocumentRoot). La shell predefinita sul mio server remoto è Bash, quindi li aggiungo al file .bash_profile
.
cd ~ vi .bash_profile
Aggiungi le seguenti righe alla fine del file:
# GIT export GIT_DIR = ~ / repo.git export GIT_WORK_TREE = ~ / www
Sul server remoto è ancora necessario creare un database su MySQL: per farlo è possibile seguire le istruzioni di installazione dettagliate sul codice WordPress. Il mio server remoto ha cPanel come pannello di controllo di hosting, quindi seguo queste istruzioni.
Installa Git su Mac OS X (istruzioni più dettagliate sul libro Pro Git): scarica il programma di installazione dalla pagina Codice Google, fai doppio clic sul file dmg, quindi sul file pkg e segui le istruzioni. Fatelo su desktop e notebook.
Ora sei pronto per inizializzare un repository Git sull'ambiente locale. Per farlo, apri Terminale (sul desktop o sul notebook) e usa i seguenti comandi:
cd ~ / Dropbox / Development / vhost / www.site.dev git init .
Dovresti vedere qualcosa di simile a questo:
Per verificare lo stato del repository Git, utilizzare questo comando:
stato git
l'output dovrebbe essere come questo:
Git ti sta dicendo che tutti questi file e queste directory non sono tracciati nel repository e suggerisce di usare il aggiungi git
comando per rintracciarli.
Prima di fare questo è necessario apportare alcune modifiche alla configurazione di Git. Dobbiamo dire a Git quali file dovrebbe tracciare e quali non dovrebbero. Per fare ciò usa il .gitignore file.
Questo file specifica i file non tracciati che Git dovrebbe ignorare (vedi qui per maggiori dettagli). Il comando è semplice, facciamo un esempio per capire come funziona:
# ignora Mac OS X Desktop Service Store .DS_Store # ignora la directory my-test-dir e tutte le sottodirectory my-test-dir / #ignore tutti i file .txt * .txt
Quindi crea il file ~ / Dropbox / Sviluppo / vhost / www.site.dev / .gitignore e aggiungi le seguenti linee:
# ignora Mac OS X Desktop Service Store .DS_Store # ignora debug.log wp-content / debug.log
Per il momento questo è tutto ciò che devi fare. In seguito aggiungeremo altri file e directory.
WordPress su un ambiente locale utilizza DB di MAMP e il suo file di configurazione wp-config.php riflette questa configurazione (nome utente e password standard di MAMP MySQL):
// ** Impostazioni MySQL - Puoi ottenere queste informazioni dal tuo host web ** // / ** Il nome del database per WordPress * / define ('DB_NAME', 'site_dev'); / ** Nome utente del database MySQL * / define ('DB_USER', 'root'); / ** Password del database MySQL * / define ('DB_PASSWORD', 'root'); / ** Nome host MySQL * / define ('DB_HOST', 'localhost');
Funziona su un ambiente locale ma cosa succede se lo distribuiamo sul server remoto? Ovviamente non riuscirà a connettersi al DB perché DB_NAME
, DB_USER
, DB_PASSWORD
e probabilmente DB_HOST
sono sbagliati.
La soluzione viene dall'articolo di Mark Jaquith: modificare il wp-config.php file in modo che la configurazione per Local Environment sia caricata da un altro file e che il file non sia tracciato da git. Per fare questo apri wp-config.php file e sostituire le righe precedenti con queste righe:
if (file_exists (dirname (__FILE__). '/local-config.php')) include (dirname (__FILE__). '/local-config.php'); else define ('DB_NAME', 'YOURDBNAME'); define ('DB_USER', 'YOURDBUSER'); define ('DB_PASSWORD', 'YOURDBPASSWORD'); define ('DB_HOST', 'YOURDBHOSTNAME');
Sostituire YOURDBNAME
, YOURDBUSER
, YOURDBPASSWORD
e YOURDBHOSTNAME
con i valori che hai definito nel passaggio 5.
Crea il ~ / Dropbox / Sviluppo / vhost / www.site.dev / local-config.php file e inserisci le definizioni dell'ambiente locale qui:
define ('DB_NAME', 'site_dev'); define ('DB_USER', 'root'); define ('DB_PASSWORD', 'root'); define ('DB_HOST', 'localhost');
Ora dobbiamo aggiungere local-config.php a .gitignore in modo che Git non la seguirà:
# ignora Mac OS X Desktop Service Store .DS_Store # ignora debug.log wp-content / debug.log # ignora local-config.php local-config.php
OK, ora siamo pronti a fare il primo commit.
Per eseguire il commit delle modifiche al repository Git su Local Environment, inserisci questi comandi:
cd ~ / Dropbox / Development / vhost / www.site.dev / git add. git commit -m "Importazione iniziale"
Il primo comando Git tiene traccia di tutti i file e le directory in ~ / Dropbox / Sviluppo / vhost / www.site.dev / tranne quello in .gitignore, il secondo li impegna tutti nel repository Git.
È tempo di spingere WordPress su Remote Server, ma prima dobbiamo impostare il repository Git remoto:
git remote aggiungi sito web ssh: //[email protected]/home/yourusername/site.git
Questo comando dice a Git che c'è un repository remoto chiamato sito web
, ospitato sul server www.site.com accessibile tramite una connessione SSH.
Finalmente la prima distribuzione sul server remoto:
git push sito master
L'output del comando dovrebbe essere simile al seguente:
Ora puoi puntare il tuo browser su www.site.com e vedi il sito WordPress su Remote Server.
Come esempio di sviluppo di temi / plugin, possiamo creare sul tema Ambiente locale un tema figlio di Twenty Eleven e distribuirlo sul server remoto.
Per istruzioni dettagliate su come creare un tema figlio, puoi leggere questo articolo su Wptuts +. Fondamentalmente dobbiamo creare una directory che contenga due file: style.css e functions.php (quest'ultimo è facoltativo).
Quindi su Desktop (o su Notebook) crea la directory ~ / Dropbox / Sviluppo / vhost / www.site.dev / wp-content / themes / my-TwentyEleven-bambino, quindi creare un file chiamato style.css all'interno di questa cartella e aggiungi le seguenti linee:
/ * Nome del tema: My Twenty Eleven Child URI di tema: http: //www.site.com/ Descrizione: tema secondario per il tema Twenty Eleven Autore: Nome utente Autore URI: http: //your-site.com/ Modello: ventieleven Version: 0.1 * / @import url ("... /twentyeleven/style.css");
Puoi anche aggiungere alcune modifiche CSS sotto il @importare
linea, ad esempio puoi cambiare lo sfondo del corpo:
body background: # D51717;
Quindi creare il functions.php file e aggiungi le seguenti righe:
'. "\ N"; add_action ('wp_head', 'favicon_link'); ?>
Questo semplice file funzione fa una cosa: aggiunge un collegamento favicon all'elemento head delle pagine HTML.
Ora il tema del nostro bambino è completo e dobbiamo rintracciarlo nel repository Git:
cd ~ / Dropbox / Development / vhost / www.site.dev / git aggiungi wp-content / theme / my-twentyeleven-child /
Quindi dobbiamo impegnare le modifiche:
git commit -m "Aggiunto My Twenty Eleven Child Theme"
In questo modo è possibile continuare lo sviluppo del tema secondario aggiungendo file, modificando il codice e inserendo tutte queste modifiche nel repository. Quando il tuo tema è pronto per il server di produzione devi semplicemente emettere il spingere
comando:
git push sito master
In questo modo il tema figlio verrà inserito nel server remoto, pronto per essere utilizzato.
Se sviluppi un plugin, segui la stessa procedura: segui la directory dei plugin e commetti le modifiche sul repository. Quando il tuo plugin è pronto, fallo su Remote Server.
In modo simile possiamo gestire l'installazione di plugin per WordPress o l'aggiornamento di WordPress. Supponiamo di voler provare un nuovo plug-in e vogliamo essere certi che non interrompa il nostro sito di produzione.
Lo installiamo sull'ambiente locale prima usando il pannello di amministrazione di WordPress (vedi qui per i dettagli), quindi dobbiamo seguirlo e aggiungerlo al repository Git (fallo sul tuo desktop o sul tuo notebook):
cd ~ / Dropbox / Development / vhost / www.site.dev / git aggiungi wp-content / plugins / plugin-to-try / git commit -m "Aggiungi il plugin per provare"
Se il plugin funziona, puoi distribuirlo su Remote Server usando:
git push sito master
e abilitarlo usando il pannello di amministrazione di WordPress.
Se il plugin non funziona, puoi disinstallarlo utilizzando il pannello di amministrazione di WordPress, quindi puoi rimuoverlo dai file tracciati e confermare le modifiche:
git rm wp-content / plugins / plugin-to-try / git commit -m "Rimosso il plugin per provare"
Un piccolo consiglio: se aggiungi una directory plugin a
.gitignore
file (prima del commit) il plugin rimarrà solo sull'ambiente locale ma non verrà inserito sul server remoto. Ciò potrebbe essere utile per plug-in come Debug Bar utilizzati nello sviluppo locale ma che non devono essere trasferiti su un sito di produzione.
Ok, sappiamo, i rapidi cambiamenti sul server di produzione non sono una buona abitudine, anzi sono una cattiva abitudine, ma a volte sono inevitabili. Supponendo che abbiamo cambiato il DB_PASSWORD
sul server remoto wp-config.php file e ora vogliamo riconoscere questo cambiamento nel nostro ambiente locale wp-config.php. Per eseguire questa operazione, connettersi innanzitutto al server remoto tramite SSH e utilizzare il seguente comando:
git commit -m "cambia DB_PASSWORD su wp-config.php"
Quindi estrarre le modifiche dal repository remoto utilizzando il seguente comando sul desktop:
git pull sito master
Se leggi il wp-config.php vedrai il nuovo DB_PASSWORD
.
In questo tutorial abbiamo visto uno scenario costituito da un ambiente locale e un server remoto che ospita lo sviluppo e il sito di produzione www.site.com, ma puoi facilmente ripetere questa configurazione per www.mynewcustomer.com, per www.myothernewnewcustomer.com e così via.
MAMP, Dropbox e Git formano un team vincente per gestire lo sviluppo e l'implementazione di WordPress, rappresentano un ambiente di sviluppo flessibile che consente di aggiungere facilmente un nuovo sito, svilupparlo ovunque tu sia e distribuirlo in modo affidabile al server di produzione.
Se lavori regolarmente con WordPress, consulta la selezione di fantastiche utilità di WordPress su Envato Market. Dai plugin per la sicurezza ai personalizzatori iFrame, c'è sicuramente qualcosa che può aiutarti.
Utilità di WordPress su Envato Market