![\"How](\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2019\/09\/Create-custom-image-attribute-for-Magento-2-Meetanshi.png\")
<\/a><\/figure>\n<\/div>\n\n\n<\/figure>\n\n\n\nThe frontend customer can use it as shown here:<\/p>\n\n\n\n 1. Create InstallData.php<\/strong><\/em> file at app\/code\/[Vendor]\/[module]\/Setup\/InstallData.php<\/strong><\/p>\n\n\n\n 2. Add Image Upload Field in Customer Registration Page, 3. Create imagefieldregister.phtml<\/strong><\/em> file at app\/code\/[Vendor]\/[Module]\/view\/frontend\/templates\/customer\/form\/imagefieldregister.phtml<\/strong><\/p>\n\n\n\n 4. To display the image in the custom account section, 5. Cretae imagefieldaccount.phtml<\/strong><\/em> file at app\/code\/[Vendor]\/[Module]\/view\/frontend\/templates\/customer\/form\/imagefieldaccount.phtml<\/strong><\/strong><\/p>\n\n\n\n 6. Create Account.php<\/strong><\/em> file at app\/code\/[Vendor]\/[Module]\/Block\/Customer\/Account.php<\/strong><\/p>\n\n\n\n Note:<\/strong> Custom image is store at pub\/media\/customer path.<\/p>\n\n\n\n Use the above solution and let customers upload their favourite profile picture in the site!<\/p>\n\n\n\n Feel free to share the solution with fellow developers via social media.<\/p>\n\n\n\n Thanks.<\/p>\n","protected":false},"excerpt":{"rendered":" A picture can express a thousand words! Do you want the Magento 2 store customer to upload a profile picture? Or you require them to…<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[34],"tags":[],"class_list":["post-613","post","type-post","status-publish","format-standard","hentry","category-magento"],"acf":[],"_links":{"self":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/613","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/comments?post=613"}],"version-history":[{"count":4,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/613\/revisions"}],"predecessor-version":[{"id":18795,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/613\/revisions\/18795"}],"wp:attachment":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/media?parent=613"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/categories?post=613"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/tags?post=613"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}<\/figure>\n\n\n\nSteps to create custom image attribute for a customer in Magento 2:<\/h2>\n\n\n\n
<?php\n \nnamespace [Vendor]\\[module]\\Setup;\n \nuse Magento\\Eav\\Setup\\EavSetupFactory;\nuse Magento\\Customer\\Setup\\CustomerSetupFactory;\nuse Magento\\Framework\\Setup\\InstallDataInterface;\nuse Magento\\Framework\\Setup\\ModuleContextInterface;\nuse Magento\\Framework\\Setup\\ModuleDataSetupInterface;\n\nclass InstallData implements InstallDataInterface\n{\n private $eavSetupFactory;\n private $customerSetupFactory;\n\n public function __construct(\n EavSetupFactory $eavSetupFactory,\n CustomerSetupFactory $customerSetupFactory\n )\n {\n $this->eavSetupFactory = $eavSetupFactory;\n $this->customerSetupFactory = $customerSetupFactory;\n }\n\n public function install(\n ModuleDataSetupInterface $setup,\n ModuleContextInterface $context\n ) {\n $setup->startSetup();\n\n $eavSetup = $this->eavSetupFactory->create(['setup' => $setup]);\n $customerSetup = $this->customerSetupFactory->create(['setup' => $setup]);\n\n $attributeCode = 'customer_image';\n\n $customerSetup->addAttribute(\n \\Magento\\Customer\\Model\\Customer::ENTITY,\n $attributeCode,\n [\n 'type' => 'text',\n 'label' => 'Customer File\/Image',\n 'input' => 'file',\n 'source' => '',\n 'required' => false,\n 'visible' => true,\n 'position' => 200,\n 'system' => false,\n 'backend' => ''\n ]\n );\n\n \/\/ used this attribute in the following forms\n $attribute = $customerSetup->getEavConfig()\n ->getAttribute(\\Magento\\Customer\\Model\\Customer::ENTITY, $attributeCode)\n ->addData(\n ['used_in_forms' => [\n 'adminhtml_customer',\n 'adminhtml_checkout',\n 'customer_account_create',\n 'customer_account_edit'\n ]\n ]);\n\n $attribute->save();\n $setup->endSetup();\n }\n}<\/pre>\n\n\n\n
Create customer_account_create.xml<\/strong><\/em> file at app\/code\/[Vendor]\/[Module]\/view\/frontend\/layout\/customer_account_create.xml<\/strong><\/p>\n\n\n\n<?xml version=\"1.0\"?>\n<page xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" layout=\"1column\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:View\/Layout\/etc\/page_configuration.xsd\">\n <body>\n <referenceContainer name=\"form.additional.info\">\n <block class=\"Magento\\Framework\\View\\Element\\Template\" name=\"custom_additional_field_register\" template=\"[Vendor]_[Module]::customer\/form\/imagefieldregister.phtml\"\/>\n <\/referenceContainer>\n <\/body>\n<\/page><\/pre>\n\n\n\n
<fieldset class=\"fieldset file-upload\">\n <div class=\"field customer_file_upload\">\n <label for=\"customer_image\" class=\"label\"><span><?php \/* @escapeNotVerified *\/\n echo __($helper->FileLabel1()) ?><\/span><\/label>\n <div class=\"control\">\n <input type=\"file\" name=\"customer_image\" id=\"customer_image\" title=\"<?php \/* @escapeNotVerified *\/\n echo __('Custom Image') ?>\" class=\"input-text\" data-validate=\"{required:false}\">\n <\/div>\n <\/div>\n <\/<fieldset><\/pre>\n\n\n\n
Cretae customer_account_edit.xml<\/strong><\/em> file at app\/code\/[Vendor]\/[Module]\/view\/frontend\/layout\/customer_account_edit.xml<\/strong><\/p>\n\n\n\n<?xml version=\"1.0\"?>\n<page xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:View\/Layout\/etc\/page_configuration.xsd\">\n <update handle=\"customer_account\"\/>\n <body>\n <referenceContainer name=\"form.additional.info\">\n <block class=\"[Vendor]\\[Module]\\Block\\Customer\\Account\" name=\"additional_field_account\" template=\"[Vendor]_[Module]::customer\/form\/imagefieldaccount.phtml\"\/>\n <\/referenceContainer>\n <\/body>\n<\/page><\/pre>\n\n\n\n
<fieldset class=\"fieldset create account\" data-hasrequired=\"<?php \/* @escapeNotVerified *\/ echo __('* Required Fields') ?>\">\n <legend class=\"legend\">\n <span><?php \/* @escapeNotVerified *\/echo __('Image Uploaded') ?><\/span>\n <\/legend>\n <?php if ($url = $block->getFileUrl()): ?>\n <div class=\"field\">\n <img src=\"<?php echo $url ?>\" alt=\"image\" \/>\n <\/div>\n <?php endif;?>\n<\/fieldset><\/pre>\n\n\n\n<?php\n\nnamespace [Vendor]\\[Module]\\Block\\Customer;\n\nuse Magento\\Backend\\Block\\Template\\Context;\nuse Magento\\Framework\\UrlInterface;\nuse Magento\\Customer\\Model\\SessionFactory;\nuse Magento\\Framework\\View\\Element\\Template;\n\nclass Account extends Template\n{\n protected $urlBuilder;\n protected $customerSession;\n protected $storeManager;\n protected $customerModel;\n\n public function __construct(\n Context $context,\n UrlInterface $urlBuilder,\n SessionFactory $customerSession,\n \\Magento\\Store\\Model\\StoreManagerInterface $storeManager,\n \\Magento\\Customer\\Model\\Customer $customerModel,\n array $data = []\n )\n {\n $this->urlBuilder = $urlBuilder;\n $this->customerSession = $customerSession->create();\n $this->storeManager = $storeManager;\n $this->customerModel = $customerModel;\n\n parent::__construct($context, $data);\n\n $collection = $this->getContracts();\n $this->setCollection($collection);\n }\n\n public function getBaseUrl()\n {\n return $this->storeManager->getStore()->getBaseUrl();\n }\n\n public function getMediaUrl()\n {\n return $this->getBaseUrl() . 'pub\/media\/';\n }\n\n public function getCustomerImageUrl($filePath)\n {\n return $this->getMediaUrl() . 'customer' . $filePath;\n }\n\n public function getFileUrl()\n {\n $customerData = $this->customerModel->load($this->customerSession->getId());\n $url = $customerData->getData('customer_image');\n if (!empty($url)) {\n return $this->getCustomerImageUrl($url);\n }\n return false;\n }\n}<\/pre>\n\n\n\n