Cookies

This website uses cookies to ensure you get the best experience on our website.

Guide

Customization Guide

The Customization Guide explains how to make changes to your storefront, modules, routes, and hooks/actions while keeping your store organized and functional.

This guide helps you understand what changes are needed, how to apply them, and best practices to ensure smooth customization.

1. Customizing Storefront

Storefront customization involves visual or functional changes on the frontend:

  1. Updating Existing Pages or Sections

    • Identify the module responsible for the page or section.
    • Navigate to the module and update relevant settings or blocks.
    • Example: Updating a "Featured Products" slider → change module settings for product collection, layout, or order.

  2. Adding New Pages

    • Determine which module will power the page content.
    • Create a new route linked to the module.
    • Configure route type, HTTP method, response type, and authentication/authorization.
    • Update any required sections or templates in the theme.

2. Module Customization

Modules control specific functionality or content.

Steps to Customize a Module:

  1. Navigate to the Modules section in the admin panel.
  2. Select the module you want to customize.
  3. Update fields, relationships, or settings relevant to the change.
  4. Save changes.
  5. Verify that the frontend reflects the updates.

Always ensure changes do not break other modules or routes.

3. Route Management

Routes control how users access pages and features.

  1. Creating a New Route

    1. Navigate to Routes → Add New Route.
    2. Enter Route Name and URL Path.
    3. Select Route Type (Inbound/Outbound).
    4. Choose HTTP Method (GET, POST, etc.).
    5. Select Response Type (HTML, JSON, XML).
    6. Configure Authentication & Authorization if required.
    7. Save the route.

  2. Editing an Existing Route

    • Navigate to Routes List.
    • Click Edit next to the route.
    • Update URL, module, type, HTTP method, response, or security rules.
    • Save and test the route.

  3. Adding Route Conditions

    • Conditions allow dynamic filtering of data based on module, user, or other criteria.
    • Configure conditions under route settings to control which data appears and when.

4. Hooks & Actions Customization

Hooks and actions allow custom logic to run at specific events.

  1. Creating New Cases

    1. Identify the hook or action where the customization is needed.
    2. Add a new case to perform the desired action.
      • Example: Send a notification after a new order is created.
    3. Configure conditions for the case (e.g., only for certain modules or user roles).
    4. Save and test the hook/action.

  2. Editing Existing Cases

    • Open the hook or action.
    • Modify the logic or conditions as needed.
    • Test thoroughly to ensure other cases are unaffected.

5. Best Practices

  • Always backup your theme and modules before customization.
  • Test changes in a staging environment before applying to live store.
  • Document all changes for future reference.
  • Maintain consistent naming conventions for modules, routes, and hooks/actions.
  • Use route conditions and hook conditions to minimize unnecessary actions and improve performance.
  • Keep authentication and authorization in mind when creating new routes or hooks.

Customization is about making your store functional, unique, and tailored to your business needs while ensuring security and maintainability.

Previous Article