Installer WordPress avec Composer et Git

Il n’y a pas si longtemps encore, j’installais WordPress manuellement. Je téléchargeais l’archive sur le site de WordPress, j’extrayais les fichiers et je copiais le tout via SFTP. Cette méthode fonctionne bien, à moins de vouloir utiliser un gestionnaire de version. J’ai donc changé de méthode d’installation pour pouvoir utiliser Git.

Présentation des outils

Pour ceux qui ne les connaîtraient pas encore, voici une brève présentation des outils que nous allons utiliser dans cet article.

WordPress

WordPress est un système de gestion de contenu, autrement appelé CMS. Il est libre, écrit en PHP et utilise MySQL. Il est personnalisable grâce à des thèmes et des extensions.

Composer

Composer est un gestionnaire de dépendances. Il est libre et écrit en PHP. Il permet de déclarer et d’installer des bibliothèques nécessaires à un projet.

Git

Git est un logiciel de gestion de versions décentralisé. Il s’agit également d’un logiciel libre. Il vous permet de stocker un ensemble de fichier en conservant la chronologie des modifications.

WordPress Composer Git

Préparer le projet WordPress + Git + Composer

Je me suis inspiré de la recette d’Andrey « Rarst » Savchenko pour configurer le fichier « composer.json ». Cependant, je préfère utiliser le dépôt Github de WordPress pour récupérer les fichiers.

À quoi ressemblera le projet final ?

Pour commencer, et ainsi mieux comprendre les prochaines étapes, voici à quoi ressemblera le projet une fois que WordPress sera installé via Composer.

votresite.test
|- .git
|- htdocs
|--- wp (le « Noyau » de WordPress)
|------ wp-admin
|------ wp-content (ce dossier est inutile, mais il sera installé)
|------ wp-includes
|------ les autres fichiers WordPress
|--- wp-content (notre dossier content)
|------ languages
|------ plugins
|------ themes
|------ uploads
|------ vendor
|--- index.php
|--- wp-config.php
|- .gitignore
|- composer.json

La structure du dossier

J’utilise Gandi comme hébergeur. Chaque virtual host comporte un dossier « htdocs » correspondant au dossier public. Votre hébergeur utilise peut-être une structure différente ; pensez à faire les changements nécessaires (comme renommer le dossier) ici et dans les étapes suivantes.

La structure du dossier de départ va ressembler à ça :

votresite.test
|- htdocs
|--- index.php
|--- wp-config.php
|- .gitignore
|- composer.json

Comme vous pouvez le voir, les fichiers « composer.json » et « .gitignore » sont à la racine et nous créons deux fichiers dans le dossier public.

Indiquer à WordPress notre structure

Les deux fichiers que nous venons de créer vont indiquer à WordPress où se situent les parties « Noyau » (le dossier contenant « wp-admin » et « wp-includes ») et « Contenu » (notre dossier « wp-content »).

Le fichier « index.php » va indiquer à WordPress l’emplacement du fichier « wp-blog-header.php » nécessaire pour exécuter WordPress.

Voici son contenu :

<?php
/**
 * Define WP Blog Header location..
 *
 * @package WordPress
 */

define( 'WP_USE_THEMES', true );
require './wp/wp-blog-header.php';

Le fichier « wp-config.php » est assez classique, mais nous allons lui apporter des modifications :

  • indication du chemin vers le fichier autoload de Composer
  • configuration de la base de données
  • définition des clés uniques d’authentification et du salage.
  • désactivation des mises à jour automatiques et du menu mise à jour
  • désactivation de l’édition des fichiers thèmes et plugins
  • définition des chemins d’installation pour le « Noyau », les thèmes et les plugins.

Composer autoloader

Juste avant les paramètres MySQL, nous allons insérer une ligne indiquant où se trouve le fichier autoload de Composer. Certains paquets peuvent en avoir besoin.

require __DIR__ . '/wp-content/vendor/autoload.php';

La base de données

Pour configurer la base de données il faut changer les valeurs suivantes (présentes en début de fichier) :

// Indiquer le nom de votre base de données
define( 'DB_NAME', 'database_name_here' );
// Indiquer votre nom d’utilisateur MySQL
define( 'DB_USER', 'username_here' );
// Indiquer votre mot de passe MySQL
define( 'DB_PASSWORD', 'password_here' );
// Indiquer le nom d’hôte MySQL (généralement localhost)
define( 'DB_HOST', 'localhost' );
// Indiquer l’encodage des tables
define( 'DB_CHARSET', 'utf8' );
// Indiquer le type de collation de la base de données. Ne pas changer si vous ne savez pas ce que c’est.
define( 'DB_COLLATE', '' );

Les clés uniques d’authentification et de salage

Cette étape n’est pas propre à notre installation de WordPress via Composer. Il est recommandé de modifier ces valeurs pour chaque installation de WordPress.

define( 'AUTH_KEY', 'put your unique phrase here' );
define( 'SECURE_AUTH_KEY', 'put your unique phrase here' );
define( 'LOGGED_IN_KEY', 'put your unique phrase here' );
define( 'NONCE_KEY', 'put your unique phrase here' );
define( 'AUTH_SALT', 'put your unique phrase here' );
define( 'SECURE_AUTH_SALT', 'put your unique phrase here' );
define( 'LOGGED_IN_SALT', 'put your unique phrase here' );
define( 'NONCE_SALT', 'put your unique phrase here' );

Il suffit de vous rendre sur le lien indiqué par WordPress et de remplacer ces valeurs par celles générées.

Désactivation des mises à jour et de l’édition de fichier

Si elles ne sont pas déjà présentes dans votre fichier, il faut rajouter ces valeurs :

// Désactiver l’éditeur dans l’interface d’administration
define( 'DISALLOW_FILE_EDIT', true );
define( 'DISALLOW_FILE_MODS', true );
define( 'RELOCATE', true );
// Désactiver les mises à jour
define( 'AUTOMATIC_UPDATER_DISABLED', true );
define( 'WP_AUTO_UPDATE_CORE', false );

Définition des chemins d’installation

Pour cette étape, il est important de reprendre les mêmes emplacements que ceux définis dans le fichier « composer.json » (étape suivante). En cas d’erreur, pensez à vérifier la concordance des deux fichiers.

Nous allons indiquer à WordPress notre structure :

// Définir le chemin vers le « noyau » de WordPress. Remplacez par votre nom de domaine.
define( 'WP_SITEURL', 'https://yourdomainname.com/wp' );
// Définir l’URL de notre site. Remplacez par nom de domaine.
define( 'WP_HOME', 'https://yourdomainname.com' );
// Indiquer le chemin vers le dossier « wp-content » (le nôtre, pas celui de WordPress).
define( 'WP_CONTENT_DIR', dirname( __FILE__ ) . '/wp-content' );
// Indiquer le chemin vers les plugins. La première ligne correspond au chemin indiqué ci-dessus. La seconde indique le nom du répertoire pour les plugins.
define( 'WP_CONTENT_URL', WP_HOME . '/wp-content' );
define( 'WP_PLUGIN_URL', WP_CONTENT_URL . '/plugins' );

Le fichier « wp-config.php » final

<?php
/**
 * The base configuration for WordPress.
 *
 * The wp-config.php creation script uses this file during the
 * installation. You don't have to use the web site, you can
 * copy this file to "wp-config.php" and fill in the values.
 *
 * This file contains the following configurations:
 *
 * * MySQL settings
 * * Secret keys
 * * Database table prefix
 * * ABSPATH
 *
 * @package WordPress
 * @see https://codex.wordpress.org/Editing_wp-config.php
 */

// Composer autoloader
require __DIR__ . '/wp-content/vendor/autoload.php';

// ** MySQL settings - You can get this info from your web host ** //
/** The name of the database for WordPress */
define( 'DB_NAME', 'database_name_here' );

// MySQL database username.
define( 'DB_USER', 'username_here' );

// MySQL database password.
define( 'DB_PASSWORD', 'password_here' );

// MySQL hostname.
define( 'DB_HOST', 'localhost' );

// Database Charset to use in creating database tables.
define( 'DB_CHARSET', 'utf8' );

// The Database Collate type. Don't change this if in doubt.
define( 'DB_COLLATE', '' );

/*
// @+
 * Authentication Unique Keys and Salts.
 *
 * Change these to different unique phrases!
 * You can generate these using the {@link https://api.wordpress.org/secret-key/1.1/salt/ WordPress.org secret-key service}
 * You can change these at any point in time to invalidate all existing cookies. This will force all users to have to log in again.
 *
 * @since 2.6.0
 */
define( 'AUTH_KEY', 'put your unique phrase here' );
define( 'SECURE_AUTH_KEY', 'put your unique phrase here' );
define( 'LOGGED_IN_KEY', 'put your unique phrase here' );
define( 'NONCE_KEY', 'put your unique phrase here' );
define( 'AUTH_SALT', 'put your unique phrase here' );
define( 'SECURE_AUTH_SALT', 'put your unique phrase here' );
define( 'LOGGED_IN_SALT', 'put your unique phrase here' );
define( 'NONCE_SALT', 'put your unique phrase here' );

// #@-

/**
 * WordPress Database Table prefix.
 *
 * You can have multiple installations in one database if you give each
 * a unique prefix. Only numbers, letters, and underscores please!
 */
$table_prefix = 'wp_';

/*
 * For developers: WordPress debugging mode.
 *
 * Change this to true to enable the display of notices during development.
 * It is strongly recommended that plugin and theme developers use WP_DEBUG
 * in their development environments.
 *
 * For information on other constants that can be used for debugging,
 * visit the Codex.
 *
 * @link https://codex.wordpress.org/Debugging_in_WordPress
 */
define( 'WP_DISABLE_FATAL_ERROR_HANDLER', false );
define( 'WP_DEBUG', false );
define( 'WP_DEBUG_LOG', false );
define( 'WP_DEBUG_DISPLAY', false );
define( 'SAVEQUERIES', false );

/*
 * Custom WordPress Install Path.
 */
// Sets the site's admin location and the site's location, respectively.
define( 'WP_SITEURL', 'https://yourdomainname.com/wp' );
define( 'WP_HOME', 'https://yourdomainname.com' );
// Sets the content location, related to what's defined on composer.json file.
define( 'WP_CONTENT_DIR', dirname( __FILE__ ) . '/wp-content' );
// Sets the plugins location, related to what's defined on composer.json file.
define( 'WP_CONTENT_URL', WP_HOME . '/wp-content' );
define( 'WP_PLUGIN_URL', WP_CONTENT_URL . '/plugins' );
// Disables the embebeded editor.
define( 'DISALLOW_FILE_EDIT', true );
define( 'DISALLOW_FILE_MODS', true );
define( 'RELOCATE', true );
// Disables automatic update functions.
define( 'AUTOMATIC_UPDATER_DISABLED', true );
define( 'WP_AUTO_UPDATE_CORE', false );

/*
 * SSL
 * You might want to force SSL on the admin page
 */
define( 'FORCE_SSL_ADMIN', true );

// That's all, stop editing! Happy publishing.

// Absolute path to the WordPress directory.
if ( ! defined( 'ABSPATH' ) ) {
	define( 'ABSPATH', dirname( __FILE__ ) . '/' );
}

/** Sets up WordPress vars and included files. */
require_once ABSPATH . 'wp-settings.php';

Le fichier composer.json

Pour cette étape, il est important de reprendre les mêmes emplacements que ceux définis dans le fichier « wp-config.php » (étape précédente). En cas d’erreur, pensez à vérifier la concordance des deux fichiers.

Dans le fichier « composer.json », nous allons indiquer les paquets à installer, leur dépôt distant (où récupérer les fichiers) et les dossiers d’installation.

Require

Dans la partie « require », nous indiquons les paquets à installer :

  • le premier permet de configurer des chemins d’installation personnalisés
  • wordpress
  • « core-fr_fr » pour la traduction française
  • un thème, ici twentytwenty, mais vous pouvez en utiliser un autre
  • un plugin, de même vous pouvez le remplacer, il est là pour la démonstration
  "require": {
    "composer/installers": "~1.0",
    "wordpress/wordpress": "5.3.2",
    "koodimonni-language/core-fr_fr": "*",
    "wpackagist-theme/twentytwenty": "*",
    "wpackagist-plugin/akismet": "dev-trunk"
  },

Repositories

Dans la partie « repositories », nous indiquons les différents dépôts distants :

Voici le détail :

  "repositories": [
    {
      "type": "composer",
      "url": "https://wpackagist.org"
    },
    {
      "type": "package",
      "package": {
        "name": "wordpress/wordpress",
        "type": "webroot",
        "version": "5.3.2",
        "source": {
          "url": "https://github.com/WordPress/WordPress.git",
          "type": "git",
          "reference": "5.3.2"
        },
        "require": {
          "fancyguy/webroot-installer": "^1.0.0"
        }
      }
    },
    {
      "type": "composer",
      "url": "https://wp-languages.github.io"
    }
  ],

Config

Ici, nous allons indiquer où installer le dossier « vendor ».

  "config": {
    "vendor-dir": "htdocs/wp-content/vendor"
  },

Extra

Dans la partie « extra » nous indiquons les différents chemins d’installation :

  • les paquets de type « wordpress-plugin » iront dans htdocs/wp-content/plugins
  • les paquets de type « wordpress-theme » iront dans htdocs/wp-content/themes
  • le noyau de WordPress ira dans htdocs/wp
  • les fichiers de traduction iront dans htdocs/wp-content/languages

Voici le détail :

  "extra": {
    "installer-paths": {
      "htdocs/wp-content/plugins/{$name}/": [
        "type:wordpress-plugin"
      ],
      "htdocs/wp-content/themes/{$name}/": [
        "type:wordpress-theme"
      ]
    },
    "webroot-dir": "htdocs/wp",
    "webroot-package": "wordpress/wordpress",
    "wordpress-install-dir": "htdocs/wp",
    "dropin-paths": {
      "htdocs/wp-content/languages/": [
        "vendor:koodimonni-language"
      ],
      "htdocs/wp-content/languages/plugins/": [
        "vendor:koodimonni-plugin-language"
      ],
      "htdocs/wp-content/languages/themes/": [
        "vendor:koodimonni-theme-language"
      ]
    }
  }

Le fichier final

{
  "name": "armandphilippot/wordpress",
  "description": "WordPress installation with Composer",
  "keywords": [
    "wordpress", "composer"
  ],
  "version": "1.0.0",
  "license": "GPL-2.0-or-later",
  "authors": [
    {
      "name": "Armand Philippot",
      "homepage": "https://www.armandphilippot.com/"
    }
  ],
  "type": "project",
  "require": {
    "composer/installers": "~1.0",
    "wordpress/wordpress": "5.3.2",
    "koodimonni-language/core-fr_fr": "*",
    "wpackagist-theme/twentytwenty": "*",
    "wpackagist-plugin/akismet": "dev-trunk"
  },
  "repositories": [
    {
      "type": "composer",
      "url": "https://wpackagist.org"
    },
    {
      "type": "package",
      "package": {
        "name": "wordpress/wordpress",
        "type": "webroot",
        "version": "5.3.2",
        "source": {
          "url": "https://github.com/WordPress/WordPress.git",
          "type": "git",
          "reference": "5.3.2"
        },
        "require": {
          "fancyguy/webroot-installer": "^1.0.0"
        }
      }
    },
    {
      "type": "composer",
      "url": "https://wp-languages.github.io"
    }
  ],
  "config": {
    "vendor-dir": "htdocs/wp-content/vendor"
  },
  "extra": {
    "installer-paths": {
      "htdocs/wp-content/plugins/{$name}/": [
        "type:wordpress-plugin"
      ],
      "htdocs/wp-content/themes/{$name}/": [
        "type:wordpress-theme"
      ]
    },
    "webroot-dir": "htdocs/wp",
    "webroot-package": "wordpress/wordpress",
    "wordpress-install-dir": "htdocs/wp",
    "dropin-paths": {
      "htdocs/wp-content/languages/": [
        "vendor:koodimonni-language"
      ],
      "htdocs/wp-content/languages/plugins/": [
        "vendor:koodimonni-plugin-language"
      ],
      "htdocs/wp-content/languages/themes/": [
        "vendor:koodimonni-theme-language"
      ]
    }
  }
}

Le fichier .gitignore

Dans le fichier « .gitignore », nous allons indiquer à Git d’ignorer certains fichiers et dossiers.

# Ignorer le répertoire wp
htdocs/wp/

# Ignorer le contenu du répertoire wp-content
htdocs/wp-content/*

# Ignorer le dossier vendor de Composer
htdocs/wp-content/vendor

# Ne pas ignorer le répertoire themes, mais ignorer son contenu
!htdocs/wp-content/themes
htdocs/wp-content/themes/*

# Ne pas ignorer notre thème
!htdocs/wp-content/themes/twentytwenty

# Ne pas ignorer le répertoire plugins, mais ignorer son contenu
!htdocs/wp-content/plugins
htdocs/wp-content/plugins/*

# Ne pas ignorer ce plugin
!htdocs/wp-content/plugins/akismet

Initier Git et lancer l’installation

Tout est prêt. Il nous reste deux étapes : initier Git et lancer l’installation via Composer.

À la racine du projet :

// Git
git init

// Composer
composer install

Vous pouvez maintenant utiliser Git pour versionner votre projet ! Si vous avez des paquets à mettre à jour, il vous suffira de lancer la commande composer update dans votre terminal.

Dépôts contenant les fichiers

J’ai créé deux repos : un sur Github, l’autre sur Gitlab. Vous pouvez récupérer les fichiers de base pour installer WordPress. Il ne vous reste plus qu’à configurer le fichier « composer.json » pour qu’il corresponde à vos besoins en termes de thèmes et plugins notamment.

Installation en local avec LAMP sur Manjaro

Si vous avez suivi mes précédents articles pour installer LAMP sur Manjaro, vous aurez encore quelques modifications à faire pour faire fonctionner WordPress.

Des extensions PHP pour le traitement des images

Pour gérer la bibliothèque de média, WordPress a besoin de deux paquets supplémentaires : « php-imagegick » et « php-gd ».

// Installons les paquets
sudo pacman -S php-imagick php-gd

// Éditons le fichier de configuration de php pour activer 2 extensions
sudo mousepad /etc/php/php.ini

// Décommenter :
;extension=exif
(ligne 913)
;extension=gd
(ligne 916)
// Éditions le fichier de configuration d’imagick pour l’activer.
sudo mousepad /etc/php/conf.d/imagick.ini

// Décommenter
;extension=imagick

Le dossier uploads

Apache fonctionne sans modifier le propriétaire du dossier, mais si vous n’arrivez à pas télécharger des images dans votre bibliothèque de média, il faut changer les permissions.

Rappel : les instructions ci-dessous s’adressent aux utilisateurs de Manjaro.

// Ajoutez-vous au groupe http (remplacez username)
sudo usermod -aG http username
// ne pas oublier -a, sinon tous les autres groupes sont supprimés

// Donner les droits nécessaires au groupe http pour le dossier wp-content
setfacl -Rdm u:http:rwx wp-content

// On crée le dossier uploads dans wp-content
mkdir wp-content/uploads

Vous pouvez maintenant mettre en ligne vos fichiers. Si vous allez dans le dossier « wp-content », vous pouvez voir que le dossier « uploads » possède les droits d’écriture pour les groupes. Avec getfacl, vous verrez que le dossier appartient bien à l’utilisateur « http » (Apache). Lorsque vous mettrait en ligne des fichiers, ces derniers appartiendront à l’utilisateur « http » et au groupe « http ».

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.