Template Path Hints in Magento 2 is a useful debugging tool that identifies blocks added to a page. If you want to customize or edit part of a Magento page, you can determine which block it belongs to using Template Path Hints and then make changes to its .phtml files.
You can enable Template Path Hints in Magento in two ways:
- Admin panel
- Command line
Prerequisites
- Enable developer mode by deploying the following command in the root directory:
php bin/magento deploy:mode:set developer - Add your IP address to the “Allowed IPs” list by navigating to Stores > Settings > Configuration > Advanced > Developer > Developer Client Restrictions.
Insert your IP address to the Allowed IPs text area in the “Developer Client Restrictions” section Doing this avoids any disturbance in the customer shopping experience. If you leave this section empty, everyone will see the template path hints on the storefront.
Enable Template Path Hints in Admin Panel
- Log in to your Magento 2 admin panel and navigate to Stores > Settings > Configuration.
Configuration in Magento admin panel - Scroll down and click on Advanced > Developer located at the bottom of the left panel.
Select Developer in the Advanced tab - Expand the “Debug” section and choose whether you want to activate template hints for “Storefront” or “Admin.”
Expand the “Debug” section on the Configuration page - To enable template path hints for the frontend, follow these steps:
Enable “Template Path Hints for Storefront” and “Hints for Storefront with URL Parameter” from No to Yes. Change “Enable Template Path Hints for Storefront” from No to Yes, to activate template path hints for the storefront.
A new field appears called “Enable Hints for Storefront with URL Parameter.” Change it from No to Yes to enable template path hints only when the URL includes the template hints parameter.
The default parameter is “magento,” and the default path is https://www.example.com/?templatehints=magento, where “example” is your domain name. You can change the default value from “magento” to a custom value of your choice in the “Parameter Value.”
- To activate template path hints for the admin, follow these steps:
Enable “Template Path Hints for Admin” and “Add Block Class Type to Hints” from No to Yes Change “Enable Template Path Hints for Admin” from No to Yes, to activate template path hints for the admin.
Change “Add Block Class Type to Hints” from No to Yes, to include the name of the blocks in addition to the template file path.
- Click the orange Save Config button on the top right.
- Go to System > Tools > Cache Management, click on all the invalidated cache types, and click on the Submit button to refresh the Magento cache.
Refresh the Magento cache on the Cache Management page
Enable Template Path Hints in Command Line
You can enable and disable template path hints via the command line. Unfortunately, this works only for the Magento 2 frontend and not the admin.
- Log in to your Magento server as the file system owner and go to the Magento project root directory.
- Use the following command to enable template path hints in Magento 2:
php bin/magento dev:template-hints:enable - Clean and flush the Magento cache by using the following code:
bin/magento cache:clean bin/magento cache:flush - When you’re done using this feature, you can use the following command to disable template path hints in Magento 2:
php bin/magento dev:template-hints:disable - Make sure you clean and flush the Magento cache after running the command.
This is what you’ll see on the frontend once you enable Template Path Hints:
