Synology [TUTO] Installer Wordpress sur votre NAS Synology avec un Serveur Web - Part 01

morgyann

Grand Maître Jedi
2 Février 2023
1 177
228
98
BZH
Après pas mal de recherche sur la toile, je n'ai trouvé que très peu de tuto pour installer Wordpress (WP) de façon "classique" (via un serveur web) sur un Nas (Synology pour ce tuto).
Aussi, je vous conseille ce type d'installation "classique" plutôt que d'utiliser le package WP. Ce dernier est, à mon avis, inutilisable : version en retard -> donc vos plugins et thème (à jour) fonctionneront mal - les modifications nécessaires (ouvrir par ex sur son seul NDD) sont compliquées à opérer - le transfert de votre site d'un Nas à l'autre ou chez un hébergeur sera des + compliqués …


L'avantage de l'auto-hébergement, c'est que c'est gratuit :) - que vous n'êtes pas limité par le volume - que les vitesses d'upload et d'intervention sur vos fichiers et votre configuration se feront en direct (pas de latence de transfert) - vous pouvez sauvegarder et transférer votre site en peu de temps …
Les inconvénients : c'est que il vous faudra un peu "mettre les mains dans le cambouis" - (chez les hébergeurs c'est en un clic) - et que vous vous êtes tributaire d'éventuelles pannes de courant ou d'internet ou de matériel et de votre débit montant.


Étape 1 : Installer les applications (Centre de Paquets) et les fichiers (Wordpress)



Télécharger et activer les paquets suivants (dans l’ordre) : Web-Station, Apache HTP, MariaDB 10 (+créer un mot de passe), PHP 8.2, phpMyAdmin, Éditeur de texte.
Télécharger Wordpress sur le site https://fr.wordpress.org/download/ (en français).​

Image01 : Création du MDP de MariaDB

WP01.png
Image02 : Paquets installés

WP02.png

Quelles sont les fonctions de ces Paquets (vulgarisation) :

Web-Station : Console de configuration du serveur web
Nginx (installé par défaut) ou Apache (paquet à installer) : c'est le serveur web qui permet de "diffuser" vos ressources (fichiers par ex) par le protocole http(s) -> sur le logiciel navigateur (ex Chrome, Firefox, Edge ...) de votre PC, Mac, Android etc Attention : Nginx sur DSM génère un dysfonctionnement pour "l'API JSON WP" (connexion pour mise à jour d'extension par ex) - donc installez Apache.
MariaDB : DB = Base de Données - c'est le système de gestion de la base de données de votre application - si votre application nécessite une base de données (stockage, mise en correspondance, classement ...) comme par ex Plex, WP ou autre app. Le nom le + connu de ce type de système de DB est MySQL
PHP : est un langage de programmation informatique pour produire des pages web.
phpMyAdmin : c'est une application web pour gérer les systèmes de gestion de DB (MariaDB ou MySQL) en programme PHP -> création de DB, insertion, modification etc.


En installant la console Web-Station, un dossier partagé « web » a été créé automatiquement. Transférez via SMB (par ex) le dossier compressé WP (Wordpress) dans le dossier « web » du Nas et décompressez le.​

WP03.png
WP04.png

Vous pouvez aussi changer le nom de ce dossier WordPress si vous le souhaitez (à faire à cette étape et de préférence en minuscule et sans espace) - ou si vous souhaitez installer plusieurs sites / apps web sur le serveur web - (afin de les reconnaître et les personnaliser). Si vous changez le nom, il faut le faire à cette étape.​
WP05.png



Étape 2 : Configurer le serveur web (1)




Ouvrez Web-Station - État normal - Nginx est activé par défaut pour DSM mais nous utiliserons Apache (pour les raisons indiquées en début) - nous utiliserons PHP 8.2 (le + récent) - et PHP 8.0 sera activé aussi pour phpMyAdmin.​

wprectif1.png


Configurez le Profil PHP dans l'onglet Paramètres du langage de script – Cliquez sur "Créer"
Remplissez les champs « Profil » et « Description » et sélectionnez PHP 8.2 et "activez le cache PHP" puis « suivant »

WP07.png

Cochez les extensions suivantes : curl, exif, gd, iconv, imagick, intl, mysqli, openssl, pdo_mysql, zip, zlib (vous pourrez par la suite en rajouter si vous en avez besoin). Puis suivant,

WP08.png

Paramètres FMP (laissez par défaut - vous pourrez aussi modifier par la suite si besoin) et suivant,

Configurer les paramètres du cœur seront aussi à modifier par la suite (si besoin) voir partie 2 du tuto.

WP09.png

Et confirmer les paramètres. Mon profil PHP est "disponible" pour "Mon Tuto WP"

WP10.png




Rendez-vous maintenant sur l’onglet « Service Web » et cliquez sur créer et choisissez « Site web en langage script natif » et sélectionnez dans "Service" le Profil PHP que vous venez de créer (dans mon cas : "Mon Tuto WP") puis suivant :

WP11.png

Remplissez les champs (nom en minuscule sans espace) et description puis sélectionnez votre dossier (décompressé et éventuellement renommé - dans l'exemple c'est mon-tuto-wordpress) et choisissez le serveur web Apache :

wprectif2.png
Sélectionnez suivant

WP13.png

Validez les permissions au dossier - nous irons vérifier par la suite - et cliquez sur Créer,

WP14.png


WP15.png
Nous reviendrons sur cette console afin de définir l'adresse de "diffusion" de notre site.
Nous allons maintenant créer la base de données avec l'application phpMyAdmin (pour nous simplifier ce type d'opération).



Étape 3 : Création d'une Base de Données



Cliquez sur l'icône navire phpMyAdmin, et une page web doit s'ouvrir dans un nouvel onglet. Si votre DSM est sous votre adresse locale par ex : http://192.168.1.20:5000 l'onglet s'ouvrira à http://192.168.1.20/phpmyadmin - Si votre DSM est sous un DDNS (ou NDD) type https://monnas.i234.me (sans le port dédié) l'onglet s'ouvrira à https://monnas.i234.me/phpmyadmin. Si votre accès à DSM est du type https://monnas.i234.me:5001 utilisez l'adresse locale précédemment indiquée (en gras).
Indiquez « root » en utilisateur et le mot de passe créé lors du lancement du paquet MariaDB​

Imagewp13.png

Sur la colonne de gauche, cliquez sur « nouvelle base de données » et donnez un nom à celle-ci - et cliquez sur le bouton créer

WP16.png

Ma Base de Données est créée et apparaît (mon-tuto-wp) dans la colonne de gauche et nous allons ouvrir l'onglet Privilèges pour affecter un utilisateur à cette DB

WP17.png

Cliquez sur "Ajouter un compte d'utilisateur" et remplissez les cases "Nom d'utilsateur" "Mot de passe et saisir à nouveau"
IMPORTANT : cochez la case Privilèges globaux -> tout cocher (cela vous permettra d'avoir les privilèges nécessaires si vous transférez votre DB sur une autre machine serveur ou modifier celle ci -> changement de NDD ou autres).
IMPORTANT : En bas de la page (à gauche - n'apparait pas sur la capture) cliquez sur le bouton "Exécuter"

WP18.png

On vous indique (bandeau jaune) qu'un utilisateur a été ajouté - voilà vous pouvez fermer cet onglet phpMyAdmin de votre navigateur - et revenir à DSM et ouvrir "File Station"​



Étape 4 : Configurer les droits à votre dossier WP Web



Il s'agit de vérifier que les droits d'accès à notre dossier WP soient bien autorisés.

Dossier "web" (clic droit) "propriétés" -> "permissions" vérifiez que les permissions sont en clair (http et administrators) - cochez la case "appliquez à ce dossier …" et "Sauvegarder".​

WP19.png

Rendez-vous maintenant sur votre "sous dossier" wordpress (que j'ai renommé mon-tuto-wordpress) - même manip que précédemment - cliquez sur "Options Avancées" et rendez les permissions explicites (pour qu'elles apparaissent en clair)

WP20.png


Créer (Bouton en haut à gauche) l'utilisateur SYSTEM et donnez lui les droits en lecture et écriture

WP21.png

Et cochez la case "appliquez à ce dossier ..." et "Sauvegarder".



Étape 5 : Configurer le serveur web (2)



Tout est prêt maintenant pour configurer mon site ... Mais, comment je vais bien pouvoir me connecter dessus ? :unsure:

Il me faut lui affecter une adresse web -> Ouvrez à nouveau la console "Web Station" - onglet "Portail Web" et cliquez sur "Créer". Sur la fenêtre qui s'ouvre sélectionnez Portail de services Web

WP22.png


Pour "Service :" sélectionnez php (logo) avec le nom attribué (ou pas) à wordpress.

Faites apparaitre le menu déroulant de "Type de Portail"

WP23.png

3 propositions apparaissent et vous devez faire un choix en fonction de votre projet .

ATTENTION : Une fois le site WP configuré (donc la Base de Données avec), la modification du NDD (nom) ou du type de portail d'accès est possible. Cependant, cette opération est "délicate" et pourra vous sembler compliquée si vous débutez (objet du Tuto).


1. Basé sur le nom - mode classique - c'est pour pouvoir accéder et consulter votre site sur une adresse type (et qu'il puissent être indexé par les moteur de recherche pour le trouver sur une page de recherche en tapant simplement : mon super blog (y)).
Il faut que vous ayez un Nom De Domaine (NDD) du type monsuperblog.fr ou genial.monsuperblog.fr ou un DDNS ou Wildcard (comme Synology par ex) du type monnas.i234.me ou blog.monnas.i234.me. Ce NDD ou DDNS doit être certifié (certificat) et mis en correspondance avec le service web sur le serveur (le NAS) - DSM -> Panneau de Conf -> Sécurité -> Certificat.
Le Port 443 devra être ouvert sur votre Box (fonction routeur) en correspondance avec l'adresse locale du Nas (ex : 192.168.1.20)

WP24.png

Dans la case "Nom d'hôte", vous indiquez votre NDD (sans https:// devant celui-ci) et Créer.


2. Basé sur le port - mode semi-privé ou test - Dans ce cas, vous accéderez à votre site avec un port spécifié du même type que si vous accéder à votre DSM (configuration d'origine) -> pour DSM c'est - en mode local -> http://192.168.1.20:5000 et en mode public -> https://monnas.i234.me:5001
Dans ce cas, si c'est uniquement pour un accès local, vous cochez uniquement http et indiquez un port de votre choix (par ex ici : 6500) - et vous accéderez à votre site en tapant par ex http://192.168.1.20:6500.
Si vous souhaitez un accès local et extérieur - vous indiquez (en cochant les cases correspondantes) - par ex HTTP : 6500 et HTTPS : 6501 (ouvrir ce port dans votre Box/Routeur) et dans ce cas vous accéderez à votre site de la même manière que à DSM à savoir : https://monnas.i234.me:6501 (le DDNS ou NDD doit être certifié et mis en correspondance du service).
(Pour les utilisateurs + avancés) - vous pouvez définir un port pour votre WP et utiliser le Proxy Inversé pour le connecter sur un NDD (opérez cette manip avant la configuration afin de l'ouvrir sur le NDD choisit).

WP25.png



3. Basé sur un alias - c'est du même type que basé sur un port simplement dans ce cas vous choisissez un nom par ex : blog et, vous accéderez à votre site en tapant en local -> http://192.168.1.20/blog et en mode public (extérieur) -> https://monnas.i234.me/blog.
Cela fonctionne comme la solution n°2 (sur le port) mais à la place de finir votre adresse par ":6501" vous mettez "/blog"
NB Quand vous installez WP via le Centre de Paquet, c'est de cette manière que votre WP s'installe (déconseillé par la version installée - voir en préambule du Tuto).
WP26.png


Suivant l'option de connexion à votre site que vous avez choisie, ouvrez un onglet sur votre navigateur préféré et tapez l'adresse :

WP27.png

Si cette page apparaît, c'est que la configuration de base c'est bien passée ;) (y)

Pour cette démo, j'ai ouvert ma page en local avec l'adresse locale du Nas 192.168.1.3 suivi d'un alias /blog - comme indiqué précédemment - je déconseille de configurer votre WP sous cette forme.

Pour la Partie 2 de ce tuto, je fais le choix de me connecter sur un NDD -> https://web.monndd.bzh

WP28.png


 

Pièces jointes

  • WP02.png
    WP02.png
    69.4 KB · Affichages: 3
Dernière édition:
@morgyann merci pour ce super tuto 👍🏻
Ps : pour tes captures d’écran, tu peux utiliser des applications comme Greenshot (Windows), Flameshot (macOS) pour faire des zones de flou, ça évite de devoir passer 100 fois avec un crayon sur ce qui ne souhaite pas laisser affiché, et et qui peut quand même être déchiffré 🤣
Il existe pléthore d’applications pour ça avec des annotations possibles.
Sur macOS la préférence va à CleanShot (payant).
je ne me souvient pas de l’outils sous Windows dont avait parlé @FX Cachem dans un de ces articles , et que @EVO apprécie beaucoup, mais il avait détrôné Greenshot quand j’utilisais encore beaucoup Windows.
Édit :
ha trouvé , c’est Clowd :
Mais cet outils ne semble plus maintenu et n’a pas eu de mise à jour depuis plus de 2 ans …
 
pour tes captures d’écran, tu peux utiliser des applications
J'utilise rarement les captures d'écran - (j'ai Grennshot mais pas encore expérimenté) - donc je suis allé avec mes basiques (touche clavier - crayon - copier/coller). Il faut que je regarde le fonctionnement de ce type d'app pour faire de belles capture d'écran (sans gribouillis) 🎨🖼️- pour de prochains tutos.
 
Merci pour le tuto !!

Perso j’éviterais d'installer un Wordpress sur un NAS si c'est ouvert publiquement sur le monde extérieur, sans l'isoler un minimum du reste de l'OS (par exemple avec Docker).
Les sites Wordpress sont très ciblés par les attaques et même bien configuré et a jour, il n'est pas exclu qu'un pirate arrive parfois a y insérer un malware dans le code source...

Il faut au minimum y ajouter un ou des plugins de sécu comme : Solid Security Basique + Sucuri Security

Et surtout les configurer pour faire du reporting par email en cas de changement aux niveaux des plugins (suppression, ajout...) ou des fichiers de wordpress.
Il peuvent aussi détecter l'insertion de malware Javascript dans le code.
Ses plugins gèrent le Brut force entre autres et bloque les IP.

Il faut aussi blinder la configuration du '.htaccess' à la racine du site si possible et bien sur activer la 2FA pour la gestion et supprimer le compte 'admin' par défaut.

Il est aussi indispensable d'ajouter un plugin de backup journalier du site (UpdraftPlus - Sauvegarde/Restauration), car en cas de hack, c'est la seule solution pour revenir à n - jours.
Suite a un hack, il y a souvent une multitude de fichier PHP parasite obfusqués cachés partout dans des répertoires de Wordpess, donc une vrai galère pour nettoyer tout a la main et possible que le BD soient corrompues aussi avec de l'insertion de code Javascript ....

Le dernier hack que j'ai pu observer sur un site Wordpress, le pirate avait supprimé les plugins de sécu installés. En regardant les logs brut de son scan chez l’hébergeur, je n'ai toujours pas compris comment il a pu passer car tout était à jour coté Wordpress et pas de trace de connexion avec les comptes admin... J'ai bloqué son IP et restauré le site en J-2.
Le hack n'était pas visible (le site était 100% opérationnel), sans doute transformé en serveur 'zombie' mais difficile à dire avec du code obfusqués...
 
Dernière édition:
Bonjour j'ai essayer de suivre votre tuto pour mon installation mais j'ai un petit problème, lorsque j'essaye d'accéder au paquet PhpMyAdmin je rencontre une page d'erreur Synology m'indiquant que la page est introuvable (mondomaine/phpmyadmin. Cependant lorsque je teste avec https://iplocal/phpmyadmin aucun soucis. Pour info j'ai un reverse proxy de config avec une règle qui redirige mondomaine:443 vers iplocalnas:portlocal. après avoir regarder je ne trove pas d'option pour rajouter un chemin sur la règle pour rediriger /phpmyadmin.
Ps : même en désactivant mon reverse proxy toujours le même problème, est ce que quelqu'un serait quel pourrait être le pb ? Et comment le corriger ?
 
Bonjour j'ai essayer de suivre votre tuto pour mon installation mais j'ai un petit problème, lorsque j'essaye d'accéder au paquet PhpMyAdmin je rencontre une page d'erreur Synology m'indiquant que la page est introuvable (mondomaine/phpmyadmin. Cependant lorsque je teste avec https://iplocal/phpmyadmin aucun soucis. Pour info j'ai un reverse proxy de config avec une règle qui redirige mondomaine:443 vers iplocalnas:portlocal. après avoir regarder je ne trove pas d'option pour rajouter un chemin sur la règle pour rediriger /phpmyadmin.
Ps : même en désactivant mon reverse proxy toujours le même problème, est ce que quelqu'un serait quel pourrait être le pb ? Et comment le corriger ?
De plus, je tiens à préciser, ça a peut-être sûrement un lien aussi. J’accède à mon DSM via mondomaine.fr:443 avec un certificat letsencrypt directement.
Pour mon WP que je veux mettre en place, au moment de la création du VH (portail web) en nom de domaine j’ai indiqué blog.mondomaine.fr car c’est le nom auquel je veux que mon site réponde.
Je dis juste ça comme ça pour donner plus d’infos cela a peut être un lien avec mon pb rencontrés plus haut !
Je suis preneur d’aide et de conseils.
Merci d’avance
 
Bonjour,
Voir réponse sur l'autre poste :
 
Mise à jour du Tuto : Nginx sur DSM génère un dysfonctionnement pour "l'API JSON WP" signalé dans Panneau de conf -> Outils -> Santé du site (connexion pour mise à jour d'extension par ex) - donc installez Apache.

Après pas de recherche sur le web, la "réparation" de ce dysfonctionnement, spécifique de Nginx/DSM pour WP, doit s'effectuer en SSH (opération complexe qui s'éloigne de l'objet de ce Tuto). Aussi, rien ne garanti la stabilité de cette modification en cas de mise à jour de DSM.

Ci-après un lien sur Reddit d'une solution pour la réparation de ce dysfonctionnement.
 
Dernière édition: