Magento theme: Tips and tricks

There is some stuff that you must know while creating a theme. The following tips will help you in cases of extreme necessities, particularly when you are looking for a specific file to override.

1. Template path hint

The app/design/frontend/base/default path contains a lot of files, all divided into many folders. It’s a bit hard to remember the path and name of every file.

In order to find the path of a file in the base theme, we need to customize and then copy our theme; Magento comes to us with the Template Path Hints option.

This feature will help you a lot if you don’t know the position of any file and will help you to speed up the theme creation.

To enable this feature, perform the following steps:

  1. In the Admin panel, navigate to System | Configuration.
  2. On the left side at the bottom in the Advanced box, click on Developer.
  3. On the left side in the Current Configuration Scope box, select the Main Website, option or your own
  4. Now, in the Debug box to the right, select YES to Template Path Hints.
  1. Save the

Back in the frontend, we can see each block surrounded by a red border, with the PHTML file path that generates it.

In this way, we can copy the files from the base theme and paste them to the same location of our theme.

The following screenshot shows the template path hints in action. As you can see, each block is surrounded by a red border with the path to the file that generates it:

2. Disabling the WYSIWYG editor

Another useful tip is to disable the WYSIWYG text editor. This will save you a lot of time when you have to write the HTML code inside the CMS pages or blocks, and you can prevent the editor from changing the code you’ve written.

To disable it, navigate to System | Configuration | Content Management, as shown in the following screenshot:

Here you have three options. You can choose to leave it as Enabled by Default (the default configuration), or you can choose to disable it completely, or to disable by default. I recommend that you at least disable it completely in the development phase.

Source: Sacca Andrea (2014), Mastering Magento theme design, Packt Publishing; Illustrated edition.

Leave a Reply

Your email address will not be published. Required fields are marked *