Vous l’aurez peut-être remarqué, mais le blog vient d’atteindre sa 7ème itération en 22 ans d’existence.
J’en avais un peu marre de mon ancien thème basé sur des widgets, que je trouvais difficile à faire évoluer. Sa structure reposait sur une base Timber / webpack vieillissante et particulièrement lourde. Et puisqu’on parle de lourdeur, l’interface et les temps de chargement étaient clairement pénalisants, notamment au regard des scores Google PageSpeed.
Du coup, je me suis un peu aidé de ChatGPT pour accélérer le développement et trouver des idées de design. J’ai aussi basculé sur un child theme basé sur Twenty Twenty-Five booster avec Vite, que je déploie automatiquement via Deploy PHP. Bref, on aime ou on n’aime pas (je suis moi-même encore un peu mitigé), mais au moins, j’ai maintenant une base beaucoup plus simple à faire évoluer rapidement.
Côté extensions, j’ai fait un bon ménage. J’ai supprimé pas mal de choses, comme Contact Form 7 qui faisait doublon avec Jetpack, mais aussi Yoast SEO, qui lui aussi faisait doublon tout en devenant de plus en plus lourd.
Enfin, j’ai remplacé Jetpack Boost par W3 Total Cache, couplé à Cloudflare en CDN via l’extension dédiée W3TC.
Pour ceux qui veulent voir ce qu’il y a sous le capot : le code n’est pas public pour des raisons liées au déploiement automatique. En revanche, j’ai repris un starter kit que j’utilise également sur Borsalinux-Fr et Fedora-fr, que vous pouvez retrouver sur GitHub ici et là.
Concernant le déploiement automatique, je vais partager ici mon deployer.yaml, suivi du deploy-env.php pour la gestion des variables d’environnement, ainsi que mon devops.yaml utilisé pour déployer depuis GitHub.
Le devops.yaml gérant les Github Actions:
name: DevOps
on:
[push]
env:
NODE_LAST_VERSION: '25'
PHP_LAST_VERSION: '8.5'
jobs:
##############################################################################
# Test WordPress theme
#
test_assets:
runs-on: ubuntu-latest
name: Test Assets (javascript and styles)
strategy:
fail-fast: false
matrix:
node-version: ['25']
steps:
- name: Git checkout
uses: actions/checkout@v6
- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v6
with:
node-version: ${{ matrix.node-version }}
cache: 'npm'
cache-dependency-path: package-lock.json
- name: Install dependencies
run: npm install
- name: Run eslint (*.js)
run: npm run eslint
- name: Run stylelint (*.css)
run: npm run stylelint
test_php:
runs-on: ubuntu-latest
name: Test PHP
strategy:
fail-fast: false
matrix:
php-version: ['8.5']
steps:
- name: Git checkout
uses: actions/checkout@v6
- name: Use PHP ${{ matrix.php-version }}
uses: shivammathur/setup-php@v2
with:
php-version: ${{ matrix.php-version }}
tools: composer:v2
- name: Get composer cache directory
id: composer-cache
run: echo "dir=$(composer config cache-files-dir)" >> $GITHUB_OUTPUT
- name: Cache dependencies
uses: actions/cache@v5
with:
path: ${{ steps.composer-cache.outputs.dir }}
key: ${{ runner.os }}-composer-${{ hashFiles('**/composer.lock') }}
restore-keys: ${{ runner.os }}-composer-
- name: Install dependencies
run: composer install --prefer-dist
- name: Run test suite
run: composer run-script test
##############################################################################
# Markdownlint
#
test_markdownlint:
runs-on: ubuntu-latest
name: MarkdownLint
steps:
- name: Git checkout
uses: actions/checkout@v6
- name: markdownlint-cli
uses: nosborn/[email protected]
with:
files: "*.md"
config_file: ".markdownlint.yaml"
##############################################################################
# Deploy
#
deploy:
if: ${{ github.ref == 'refs/heads/main' }}
needs: [
test_assets,
test_php,
test_markdownlint,
]
runs-on: ubuntu-latest
name: Deploy to server
steps:
- name: Git checkout
uses: actions/checkout@v6
- name: Use Node.js ${{ env.NODE_LAST_VERSION }}
uses: actions/setup-node@v6
with:
node-version: ${{ env.NODE_LAST_VERSION }}
cache: 'npm'
cache-dependency-path: package-lock.json
- name: Install dependencies
run: npm install
- name: Deploy
uses: deployphp/action@v1
with:
dep: deploy
private-key: ${{ secrets.DEPLOY_SSH_KEY }}
env:
DEPLOY_USER: ${{ secrets.DEPLOY_USER }}
DEPLOY_TARGET: ${{ secrets.DEPLOY_TARGET }}Le deploy-env.php qui va prendre les secrets de Github pour les injecter en variables Deployer:
<?php
/**
* TTF Material functions and definitions.
*
* @link https://developer.wordpress.org/themes/basics/theme-functions/
*
* @package WordPress
* @subpackage TTF_Material
* @since TTF Material 1.0
*/
namespace Deployer;
set( 'DEPLOY_TARGET', getenv( 'DEPLOY_TARGET' ) );
set( 'REMOTE_USER', getenv( 'DEPLOY_USER' ) );Et le deploy.yaml qui va gérer mon déploiement :
import:
- recipe/common.php
- ./deploy-env.php
config:
application: "ttf-material"
deploy_target: "{{DEPLOY_TARGET}}"
wp_theme_dir: "{{DEPLOY_TARGET}}/www/wp-content/themes"
remote_user: "{{REMOTE_USER}}"
repository: "[email protected]:llaumgui/{{application}}.git"
keep_releases: 5
hosts:
xxx.xxx.fr:
deploy_path: "{{deploy_target}}/{{application}}"
tasks:
assets:build:
- run_locally: "npm run build"
assets:upload:
- run: "mkdir -p {{release_path}}/assets/dist"
- upload:
src: "assets/dist"
dest: "{{release_path}}/assets"
deploy:symlink:
- run: "cp -rf {{release_path}}/* {{wp_theme_dir}}/{{application}}"
- run: "cd {{deploy_path}} && rm release"
deploy:cache:
- run: "cd {{deploy_target}}/www/ && /usr/local/bin/wp w3tc flush all"
after:
deploy:release: assets:build
deploy:update_code: assets:upload
deploy:symlink: deploy:cache
deploy:failed: deploy:unlockÀ noter que W3TC & docker m’empêchent un peu de jouer avec les liens symboliques. Je prends donc le thème et je le copie. Vous pouvez adapter !
