Create the extension structure

Extensions require a specific structure configuration.

Once you have a new unique ID for your extension, you can start to develop it by creating the folder structure, as shown in the example below. Make sure your extension uses a name that is unique within your Commerce environment; for example, do not give your extension the same name as a default widget.

Note: If you do not include JavaScript, Less styles, or Locales, you can omit those directories.

<extension-name> : The root folder of your extension, must be unique
            ext.json
            <additional directories to define widgets, elements,
             payment gateways, site settings>/

Define extension meta-data in ext.json

Each extension provides meta-data describing the author/developer of the extension and other information related to its creation. This meta-data is contained in a manifest file called ext.json. Without the manifest file, the extension cannot be loaded. The ext.json file should include the following:

  • extensionID: Unique ID of the extension. Note that this ID must match the value generated on the Extensions page in the administrative console. See Use developer tools to customize your store for more information.
  • developerID: The extension author’s unique developer ID.
  • createdBy: The name of creator (company or individual).
  • version: The version of the extension, expressed as a single whole number.
  • timeCreated: When the extension was created. iso-8601 is the recommended format; however, an informal time stamp is also acceptable.
  • translations: An array that provides translations for both the extension name and description. These properties are displayed on the Extensions page that is accessible from the Settings page in Commerce. For example, the English translation for the name of the extension in the illustration below is “Visit Counter Widgets” and the description is “Provides visitor counting related functionality”.

An example of an ext.json file that includes translations for English and French is shown below. Note that the translations property has three sub-properties, language, name, and description. The language property can be either a two-letter language code (for example, en) or a two-letter language code and a two-letter country code with an underscore in between (for example, en_US). ISO 639-1 defines the two-letter language codes. ISO 3166-1 alpha-2 defines the two-letter country codes.

{ "extensionID": "f3acef8e-375a-11e4-9c85-ebc5b52923a8",
            "developerID": "987654",
            "createdBy": "Company name",
            "version": 1,
            "timeCreated": "2016-09-08",
            "translations" : [
              {
                "language" : "en_US",
                "name":"Extension label in English",
                "description":"Extension description in English"
              },
              {
                "language" : "fr_CA",
                "name":"Extension label in French",
                "description":" Extension description in French"
              }
            ]
          }

Add functionality to the extension

The extension directory contains additional directories, at the same level as the ext.json file, that define the functionality you want to upload. For more information on creating these directories and their contents, see the following:

  • For information on creating widgets, elements, and site settings, refer to the remainder of this guide. Also refer to this guide for information on uploading application-level JavaScript modules.
  • For information on creating payment gateways,see Configure Payment Processing.