In this magento web development tip, we will be guiding you on how to display a custom admin system message in the backend.
One of the most useful default functionality is the admin notification. Magento uses this functionality to notify admin user of various errors, warning, upgrade and patch information. Whenever you log in to the admin panel, such notifications may appear giving you some vital information. These notifications can vary from messages about invalidated indexes to vulnerability issues. Adding custom system messages can be helpful and we are going to show you how to do it in a few simple steps.
There are four types of system admin notification that Magento uses which are listed below.
Notice: updates, releases, and other Magento news Minor: minor updates and other messages Major: important notifications, which you should check shortly Critical: vulnerability issues and other most important notifications
Here we are using Aureatelabs as the Vendor name and CustomNotification as the name of the module. You can change this according to your Vendor and Module name.
First you have to create a di.xml file in app/code/Aureatelabs/CustomNotification/etc/adminhtml/ directory
<?php
namespace Aureatelabs\CustomNotification\Model\System\Message;
use Magento\Framework\Notification\MessageInterface;
class CustomMessageNotification implements MessageInterface {
/**
* Message identity
*/
const MESSAGE_IDENTITY = 'custom_system_notification';
/**
* Retrieve unique system message identity
*
* @return string
*/
public function getIdentity()
{
return self::MESSAGE_IDENTITY;
}
/**
* Check whether the system message should be shown
*
* @return bool
*/
public function isDisplayed()
{
// return true will show the system notification, here you have to check your condition to display notification and base on that return true or false
return true;
}
/**
* Retrieve system message text
*
* @return \Magento\Framework\Phrase
*/
public function getText()
{
return __('Custom System Message Notification Text.');
}
/**
* Retrieve system message severity
* Possible default system message types:
* - MessageInterface::SEVERITY_CRITICAL
* - MessageInterface::SEVERITY_MAJOR
* - MessageInterface::SEVERITY_MINOR
* - MessageInterface::SEVERITY_NOTICE
*
* @return int
*/
public function getSeverity()
{
return self::SEVERITY_MAJOR;
}
}
Possible default system message types are
SEVERITY_CRITICAL – to add a critical message SEVERITY_MAJOR – to add a major message SEVERITY_MAJOR – to add a major message SEVERITY_MINOR – to add a minor message SEVERITY_NOTICE – to add a notice
PAD length refers to the minimum number of additional zeros assigned to each order number as “padding” until the order number becomes higher than the chosen increment pad length. For example:
Pad 3 = 001, 012, 123, 1234, 12345, 123456
Pad 4 = 0001, 0012, 0123, 1234, 12345, 123456
Pad 6 = 000001, 000012, 000123, 001234, 012345, 123456
In the above order increment ID consist of following parts:
Prefix (store view id)
Pad-length
Suffix (Actual Increment id)
In Magento\SalesSequence\Model\Sequence the getCurrentValue() method set the pattern of the increment id number.
%’.09d sets 0 as the padding character and sets the number of digits to display as the value that follows, in this case, is 9. The d presents the number as a [signed] decimal. This means that by default, the increment-ID number will be a signed decimal with 9 digits, padded with 0s.
If you want to customize order’s Increment id PAD-length to be different than Magento 2 produces by default.
You can configure the class constructor arguments in your etc/di.xml in the argument node. The object manager injects these arguments into the class during creation. The name of the argument configured in the XML file must correspond to the name of the parameter in the constructor in the configured class.
Magento 2 provides a configuration system in its backend where we can create our own configuration setting as per the module requirement.
We can go to Store->Setting->Configuration and check all the stored Magento configuration there. We can also add our own configuration menu and use them.
Table:core_config_data
All records of configuration are stored in the table mentioned above.
By default, there is no entry in the table when we create any configuration field.
However, when we save the configuration there will be an entry in this table with its respective value so that we can trace the actual configuration value from this table.
Step 1: Create system.xml file Step 2: Set default configuration value Step 3: Flush Magento cache Step 4: Use configurations
Note: Replace Aureatelabs/LoginAsCustomer from entries in this article to your module name.
Step 1: Create system.xml file
Create a file at the path given below and add the following code: app/code/VendorName/ThemeDirectoryName/etc/adminhtml/system.xml
In the above code, we have two groups General and Button visibility Below is the brief description of some of the tags we have used:
<system>: This tag is the starting tag to indicate that we are going to system settings.
Tab elements:
This tag is used to create our custom menu in configuration options.
id: unique tab id
label: tab title
Section Attributes:
id: unique section id
sortOrder: set the position of our configuration menu in the list.
showInDefault: configuration scope
showInWebsite: configuration scope
showInStore: configuration scope
Section elements:
Label: configuration menu title (In the example it’sAureate Labs)
Tab: tab_id to display this configuration
Resource: ACL rule to access this configuration (In the example it’s Aureatelabs_LoginAsCustomer::config)
Group: group of some configurations (In the example we created two groups general and Button visibility)
Fields: configuration field to store dropdown or text or radio button. The field also has some attributes and elements.
Fields Elements:
Label: field title (In Example for general we have Enabled text)
Source_model: store data of this field, we can use it for select, multi-select type (In the example we have used Magento\Config\Model\Config\Source\Yesno For Yes/No Dropdown)
We can use our own source_model for options in this example we are using yesno model provided by Magento. If you want to add our own you can add.
Step 2: Set default configuration value
Each field in system.xml after its creation will not have any value.
When we call them it will return Null value because at the time of field creation there is no entry in the core_config_data table. When we click on save config button then there is an entry as per the default value of the field.
If we have Yes/No field then it will show default No value (We will see how we can change it in the steps given below) but there is no entry in database level until we click on the save config button.
To set our default value for the field let’s consider in our example we have enabled the field for values Yes/No.
After the first step when we visit the admin configuration section then we have the default value set in the field as “No”. Now we can change it as shown below:
Create a config.xml file at the path given below and add the following code: app/code/VendorName/ThemeDirectoryName/etc/config.xml
namespace Aureatelabs\LoginAsCustomer\Controller\Login;
class Index extends \Magento\Framework\App\Action\Action
{
protected $helperData;
public function __construct(
\Magento\Framework\App\Action\Context $context,
\Aureatelabs\LoginAsCustomer\Helper\Data $helperData
)
{
$this->helperData = $helperData;
return parent::__construct($context);
}
public function execute()
{
// TODO: Implement execute() method.
$CheckEnable=$this->helperData->getFieldConfig('enable');
// You can check value of result by printing $CheckEnable value
}
}
Hope this was helpful. If you have any queries regarding the same feel free to write to us in the comments section given below!
Time for another Magento web development hack. I will be guiding you on how to attach a file in the product admin form and display the attachment on the product detail page.
Here we will be using Aureatelabs as the Vendor name and ProductAttachment as the module’s name. You can change this according to your Vendor and Module name.
Step 1: Create module registration file
First, create a registration.php file in app/code/Aureatelabs/ProductAttachment directory
group: Here we have used Product Attachment in the group. So new attribute created in product admin form will be added in a new tab named Product Attachment.
type: Here we will define varchar in type. We will save file name in attribute so we need varchar in type.
label: Define the product attribute label, this label will be shown in product admin form.
input: Define file to display file type input in product admin form.
backend: In this define the backend model path. This backend model will handle the file upload and will save the value of the attribute when saving the product.
user_defined: It is custom attribute so will use true in this column.
apply_to: In this column define different product type so this attribute will work with only these product types.
used_in_product_listing: To use this attribute value in the frontend in product listing set this to true.
Next, we will create a backend model file to save uploaded file in the media folder and save the file name to this attribute value.
Step 3: Create backend model file to upload product attachment file and save value in attachment attribute
So create File.php in app/code/Aureatelabs/ProductAttachment/Model/Product/Attribute/Backend directory
Now you can see the product attachment tab and input type file attribute in a new tab in product admin form.
Now after attaching file and save the product, the file is uploaded in pub/media/catalog/product/attachment directory and file name stored in attachment attribute value.
Step 4: Display product attachment link and delete checkbox after saving product in admin form
But after saving the product in product attachment tab file name is not showing up or how to remove file checkbox is not showing up.
So we will display an anchor tag that contains the file path and we will also add delete checkbox to remove the file in the product attachment tab.
We will use a modifier to add these changes in product attachment tab.
So we will create a di.xml in app/code/Aureatelabs/ProductAttachment/etc/adminhtml directory.
As we have defined in layout file we will create block and phtml file.
So next we will create an Attachment.php in app/code/Aureatelabs/ProductAttachment/Block directory.
Copy CodeCopiedUse a different Browser
<?php
namespace Aureatelabs\ProductAttachment\Block;
class Attachment extends \Magento\Catalog\Block\Product\View {
public function getMediaUrl() {
return $this->_storeManager->getStore()
->getBaseUrl(\Magento\Framework\UrlInterface::URL_TYPE_MEDIA);
}
public function getProductAttachmentUrl($attachment) {
return $this->getMediaUrl()."catalog/product/attachment/".$attachment;
}
}
Next we will create a product_attachment.phtml in app/code/Aureatelabs/ProductAttachment/view/frontend/templates directory.
Copy CodeCopiedUse a different Browser
<?php
// get current product data
$product = $block->getProduct();
if (!empty($product->getAttachment())) {
$attachmentUrl = $block->getProductAttachmentUrl($product->getAttachment());
?>
<a href="<?php echo $attachmentUrl ?>" target="_blank"><?php echo $product->getAttachment() ?></a>
<?php
}
Now flush cache and open the product detail page. Now you can see the product attachment tab.
To upload image in admin form Magento 2, open the admin panel. Navigate to Products>Catalog tab and click on the product to which you add an image. Then, navigate to the Images and Videos tab and click on the camera icon. Here, you can select the required image from your local storage. Click on the orange save button to save all the images.
How do I display data in frontend in Magento 2?
To display data in frontend in Magento 2, follow the below steps: 1. Create a Resource Model for the data in the required table. 2. Create a collection model to fetch data from the table. 3. Extend the model by creating a data interface. 4. Implement the model and locate a block file. 5. Input data in the phtml file and utilize commands to manage the data.
How to save admin form data in Magento 2?
To save admin form data in Magento 2, check the following steps: 1. Create a submit.php file to save form input data. 2. Locate the file in app\code\Extension\Controller\Index\Submit.php 3. Enter data saved message in the code to display when necessary. 4. Implement the code and test it to save data in the database.
How to upload image in Magento 2 backend?
To upload an image in Magento 2, follow the below-mentioned steps –
1. Inject the Magento\Framework\File\UploaderFactory class in your constructor – protected $_uploaderFactory; public function __construct( // … \Magento\Framework\File\UploaderFactory $uploaderFactory, // … ) { // … $this->_uploaderFactory = $uploaderFactory; // … } 2. Now, use the create() function of the $_uploaderFactory object to create an instance of the \Magento\Framework\File\Uploader class - $uploader = $this->_uploaderFactory->create(['fileId' => 'image']); 3. Next, set the path to the media folder where you want to upload the image – $path = 'path/to/media/folder'; $uploader->setAllowCreateFolders(true); $uploader->setAllowedExtensions(['jpg', 'jpeg', 'gif', 'png']); $uploader->save($path); 4. Once the image is uploaded, you can use it in your products or pages.
Hello, if you want to learn regarding the configuration creation in Magento 2 then you are at the right place. In this blog, we will cover how to add custom system configuration located in Stores > Configuration
Config.xml in Magento 2
XML is a configuration file that creates configuration fields in Magento 2 System Configuration. You can create config.xml in Magento 2 in 3 simple steps. First, create a custom configuration field with Magento 2. Second, create ACL. And finally, add the default config value on Magento 2 module.
Now we will show you how to execute it in three steps with examples.
Note: Replace Aureatelabs/Jobs from entries in this article with your module name.
Step 1: Create a custom configuration field with Magento 2
Let’s assume that we have created a module for jobs. Now let’s create the system.xml file.
The system.xml file will be located at: app/code/Aureatelabs/Jobs/etc/adminhtml/system.xml
The default node states that it is the default scope.
The next nodes are section, group and field names that are set in system.xml
Here we set our default value to 1.
You can check DB value for configuration. Now find core_config_data MySQL table in Magento database. You can find the jobs/department/view_list inside path column in the MySQL table.
This is all. If you follow the above steps carefully you can certainly go live with the customs entry in the system configuration in Magento2. Even if you have any query or doubt regarding this article, you can reach us to make it clear.
In this Magento 2 web development tip, we will be guiding you on how to create a custom tab and call custom phtml in the admin category ui-component form in Magento 2.
Here we are using Aureatelabs as the Vendor name and CustomTab as the name of the module. You can change this according to your Vendor and Module name.
First, we will create a custom tab in category admin form after that we will call our custom block and phtml file inside our custom tab.
First you have to create category_form.xml file in app/code/Aureatelabs/CustomTab/view/adminhtml/ui_component directory
In this hack of Magento web development, we will be guiding you on how to add a custom button in the admin product ui-component form in Magento 2.
Here we will be using Aureatelabs as the Vendor name and CustomButton as the name of the module. You can change this according to your Vendor and Module name.
The product form is generated via ui-components.
To begin with, you have to create a product_form.xml file in app/code/Aureatelabs/CustomButton/view/adminhtml/ui_component directory
It’s tough when you’re dealing with Magento 1 custom grid view and you have to display EAV attribute data in grid. Right?
After tweaking the minds for hours, we at Aureate Labs would like to present a best and easy go solution that can work without a single error.
Let’s make it happen in a couple of minutes,
In a very short journey before we jump on actual code, make sure you’ve needed table structure same as displayed below:
First, create two tables related to the testimonial. 1. testimonial table (parent table): stores All testimonial data. 2. testimonial_product_customer (child table): stores Testimonial_id (FK), Product_id(FK), Customer_ID(FK) relational data.
Here is the detailed table structure with the required columns:
testimonial
Id (Primary key)
company_name
name
message
post
profile_pic
status
created_at
Updated_at
testimonial_product_customer
Id (Primary key)
testimonial_id (Foreign key – testimonial)
product_id (Foreign key – product)
customer_id (Foreign key – customer)
Now, all we need is to display these products and customers related data in testimonial grid without breaking any functionality of searching or sorting the data. And that can be easily done with the help of LEFT JOIN (EAV TABLES).
Coming to code, we have to update _prepareCollection() the method of testimonial grid block class (Grid.php) placed at app/code/local/{Namespace}/Testimonials/Block/Adminhtml/Testimonials/
That is all! Now you can check for the EAV attributes data displayed successfully in the custom grid. If you encountered any error, don’t hesitate to connect us by leaving the comment below. We will be glad to help you.
We have another hack to Magento web development queries. And it’s about adding a view button in the admin grid. Follow the steps given below to add a view button in the admin grid:
1. Add the <actionColumn> tag in your admin grid UI component file as given below:
<?php
namespace Aureatelabs\Grid\Block\Adminhtml;
use Magento\Backend\Block\Template;
class View extends Template
{
public $_template = 'Aureatelabs_Grid::view.phtml';
public function __construct(
\Magento\Backend\Block\Template\Context $context
) {
parent::__construct($context);
}
}
8. Create a template file as shown below: Aureatelabs/Grid/view/adminhtml/templates/view.phtml
To get data in the admin grid in Magento 2, use a Collection class. Follow these steps: 1. Create a new collection class in your module’s Model\ResourceModel directory as Magento\Framework\Model\ResourceModel\Db\Collection\AbstractCollection. 2. Now, define the _init method in your module’s Model\Items class. It will set the primary key, entity table name, and resource model class name. 3. Next, define the _prepareCollection method in your Grid class to load the data from the Collection class. 4. At last, define the _prepareColumns method to define the columns and display them in the grid.
How to create a tab and load grid in Magento 2 customer admin edit page?
To create a tab and load a grid in the Magento 2 customer admin edit page, follow these steps –
1. Create a new module in the app/code directory of your Magento installation. 2. Next, create a new module.xml file in the module’s etc directory. 3. Now, in the above file, add the following code to register the module with Magento – <?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd"> <module name="Vendor_Module" setup_version="1.0.0"/> </config> 4. Further, create a new layout file in view/adminhtml/layout directory, and name it as customer_edit.xml. 5. In the above file, use the following code to create a new tab in the customer edit page: <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <update handle="customer_edit"/> <body> <referenceBlock name="customer_edit_tabs"> <block class="Vendor\Module\Block\Adminhtml\Tab\Grid" name="customer_edit_tab_grid"> <arguments> <argument name="config_grid_id" xsi:type="string">customer_edit_tab_grid</argument> <argument name="config_grid_url" xsi:type="string">customer/index/grid</argument> </arguments> </block> <action method="addTab"> <argument name="name" xsi:type="string">customer_edit_tab_grid</argument> <argument name="block" xsi:type="string">customer_edit_tab_grid</argument> </action> </referenceBlock> </body> </page> 6. Thereafter, create a new block file in Block/Adminhtml/Tab directory, and name it Grid.php. Inside it, define the _prepareCollection and _prepareColumns methods. 7. Then, create a new controller file in Controller/Adminhtml/Index directory, and name it Grid.php. Inside it, define the execute method. 8. At last, run the command php bin/magento setup:upgrade in your Magento root directory to enable the module.
How do I access Magento 2 Admin panel?
To access your Magento 2 admin panel, you need to use the command php bin/magento info:adminuri. Then, add the result to your main URL and you will get the admin login page. After entering your Magento admin username and password you will login to the admin panel and will be able to access the admin dashboard.
How do I add an edit action in admin grid in Magento 2?
To add an edit action in the admin grid in Magento 2, use the following steps: 1. Change the admin grid with XML file. 2. Add an edit action column in the UI. 3. Write the code for the edit action class. 4. Implement the code and verify it by flushing cache and reloading the page.
