Skip to main content
Important

This feature is currently in Early Availability (EA) status. For more information, see our product lifecycle phases.

Create a new extension

This documentation will walk you through the entire process of creating and configuring your extensions, ensuring that you have a smooth experience while expanding your marketplace's capabilities. Extensions are an excellent way to enhance your platform by adding new features, customizing pages, or even overriding existing pages to tailor them to your specific needs.

Before you begin, make sure you've met the following prerequisites:

  • You have a marketplace account with the proper role. Creating a new extension requires you have the marketplace manager role.
  • You have the toolkit installed. If you haven't installed it yet, follow the provided instructions.

By following the instructions outlined below, you will successfully create a new extension in the marketplace and set it up with the toolkit. The steps are easy to follow, and you can always update the information later if needed:

Step 1. Create a new extension in the marketplace

  1. Log in to the marketplace using your credentials.

  2. Once logged in, navigate to the /admin/extensions section within the marketplace dashboard.

  3. Locate the "Create an extension" button at the top-right corner of the page and click on it to proceed.

  4. You will be directed to the "Create Extensions" form. Rest assured, any information entered in this form can be modified later if necessary.

  5. Provide a unique and descriptive name for the extension, as well as the desired path where the extension will be stored.

  6. Determine the extension type that best suits your needs. There are three options:

    a. Unlinked Page: A page accessible within the marketplace but not connected to a specific menu.

    b. Linked Page: Creates a new menu item accessible through the marketplace's navigation menus.

  7. If you opt for a Linked Page, you will need to select the appropriate menu (secondary or tertiary) and provide a label for the extension. The new extension will only appear in the marketplace once it's published and enabled.

  8. Establish the access role for the extension to control user accessibility:

    a. Everyone: Accessible to all users, including those who are logged out.

    b. Logged-in users: Accessible only to users who are logged in to the marketplace.

    c. Specific roles: Accessible exclusively to users with assigned roles.

  9. Customize the page layout, if necessary. While it's generally recommended to keep the default platform layout, you can remove the header/footer or modify the background color to suit your needs.

  10. After completing these steps, click "Save" to create the new extension.

Step 2. Create a new extension using the UI Toolkit

With the extension now configured, the following steps will guide you through linking the extension to actual code using the UI Toolkit:

  1. On the /admin/extensions page, locate your newly created extension in the table. It should be the first entry in the list.
  2. Hover over the info icon under the Status column. A tooltip will pop up.
  3. Copy the command displayed in the tooltip. You have the option to click the button to copy the command or to copy it manually. The command will resemble the following, adjusted with your extension's values:
    sfb-toolkit create-extension <extension-name> <marketplace-domain> <extension-path>
  4. Open a command-line window (i.e. a terminal or command prompt).
  5. Navigate to the workspace folder you created with the UI Toolkit's setup command.
  6. Execute the command that you copied earlier.
  7. cd to your extension's directory, which should be found under extensions/<my-extension-name>.
  8. Run npm install to install all of the extension's dependencies. (This might take some time).
  9. Once the command has completed, your extension will have been successfully created!

Congratulations! You've successfully created your first extension. Now that you have a basic understanding of the process, you can continue exploring our other guides to learn how to work locally and upload your first extension. Happy coding!

Was this page helpful?