Sample of Creating Extensions with Widget for Editing and Outputting Additional Information about Product

First of all, refer to the article describing the process of creating an extension and its main parts - Creating Extension from Scratch.

In this article we will review on the sample the process of creating the extension with the widget for editing and outputting the additional information about the product.

Keep in mind that for keeping and displaying the additional information about products, you can use the functionality Properties, that allows to keep, edit and display the structural information about the product.

1. Creating the extension template.

Click on Generate button and download the archived extension template. Then unpack this zip file in the catalogue /lib/common/extensions.

2. Changing the product table.

We need to add the additional column to the product table while installing the extension and delete this column if the extension is uninstalled with the chosen option Drop extension data tables.

Open the file Setup.php in the editor and do the corresponding changes.

3. Creating the line massive, that will be used for the possible translation of the additional field title and name into other languages.

4. Displaying and saving the additional field while editing the product in the backend.

While creating the template we indicated only one hook, that will be used for displaying the information. Add the hook 'categories/productedit-beforesave' for its saving:

Here we can use the simplified hook description where it is expected that the file name matches the hook name:

Edit the template for displaying the field (categories.productedit.details-right-column.tpl):

Edit the template for saving the field (categories.productedit-beforesave.php):

5. Editing the widget for displaying the information on the frontend.

Edit the widget template (add-product-info.tpl):

Edit the main widget file (AddProductInfo.php):

Check the widget description function in the file Setup.php

6. Installation and checking.

Install the new extension in the backend (Modules->Extensions menu).

Activate the extension on the next page.

Check the new product field editing.

Add the widget to the theme for displaying on the frontend.

Open the active theme in Design and CMS->Themes. Choose the product page, click on Widget button and find the widget with the name that was indicated in the function getWidgets:

And drag it to the product page.

Save the theme and check the additional field display on the frontend.

P.S. You can download the extention by clicking on this link