Magento 2 allows the admin to create different product types and edit them from the backend Catalog > Products > Product edit form.
With innovations in E-commerce, the default features may not be enough to meet the business requirements. However, Magento 2 flexible to tweak or add new features, buttons, forms, or any components.
Today, I’ll show one such method to add a custom button in the admin product UI-component form in Magento 2.
Using the below code, the admin can use custom buttons in the product edit form in the backend. For example, generate a barcode for the product, or check the preview of the product frontend.
For example,
Method to add custom button in the admin product UI-component form in Magento 2:
Create a product_form.xml file at app/code/Vendor/Extension/view/adminhtml/ui_component directory
1 2 3 4 5 6 7 8 9 10 11 12 | <?xml version="1.0" encoding="UTF-8"?> <form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd"> <!--For custom button--> <argument name="data" xsi:type="array"> <item name="buttons" xsi:type="array"> <item name="customButton" xsi:type="string"> Vendor\Extension\Block\Adminhtml\Product\Edit\Button\CustomButton </item> </item> </argument> </form> |
Next you have to create a CustomButton.php file in app/code/Vendor/Extension/Block/Adminhtml/Product/Edit/Button directory
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <?php namespace Vendor\Extension\Block\Adminhtml\Product\Edit\Button; class CustomButton extends \Magento\Catalog\Block\Adminhtml\Product\Edit\Button\Generic { public function getButtonData() { return [ 'label' => __('Custom Button'), 'class' => 'action-secondary', 'on_click' => 'alert("Hello World")', 'sort_order' => 10 ]; } } |
add-custom-button-in-the-admin-product-ui-component-form-in-magento-2That’s it.
Any doubts in the above solution can be mentioned in the Comments section below.
Also, do share the solution with the Magento Community via social media.
Thank you.
Related Post – How to Add Custom Button in Magento 2 System Configuration
Get Weekly Updates
Never miss Magento tips, tricks, tutorials, and news.
Thank you for subscribing.
Something went wrong.
