Développer vos thèmes WordPress sans coder avec Gantry 5 NEW

Objectifs

Cette formation vous permet de concevoir des modèles de page pour un site Wordpress à l'aide du framework Gantry avec très peu de connaissances techniques. Installer et paramétrer Gantry sur un site Wordpress. Utiliser le backoffice de Gantry pour gérer la mise en page et la structure des contenus, rendre le template Gantry responsive grâce à l'utilisation des breakpoints, structurer le code HTML des pages Wordpress et modifier des modules.

Public

Chefs de projet, webdesigners, webmasters ou toute personne souhaitant utiliser Gantry pour structurer un thème pour le CMS Wordpress.

Durée

14 heures en présentiel sur 2 jours

Pré-requis

Savoir installer, paramétrer et utiliser Wordpress et avoir une connaissance du HTML et du CSS est un plus.

Formateur

Formateur, consultant expérimenté spécialiste des CMS.

Méthode pédagogique

8 participants maximum, un poste par stagiaire et un support de cours est remis en fin de stage. La formation est constituée d'apports théoriques, de démonstrations et de mises en pratique basées sur des exercices.

Modalité de validation des acquis

Évaluation en ligne des acquis via un questionnaire. Attestation de fin de stage.

Déroulé

Les fondamentaux

  • Installation du CMS WordPress
  • Mise en place d'un outil de sauvegarde dans WordPress
  • La personnalisation d’un thème WordPress et ses limites

Introduction

  • Installation du Framework Gantry5 dans WordPress
  • Présentation de Gantry5 et de son thème Hydrogen
  • L'interface d'administration de Gantry5
  • Structuration du thème WordPress avec Gantry5

Structure

  • Création et initialisation d’un nouveau gabarit Gantry5
  • Mise en place des éléments WordPress de base dans un gabarit Gantry5
  • Ajout d’une zone de publication d’un Widget WordPress
  • Notion d’héritage de layout, propriétés de sections et assignation de page à un gabarit
  • Concevoir ou personnaliser la page 404 d'un thème WordPress

Les particules Gantry5

  • Présentation des particules installées dans le gabarit "HomePage Particles"
  • Widget WordPress vs Particules directement insérés dans le gabarit Gantry5
  • Exemple de déclaration de position de widget dans un gabarit Gantry5
  • Les particules : Branding, Copyright, Custom HTML, To-top,  Social, Logo, Date, Login, Post
  • Ajouter des particules ATOM (Cookie Consent, WOW, fixed header)
  • Intégrer un Widget Wordpress dans un article ou dans un Widget

Les styles

  • Introduction au langage CSS
  • Préparation et Ajout d'une feuille de style personnalisée
  • Les Classes CSS "utilitaires" de Gantry5
  • Les bases du Responsive Web Design  
  • Les Breakpoints pour une mise en forme Responsive Design dans Gantry5
  • La gestion des menus WordPress dans Gantry5