Planty

Personnalisez un thème WordPress pour une startup avec HTML, CSS et PHP

Projet 6: Planty Projet 6: Planty Projet 6: Planty

Projet 6 de la formation "Développeur WordPress" d'OpenClassrooms

Détails du projet

Je suis contacté par Clara, ma cheffe de projet qui est en charge du client Planty ainsi que Idriss, le UI Designer qui a créé la maquette du projet.

Planty a besoin d’un site pour présenter son activité ainsi que pour obtenir des premières précommandes.

Leur objectif à terme est d’avoir un site e-commerce, mais ce n’est pas pour tout de suite !

Il y a quelques contraintes imposées pour réaliser le site Planty:

- Celui-ci devra être réalisé avec WordPress. Du code HTML, PHP, et CSS pourra cependant être ajouté.

- Le site doit s’afficher correctement sur toutes les tailles d’écran, à savoir desktop, tablette et téléphone à partir de 320 pixels.

- Le projet devra être versionné avec Git et GitHub.

- Les lignes écrites en HTML et CSS doivent passer au validateur du W3C.

Processus de réalisation du projet

Pour la réalisation de ce projet, je commence tout d'abord par choisir le thème "Blankslate" qui me permettra de partir de 0, à partir de celui-ci, je crée un thème enfant que je pourrais personnaliser à ma guise.

Je choisis ensuite mes plugins pour réaliser ce dont j'ai besoin, à savoir:

- Elementor et ses addons pour créer les différents blocs.

- Contact Form 7 pour les formulaires de contact des pages "Nous rencontrer" et "Commander".

Puis je peux commencer à créer mon header, qui disposera d'un menu burger appelé sur Bootstrap. Celui-ci possèdera aussi un bouton d'administration ajouté grâce à un hook, seulement visible par les administrateurs connectés.

J'ajoute aussi mon footer, à la fin de mon body, grâce à un appel de mon menu footer créé en Backoffice et lié dans mon functions.php.

Dans ce même functions.php, je relie mon CSS.

Pour tout ce qui est esthétique, je réaliserai suite à cela les différents blocs avec leurs responsive à chaque fois pour qu'ils collent un maximum à la maquette.