> formation Compétences métiers > formation Marketing > formation E-commerce > formation Magento 2, personnaliser le design de vos sites de e-commerce

ERROR Avis : La référence d'objet n'est pas définie à une instance d'un objet.
Toutes nos formations E-commerce

Formation Magento 2, personnaliser le design de vos sites de e-commerce

Stage pratique
Durée : 2 jours
Réf : MFE
Prix  2021 : 1510 € H.T.
Pauses et déjeuners offerts
  • Programme
  • Participants / Prérequis
  • Intra / sur-mesure
Programme

Vous connaitrez les différentes techniques permettant de concevoir et mettre en œuvre un CMS d'e-commerce Open Source Magento 2. Vous verrez les aspects d'installation, de customisation du theming Magento, du responsive design, des widgets ainsi que la mise en place de tests front-end et l'internationalisation.

Objectifs pédagogiques

À l’issue de la formation, le participant sera en mesure de :
  • Comprendre l'architecture technique d'un thème Magento 2
  • Connaître les paramètres Magento 2 qui ont une influence sur le rendu
  • Personnaliser de nouveaux thèmes et créer des composants front
  • Mettre en œuvre les bonnes pratiques de développement front

Travaux pratiques

Création d'une plateforme e-commerce côté client.

Méthodes pédagogiques

Alternance entre présentation magistrale, illustrations de cas concrets et travaux pratiques.
PROGRAMME DE FORMATION

Généralités et thèmes

  • Objectif d'un site e-commerce. Fonctionnalités principales de Magento.
  • Les différents modes de gestion.
  • Vue d'ensemble des thèmes.
  • Création d'un thème front-office.
  • Déclarer un logo dans votre gabarit.
  • Configurer les tailles d'images du thème.
  • Création d'un thème back office.

Travaux pratiques
Créer un thème avec l'affectation d'un logo pour le décliner sur le site.

Les layouts

  • Vue d'ensemble des layouts.
  • Les types de layout.
  • Structurer une page layout.
  • Comment déclarer une page layout ?
  • Structurer un thème layout.
  • Les différents blocks et containers.
  • Étendre un layout.
  • Surcharger un layout.

Travaux pratiques
Modifier l'apparence graphique du site en manipulant les layouts.

Templates pour boutique e-commerce

  • Les concepts de base.
  • Vue d'ensemble des templates disponibles.
  • Initialiser un template.
  • Surcharger un template.

Travaux pratiques
Surcharger un template dans notre nouveau thème.

Cascading style sheets (CSS)

  • Less et Grunt
  • Déclarer son thème dans la configuration Grunt.
  • Grunt et LiveReload.
  • Inclure des fichiers CSS.
  • Surcharger et étendre le CSS.
  • Les fonts custom et les variables.
  • Les mixins et Les UI components.

Les widgets, les blocs CMS et le Javascript

  • Comprendre et utiliser RequireJS.
  • Les widgets jQuery.
  • Comprendre et utiliser KnockoutJS.
  • Création d'un widget et d'un bloc CMS en back office.
  • Création d'un widget dans le thème.
  • Déclaration dans un contenu CMS.
  • Déclaration dans un template.
  • Déclaration en layout.

Travaux pratiques
Créer un custom component et un widget personnalisé.

Le responsive design et Magento 2

  • Les solutions responsive design dans Magento.
  • Approche mobile first.
  • Présentation et utilisation des outils responsive design.
  • Impact sur les performances front-end.
  • JavaScript responsive web design.

Travaux pratiques
Créer un thème responsive design.

Les tests front-end

  • Panorama des solutions de test.
  • JsTestDriver et PhpStorm.

Internationalisation et gestion des e-mails

  • Dictionnaires de traductions.
  • Packages de traductions.
  • Ordre de lecture par Magento.
  • Les clés de traduction selon le contexte.
  • Concepts de base des e-mails.
  • Surcharge en back office.
  • Surcharge dans le thème.
Participants / Prérequis

» Participants

Intégrateurs CSS, développeurs front, développeurs full stack souhaitant maîtriser les aspects techniques du design et du rendu d'un site en Magento 2.

» Prérequis

Expérience en JavaScript/intégration CSS. La connaissance de Magento 1 est un plus.
Intra / sur-mesure

Demande de devis intra-entreprise
(réponse sous 48h)

Vos coordonnées

En cochant cette case, j’atteste avoir lu et accepté les conditions liées à l’usage de mes données dans le cadre de la réglementation sur la protection des données à caractère personnel (RGPD).
Vous pouvez à tout moment modifier l’usage de vos données et exercer vos droits en envoyant un email à l’adresse rgpd@orsys.fr
En cochant cette case, j’accepte de recevoir les communications à vocation commerciale et promotionnelle de la part d’ORSYS Formation*
Vous pouvez à tout moment vous désinscrire en utilisant le lien de désabonnement inclus dans nos communications.
* Les participants inscrits à nos sessions de formation sont également susceptibles de recevoir nos communications avec la possibilité de se désabonner à tout moment.
CLASSE A DISTANCE

En inter et en intra-entreprise
Inscrivez-vous ou contactez-nous !

Pour vous inscrire

Cliquez sur la ville, puis sur la date de votre choix.
[+]
CLASSE A DISTANCE
[+]
PARIS

Horaires

Les cours ont lieu de 9h à 12h30 et de 14h à 17h30.
Les participants sont accueillis à partir de 8h45.
Pour les stages pratiques de 4 ou 5 jours, les sessions se terminent à 15h30 le dernier jour.