Search
Close this search box.

Construire un portail client avec WordPress

Facebook
Twitter
LinkedIn

Posséder une zone permettant aux utilisateurs de se connecter et de télécharger ou de consulter des documents est devenu une attente des consommateurs, des contrats de téléphone aux services publics. 

Lorsque les designers travaillent avec leurs clients, cependant, tout peut rapidement se décomposer en un fouillis d’emails, de liens vers des maquettes et de pièces jointes.

Ce tutoriel WordPress montrera comment étendre WordPress (d’autres services d’hébergement web sont disponibles) en un portail client capable de stocker des documents, des vidéos et des dessins, afin qu’un client puisse y accéder en un seul endroit. Le portail servira à chaque client avec un lien unique et protégé par un mot de passe qui n’apparaît pas dans la navigation régulière.

 

01. Installer une copie fraîche de WordPress

Une copie fraîche de WordPress est installée sur le serveur de développement, et le thème  » understrap  » a été choisi pour donner une base boilerplate afin de commencer rapidement le travail. Le plugin Custom Post Type UI sera utilisé afin que nos types de post personnalisés soient indépendants du thème.  

 

02. Supprimer les plugins par défaut

Si des plugins par défaut étaient fournis avec la copie de WordPress, supprimez-les. Les plugins nécessaires pour ce tutoriel sont « Advanced Custom Fields » et « Custom Post Type UI ». « Classic Editor » a également été installé.

 

03. Ajouter un type de post personnalisé

Utiliser l’interface Custom Post Type UI, ajouter un nouveau type de post appelé « client ». Lorsque vous saisissez le « Post type slug », utilisez des caractères de soulignement au lieu d’espaces et écrivez au singulier, car cela facilitera la création de modèles par la suite. Le préfixe tu_ a été ajouté pour réduire les risques de conflit.

 

04. L’interface d’ajout/modification de type de post personnalisé 

Ajouter des étiquettes au singulier et au pluriel.

Ajouter un pluriel étiqueté  » clients  » et un singulier  » client « , car cela apparaîtra dans le menu d’administration de WordPress. Les majuscules sont acceptées dans ces champs, ce qui rendra le menu WordPress plus ordonné. 

 

05. Créez un slug de réécriture personnalisé

Utilisez le slug de réécriture personnalisé pour une meilleure expérience utilisateur.

L’utilisation d’un préfixe pour le slug du type de post signifiera que les clients ajoutés au portail seront créés avec un lien qui ressemble à  » /tu_customer/example-company « . Cela n’a pas l’air très ordonné, et le slug de réécriture personnalisé est utilisé pour améliorer cela. Définir le slug de réécriture à « clients » permet au type de post personnalisé d’apparaître comme /customers/example-company.

 

06. Ajouter la prise en charge des champs personnalisés

Cochez l’option « Champ personnalisé » et soumettez les modifications.

La dernière option activée pour le type de post personnalisé est « Prend en charge > ; Champ personnalisé » qui se trouve près du bas de la page. Cochez cette option, puis « add post type » en bas de la page. Cela soumet les modifications et enregistre le type de post.

 

07. Ajouter des champs personnalisés

Maintenant, vous devez ajouter des champs personnalisés à votre nouveau type de post .

Les champs personnalisés doivent maintenant être ajoutés et affectés au type de post qui vient d’être créé. L’ajout d’un groupe de champs nommé « portail client » est la première étape, suivie de l’ajout de champs personnalisés à celui-ci avec le bouton d’ajout de champ. Le premier champ « brief » sera défini comme le type de champ « file », ce qui permet à l’administrateur de télécharger un fichier à cet endroit. Définissez la valeur de retour à « file url ».

 

08. Configurez les champs

Le prochain champ à ajouter est le « questionnaire de la marque. » Il s’agira d’un lien vers un formulaire google que le client devra remplir. Le type de champ le plus approprié pour cela est « URL ».  Cette même méthode peut être utilisée pour tous les champs qui seront liés à un service externe. Une fois terminé, faites défiler jusqu’à la case « emplacement » et utilisez la logique « Afficher si le type de poste » = « Client ». Puis publiez le groupe de champs.

 

09. Créer le fichier de template WordPress

WordPress doit savoir comment afficher un tableau de bord client. Pour cela, on suit la hiérarchie des modèles WordPress pour créer un fichier modèle pour ce type de post spécifique. Créez un fichier appelé single-tu_customer.php dans le répertoire racine du thème.