Installation d’un projet WordPress : du Repository au composer.json

Pour finaliser la configuration de notre projet WordPress, nous allons avoir besoin de 2 fichiers :

• index.php : Nous créons ce nouveau qui sera placé dans le dossier website. C’est vers ce fichier que votre vhost devra pointer et qui sera le point d’entrée de notre application. Ce dernier ne fera que cibler le fichier index.php d’un projet WordPress classique qui se situe dans wordpress-code/index.php.
• wp-config.php : C’est dans ce fichier que se trouve la configuration de notre site WordPress, comme par exemple l’URL de notre site, du back-office etc. Il ne nous reste plus qu’à configurer ce dernier. Pour cela, copiez le fichier wp-config-sample.php qui se trouve dans le dossier wordpress-core, collez-le à la racine du dossier website et renommez-le en wp-config.php.

A cette étape, l’arborescence de votre projet devrait être la suivante :

<?php

require_once __DIR__ . '/wordpress-core/index.php';

<?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:
 *
 * * Database settings
 * * Secret keys
 * * Database table prefix
 * * ABSPATH
 *
 * @link https://wordpress.org/documentation/article/editing-wp-config-php/
 *
 * @package WordPress
 */

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

/** Database username */
define( 'DB_USER', 'username_here' );

/** Database password */
define( 'DB_PASSWORD', 'password_here' );

/** Database 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', '' );

<?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:
 *
 * * Database settings
 * * Secret keys
 * * Database table prefix
 * * ABSPATH
 *
 * @link https://wordpress.org/documentation/article/editing-wp-config-php/
 *
 * @package WordPress
 */

define('DIR_VENDOR', __DIR__.'/vendor/');

// Autoloader
if (file_exists(DIR_VENDOR . 'autoload.php')) {
    require_once(DIR_VENDOR . 'autoload.php');
}

$dotenv = Dotenv\Dotenv::createImmutable(__DIR__);
$env = $dotenv->load();

// ** Database settings - You can get this info from your web host ** //
/** The name of the database for WordPress */
define( 'DB_NAME', $env['DATABASE_NAME'] );

/** Database username */
define( 'DB_USER', $env['DATABASE_USER'] );

/** Database password */
define( 'DB_PASSWORD', $env['DATABASE_PASSWORD'] );

/** Database hostname */
define( 'DB_HOST', $env['DATABASE_HOST'] );

/** 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', '' );

Le dossier wp-content

Arrêtons-nous un moment sur ce dossier qui est essentiel au bon fonctionnement de notre site.

WordPress attend un dossier wp-content qui se situe nativement dans wordpress-core/wp-content. C’est dans ce dossier que se trouve nos thèmes, nos plugins ainsi que tous les médias qui sont affichés sur notre site (images, vidéos etc.).

A chaque fois que WordPress est installé via le composer.json ou mis à jour, ce dossier sera écrasé ce que nous ne souhaitons pas. Il existe une solution pour palier à ce problème. Précédemment, nous avons créé un dossier app, c’est dans ce dernier que nous mettrons tout le contenu du dossier wp-content attendu par WordPress.

Il faut donc indiquer à WordPress que le contenu du dossier wp-content se trouve maintenant dans le dossier website/app grâce aux lignes ci-dessous que nous ajouterons entre les lignes /* Add any custom values between this line and the "stop editing" line. */ et /* That's all, stop editing! Happy publishing. */

/* Add any custom values between this line and the "stop editing" line. */

/** Define a custom path to the config.php file */
if ( ! defined( 'ABSPATH' ) ) {
    define( 'ABSPATH', __DIR__ . 'wp-config.php/');
}

/** Define a custom default theme */
define( 'WP_DEFAULT_THEME', 'hugo-wp' );

/** Define a custom content directory */
define ('WP_CONTENT_DIR', __DIR__ . '/app');
define ('WP_CONTENT_URL', $env['WP_CONTENT_URL'] . 'app');
define( 'WP_SITEURL',  $env['WP_SITEURL'] . 'wordpress-core/');

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

Quelques explications s’imposent. Revenons sur ce package que nous avons installé au début : vlucas/phpdotenv. Mais à quoi sert-il ? Il nous permet d’interpréter un fichier.env dans lequel nous indiquerons des informations sensibles à notre projet (nom de la base de données, mots de passe etc.). Voici un aperçu du contenu du .env :

DATABASE_NAME='nom-de-votre-database'
DATABASE_USER='votre-username'
DATABASE_PASSWORD='votre-password'
# En local ce sera simplement 'localhost'
DATABASE_HOST='votre.host.com'

WP_CONTENT_URL='http://example.local/'
WP_SITEURL='http://example.local/'

Puis nous allons charger le package lucas/phpdotenv dans notre fichier wp-config.php, ce qui va nous permettre de récupérer toutes ces données sensibles de manière anonyme dans la variable $env.

<?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:
 *
 * * Database settings
 * * Secret keys
 * * Database table prefix
 * * ABSPATH
 *
 * @link https://wordpress.org/documentation/article/editing-wp-config-php/
 *
 * @package WordPress
 */

define('DIR_VENDOR', __DIR__.'/vendor/');

// Autoloader
if (file_exists(DIR_VENDOR . 'autoload.php')) {
    require_once(DIR_VENDOR . 'autoload.php');
}

$dotenv = Dotenv\Dotenv::createImmutable(__DIR__);
$env = $dotenv->load();

Vous pouvez maintenant sauvegarder le fichier wp-config.php sur votre Github tout en gardant le fichier .env bien au chaud sur votre ordinateur. Attention de bien ajouter une ligne dans votre .gitignore pour ignorer le fichier .env et ne pas qu’il soit envoyé sur votre Repository Github.

Si vous travaillez avec d’autres développeurs, il faudra leurs communiquer discrètement (par mail, Teams, Zoom, téléphone etc.) les détails de votre fichier .env. Cela permet de préserver un certain niveau de sécurité sur vos apps et de protéger vos données sensibles.