{"id":1575,"date":"2017-08-11T21:25:30","date_gmt":"2017-08-11T19:25:30","guid":{"rendered":"https:\/\/www.h-hennes.fr\/blog\/?p=1575"},"modified":"2017-08-11T21:25:30","modified_gmt":"2017-08-11T19:25:30","slug":"magento-2-ajouter-des-nouveaux-attributs-aux-formulaires-de-creation-de-compte","status":"publish","type":"post","link":"https:\/\/www.h-hennes.fr\/blog\/2017\/08\/11\/magento-2-ajouter-des-nouveaux-attributs-aux-formulaires-de-creation-de-compte\/","title":{"rendered":"Magento 2 : Ajouter des nouveaux attributs aux formulaires de cr\u00e9ation de compte"},"content":{"rendered":"

Cet article est une mise \u00e0 jour d’un article pr\u00e9c\u00e9dent sur Magento 1 : Magento 1 : Ajouter des nouveaux attributs aux formulaires de cr\u00e9ation de compte <\/a><\/p>\n

Nous allons voir comment rajouter un attribut client aux formulaire de cr\u00e9ation de compte et d’\u00e9dition du compte client.
\nCelui-ci sera nomm\u00e9 \u00ab\u00a0Sample\u00a0\u00bb
\n(La partie checkout a \u00e9t\u00e9 totalement r\u00e9\u00e9crite dans magento 2 et fera l’objet d’un article ult\u00e9rieur)<\/p>\n

Pour cela nous allons cr\u00e9er un module Hhennes_Customer qui sera situ\u00e9 dans le dossier app\/code\/Hhennes\/Customer.
\nLa structure de notre module sera la suivante :<\/p>\n

\"Structure<\/p>\n

Pour commencer comme pour tout module magento 2, il faut d\u00e9clarer notre module en cr\u00e9ant le fichier module.xml avec le contenu suivant dans le dossier \/etc\/ de notre module :<\/p>\n

<?xml version=\"1.0\"?>\r\n<config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:Module\/etc\/module.xsd\">\r\n <module name=\"Hhennes_Customer\" setup_version=\"0.1.0\">\r\n <sequence>\r\n <module name=\"Mage_Customer\"\/> <!-- D\u00e9pendance au module Mage Customer -->\r\n <\/sequence>\r\n <\/module>\r\n<\/config>\r\n<\/pre>\n
Ansi que le fichier registration.php \u00e0 la racine avec le contenu suivant :<\/p>\n
<?php\r\n\\Magento\\Framework\\Component\\ComponentRegistrar::register(\r\n\\Magento\\Framework\\Component\\ComponentRegistrar::MODULE,\r\n'Hhennes_Customer',\r\n__DIR__\r\n);\r\n<\/pre>\n
Pour installer notre module il faut le fichier \u00ab\u00a0InstallData.php\u00a0\u00bb dans un dossier \u00ab\u00a0Setup\u00a0\u00bb avec le contenu suivant<\/p>\n
\r\nIl faut g\u00e9rer l'affichage via la cr\u00e9ation de layouts et de templates et l'ensemble fonctionne quasiment comme dans Magento 1\r\nLes pages de cr\u00e9ation et d'\u00e9dition de compte comportent le code suivant :<\/pre>\n
<?php echo $block->getChildHtml('form_additional_info'); ?>\r\n<\/pre>\n
qui permet de rajouter des \u00e9l\u00e9ments suppl\u00e9mentaires.<\/p>\n
Les controller concern\u00e9s sont donc les suivants : customer_account_create customer_account_edit, nous allons donc cr\u00e9er les fichiers de layouts associ\u00e9s dans le dossier view\/frontend\/layout\/<\/p>\n
customer_account_create.xml avec le contenu suivant :<\/p>\n
<?xml version=\"1.0\" encoding=\"UTF-8\"?>\r\n<page xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" layout=\"1column\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:View\/Layout\/etc\/page_configuration.xsd\">\r\n<body>\r\n<referenceContainer name=\"form.additional.info\">\r\n<block class=\"Magento\\Framework\\View\\Element\\Template\" name=\"form_additional_sample\" template=\"Hhennes_Customer::form\/sample_attribute.phtml\"\/>\r\n<\/referenceContainer>\r\n<\/body>\r\n<\/page>\r\n<\/pre>\n
customer_account_edit.xml avec le contenu suivant :<\/p>\n
<?xml version=\"1.0\" encoding=\"UTF-8\"?>\r\n<page xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" layout=\"1column\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:View\/Layout\/etc\/page_configuration.xsd\">\r\n<body>\r\n<referenceContainer name=\"form.additional.info\">\r\n<block class=\"Magento\\Customer\\Block\\Form\\Edit\" name=\"form_additional_sample\" template=\"Hhennes_Customer::form\/sample_attribute_edit.phtml\"\/>\r\n<\/referenceContainer>\r\n<\/body>\r\n<\/page>\r\n<\/pre>\n
Notez bien la diff\u00e9rence dans le premier cas le bloc est de type Magento\\Framework\\View\\Element\\Template alors que dans le second il est de type Magento\\Customer\\Block\\Form\\Edit<\/p>\n
Pour finir il faut cr\u00e9er les fichier phtml dans le dossier view\/frontend\/template\/form\/sample_attribute.phtml<\/p>\n
<?php\r\n<div class=\"field\">\r\n<label class=\"label\" for=\"sample\"><span><?php \/* @escapeNotVerified *\/ echo __('Sample Data') ?><\/span><\/label>\r\n<input type=\"text\" name=\"sample\" title=\"<?php \/* @escapeNotVerified *\/ echo __('Sample Data') ?>\" class=\"input-text\" autocomplete=\"off\" value=\"\"\/>\r\n<\/div>\r\n<\/pre>\n
et sample_attribute_edit.phtml<\/p>\n
<?php\r\n<div class=\"field\">\r\n<label class=\"label\" for=\"sample\"><span><?php \/* @escapeNotVerified *\/ echo __('Sample Data') ?><\/span><\/label>\r\n<input type=\"text\" name=\"sample\" title=\"<?php \/* @escapeNotVerified *\/ echo __('Sample Data') ?>\" class=\"input-text\" autocomplete=\"off\"\r\nvalue=\"<?php echo $block->getCustomer()->getCustomAttribute('sample')->getValue() ?>\"\/>\r\n<\/div>\r\n<\/pre>\n
Si tout va bien votre champ devrait \u00eatre visible sur les pages de cr\u00e9ation et d’\u00e9dition de compte.<\/p>\n
\"Nouveau<\/p>\n
Note : Attention \u00e0 date d’aujourd’hui dans le th\u00e8me luma, les champs additionnels sont affich\u00e9s \u00e0 la suite du mot de passe, et il est n\u00e9cessaire d’afficher celui-ci pour les voir.<\/p>\n","protected":false},"excerpt":{"rendered":"
Cet article est une mise \u00e0 jour d’un article pr\u00e9c\u00e9dent sur Magento 1 : Magento 1 : Ajouter des nouveaux attributs aux formulaires de cr\u00e9ation de compte Nous allons voir comment rajouter un attribut client aux formulaire de cr\u00e9ation de compte et d’\u00e9dition du compte client. Celui-ci sera nomm\u00e9 \u00ab\u00a0Sample\u00a0\u00bb (La partie checkout a \u00e9t\u00e9 […]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[246],"tags":[497,482],"class_list":["post-1575","post","type-post","status-publish","format-standard","hentry","category-magento-2","tag-attribut-client","tag-magento-2"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts\/1575","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/comments?post=1575"}],"version-history":[{"count":2,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts\/1575\/revisions"}],"predecessor-version":[{"id":1579,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts\/1575\/revisions\/1579"}],"wp:attachment":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/media?parent=1575"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/categories?post=1575"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/tags?post=1575"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}