Saleor 3.1: Gift Cards, Click & Collect, improved extensibility

Saleor 3.1 is here! Introducing two new features in a preview stage — Gift Cards, Click & Collect, improved extensibility, plus much more! In this blog post, you will find a summary of the most important changes.

Saleor is a headless commerce platform powered by GraphQL, Python, React and is Next.js ready. It has reached more than 15000 GitHub stars. As an open-source project, you can run and maintain Saleor on your servers for free. However, if you don’t want to maintain the platform yourself, you can use Saleor Cloud (public release coming soon). This way, your developers don’t have to worry about backend deployment, version updates, scalability, and availability.

Saleor 3.1 release

Some new features are marked as “Feature Preview” in the Dashboard. They have been introduced at early-stage development in order to gather feedback from our clients and the community. Those features may change with future releases. If you have any suggestions, please use GitHub Discussions or open an issue.

Saleor 3.1 extends the capabilities of the recently released v3.0, which was the most ambitious update yet and went through a lot of invaluable battle testing. To learn more about all the changes and improvements, check the changelog of v3.1.

Gift Cards

Note: this functionality is in a feature-preview stage.

Users can either create gift cards and issue them to customers or sell them as a standard product. In order to sell a gift card product, you first need to create the gift card product type.

Only staff users with the MANAGE _ GIFT _ CARD permission can create gift cards. Saleor allows creating single or multiple gift cards at the same time. They can be created in the customer details view or the Gift Card section of the Dashboard’s Catalog.

The example below shows how to create a gift card in the Saleor API.

mutation {
  giftCardCreate(
    input: {
      balance: { amount: 100, currency: "USD" }
      userEmail: "test@example.com"
      channel: "channel-USD"
      expiryDate: "2050-10-10"
      isActive: true
    }
  ) {
    giftCard {
      id
      code
      last4CodeChars
      isActive
      expiryDate
      initialBalance {
        currency
        amount
      }
      currentBalance {
        currency
        amount
      }
      events {
        type
      }
    }
  }
}

To learn more about Gift Cards, please check our Developer and Dashboard documentation.

Click & Collect

Note: this functionality is in a feature-preview stage.

The click & collect feature is sometimes referred to as the hybrid e-commerce model. This is where a customer can order a product through a website or app and then pick it up at a specific physical store. Now brands can meet the needs of customers who would like to pick up their orders elsewhere.

Store users can create specific warehouses designed to support this functionality. Saleor allows users to choose if an order can be sent from any warehouse to a specific store or limit picking up an order to only one physical location.

To learn more about the click & collect feature, please check our documentation.

Swatch attribute

We are continually improving the attribute system by adding new attributes. In 3.1 we introduced Swatches. They allow admins to define values as color values or images for the attribute. The most common appliance is to use it as a color swatch on the product page or as a filter on listing pages.

Saleor extensibility — app extensions

App extensions allow extending different dashboard views by mounting the extension app inside a popup or redirecting users to the main app’s page. The extension is added by specifying it in the app’s manifest. The sample manifest below defines two extensions that will be attached to the dashboard:

{
  ...
  "extensions": [
      {
        "label": "Create with Sample app",
        "mount": "PRODUCT_DETAILS_MORE_ACTIONS",
        "target": "POPUP",
        "permissions": [
            "MANAGE_PRODUCTS"
        ],
        "url": "https://example.com/extension/"
      },
      {
        "label": "Create with App and redirect",
        "mount": "PRODUCT_OVERVIEW_CREATE",
        "target": "APP_PAGE",
        "permissions": [
            "MANAGE_PRODUCTS"
        ],
        "url": "/extension/redirect"
      }
    ],
}

Learn more about app extensions here.

New synchronous webhook

Webhooks allow you to set up integrations that subscribe to events. Synchronous webhooks can be used for extending Saleor without the need to deploy plugins on the API server. Saleor 3.1 allows integration with external shipping providers. A new synchronous webhook has been introduced for shipping methods used by checkouts:

SHIPPING _ LIST _ METHODS _ FOR _ CHECKOUT.

Learn more here.

Changelog

The above notes are not the only changes delivered. Please check the changelog of the Saleor 3.1 release. The migration guide can be found here.

Thank you!

In this blog post, we highlighted some of the key changes and improvements in Saleor 3.1. A big thank you to all contributors and community members for their input! Follow our Twitter and sign up for our newsletter to stay up to date with the latest info about Saleor!

Cheers!

–The Saleor Team