Product widget

Summary of product widget endpoints

GET /admin/api/product_widgets - list all available product widgets for the current site.
GET /admin/api/product_widgets/1 - get data for a single product widget.
PUT /admin/api/product_widgets/1 - update attributes of a product widget.

List all available product widgets for the current site

GET /admin/api/product_widgets

Example response:

Status: 200 OK

[
  {
    "id": 1,
    "created_at": "2021-11-29T14:05:00.000Z",
    "updated_at": "2021-11-29T14:05:00.000Z",
    "content_settings": {
      "category_ids": [1, 2],
      "sort-order": "name-asc"
    },
    "design_settings": {
      "layout": "grid",
      "columns": 2,
      "item_width": 300,
      "item_height": 600,
      "mask_content_overflow": false,
      "show_navigation_buttons": true,
      "mobile_columns": 1,
      "show_cart_button": true,
      "show_price": true,
      "show_product_filters": true,
      "product_count": 32,
      "show_discount_label": false,
      "show_discount_percentage": false
    },
    "url": "http://helloworld.voog.co/admin/api/product_widgets/1",
    "content": {
      "id": 1,
      "name": "body",
      "created_at": "2021-11-29T14:05:00.000Z",
      "updated_at": "2021-11-29T14:05:00.000Z",
      "position": 1,
      "url": "http://helloworld.voog.co/admin/api/pages/1/contents/1"
    },
    "parent": {
      "id": 1,
      "title": "Products",
      "created_at": "2021-11-29T14:05:00.000Z",
      "updated_at": "2021-11-29T14:05:00.000Z",
      "type": "page",
      "url": "http://helloworld.voog.co/admin/api/pages/1"
    }
  },
  {
    "id": 2,
    "created_at": "2021-11-29T14:10:00.000Z",
    "updated_at": "2021-11-29T14:10:00.000Z",
    "content_settings": {
      "category_ids": [1],
      "sort-order": "name-asc"
    },
    "design_settings": {
      "layout": "grid",
      "columns": 4,
      "item_width": 300,
      "item_height": 600,
      "mask_content_overflow": false,
      "show_navigation_buttons": true,
      "mobile_columns": 1,
      "show_cart_button": false,
      "show_price": false,
      "show_product_filters": false,
      "product_count": 8,
      "show_discount_label": false,
      "show_discount_percentage": false
    },
    "url": "http://voog.voog.computer:3000/admin/api/product_widgets/2",
    "content": {
      "id": 2,
      "name": "body",
      "created_at": "2021-11-29T14:05:00.000Z",
      "updated_at": "2021-11-29T14:05:00.000Z",
      "position": 1,
      "url": "http://helloworld.voog.co/admin/api/pages/1/contents/2"
    },
    "parent": {
      "id": 1,
      "title": "Products",
      "created_at": "2021-11-29T14:05:00.000Z",
      "updated_at": "2021-11-29T14:05:00.000Z",
      "type": "page",
      "url": "http://helloworld.voog.co/admin/api/pages/1"
    }
  }
]

Parameters

per_page - elements per response (default: 50; maximum: 250).
page - requested page (default: 1).

Get data for a single product widget

GET /admin/api/product_widgets/1

Example request:

GET http://helloworld.voog.co/admin/api/product_widgets/2

Example response:

Status: 200 OK

{
  "id": 2,
  "created_at": "2021-11-29T14:10:00.000Z",
  "updated_at": "2021-11-29T14:10:00.000Z",
  "content_settings": {
    "category_ids": [1],
    "sort-order": "name-asc"
  },
  "design_settings": {
    "layout": "grid",
    "columns": 4,
    "item_width": 300,
    "item_height": 600,
    "mask_content_overflow": false,
    "show_navigation_buttons": true,
    "mobile_columns": 1,
    "show_cart_button": false,
    "show_price": false,
    "show_product_filters": false,
    "product_count": 8,
    "show_discount_label": false,
    "show_discount_percentage": false
  },
  "url": "http://helloworld.voog.co/admin/api/product_widgets/2",
  "content": {
    "id": 2,
    "name": "body",
    "created_at": "2021-11-29T14:05:00.000Z",
    "updated_at": "2021-11-29T14:05:00.000Z",
    "position": 1,
    "url": "http://helloworld.voog.co/admin/api/pages/1/contents/2"
  },
  "parent": {
    "id": 1,
    "title": "Products",
    "created_at": "2021-11-29T14:05:00.000Z",
    "updated_at": "2021-11-29T14:05:00.000Z",
    "type": "page",
    "url": "http://helloworld.voog.co/admin/api/pages/1"
  }
}

Update attributes of a product widget

PUT /admin/api/product_widgets/1

Example request:

PUT http://helloworld.voog.co/admin/api/product_widgets/2

Example data:

{
  "product_widget": {
    "design_settings": {
      "product_count": 32,
      "show_product_filters": true
    },
    "content_settings": {
      "category_ids": [2, 3],
      "sort_order": "created_at-asc"
    }
  }
}

Example response:

Status: 200 OK

{
  "id": 2,
  "created_at": "2021-11-29T14:10:00.000Z",
  "updated_at": "2021-11-29T14:15:00.000Z",
  "content_settings": {
    "category_ids": [2, 3],
    "sort_order": "created_at-asc"
  },
  "design_settings": {
    "layout": "grid",
    "columns": 4,
    "item_width": 300,
    "item_height": 600,
    "mobile_columns": 1,
    "show_cart_button": false,
    "show_price": false,
    "show_product_filters": true,
    "product_count": 32,
    "show_discount_label": false,
    "show_discount_percentage": false
  },
  "url": "http://helloworld.voog.co/admin/api/product_widgets/2",
  "content": {
    "id": 2,
    "name": "body",
    "created_at": "2021-11-29T14:05:00.000Z",
    "updated_at": "2021-11-29T14:05:00.000Z",
    "position": 1,
    "url": "http://helloworld.voog.co/admin/api/pages/1/contents/2"
  },
  "parent": {
    "id": 1,
    "title": "Products",
    "created_at": "2021-11-29T14:05:00.000Z",
    "updated_at": "2021-11-29T14:05:00.000Z",
    "type": "page",
    "url": "http://helloworld.voog.co/admin/api/pages/1"
  }
}

Parameters

product_widget - product widget data.
- content_settings - affect which products are filtered out to be included in this widget.
- category_ids - List of product category ID-s to be included.
- sort_order – The sorting for the widget (by price, by title etc).
  - name-asc – sorted by products' names alphabetically from A-Z (default).
  - name-desc - sorted by products' names alphabetically from Z-A.
  - price_min-asc - sorted by the products' (minimum) price from smaller to higher.
  - price_min-desc - sorted by the products' (minimum) price from higher to smaller.
  - created_at-asc - sorted by the products' creation date from oldest to newest.
  - created_at-desc - sorted by the products' creation date from newest to oldest.
- design_settings - affect how products are shown in this widget.
- layout - style of products collection view.
  - catalogue – catalogue view.
  - grid - grid view (default).
  - masonry – masonry view.
  - list - list view.
- columns - number of columns to display, supported in grid layout.
- item_width – width of the widget item in catalogue layout (in px).
- item_height – height of the widget item in catalogue layout (in px).
- mask_content_overflow – contain the content into the widget's container, supported in catalogue layout.
- show_navigation_buttons – toggle displaying the navigation buttons, supported in catalogue layout.
- mobile_columns - number of columns to display in mobile view, supported in grid layout.
- show_cart_button – toggle showing "Add to cart" vs "Look closer".
- show_price - pick whether to show price next to products.
- show_product_filters – toggle showing the product filters (sorting and search).
- product_count - number of products to display in product widget.
- show_discount_label – toggle showing label indicating that product is on sale.
- show_discount_percentage – toggle displaying discount percentage on discount label.