External Contexts

Specifications on pulling in dynamic data for use in DevHub

Overview

An external data source can be configured to be used as a dynamic data source outside the normal data you would be entering into DevHub or Google Sheets tied to DevHub projects.

Options

• Support for endpoints that support the following formats:

  • JSON

  • XML

  • Custom API clients (requires integration)

• Passing of Site/Landing page IDs along on the external context URL

• Passing of URL parameters (full path, partial path, UTM parameters) along on the external context URL

Example External Context File

Below is an example of a simple JSON External Context that contains a JSON list of products with a nested array of values for each product.

[
  {
    "product_id": 12345,
    "product_name": "Product 1",
    "price": "$55.99",
    "features": ["Feature 1", "Feature 2"],
    "images": {
      "large": "https://example.com/large-image.jpg",
      "small": "https://example.com/small-image.jpg"
    }
  },
  {
    "product_id": 54321,
    "product_name": "Product 2",
    "price": "$19.99",
    "features": ["Feature 3", "Feature 4"],
    "images": {
      "large": "https://example.com/large-image-2.jpg",
      "small": "https://example.com/small-image-2.jpg"
    }
  },
  ...
]

Configuration Settings

"EXTERNAL_CONTEXTS": [
  {
    "url": "http://sb-whitelabel.s3.amazonaws.com/product_feed.json",
    "key": "product_feed",
    "type": "json",
    "cache_time": 3600
  },
  {
    "url": "http://sb-whitelabel.s3.amazonaws.com/pricing_feed.json",
    "key": "pricing_feed",
    "type": "json",
    "cache_time": 3600
  }
]

Using data within templates and themes

Once configured, you will be able to access the External Context data from any Theme, HTML code module, or Template the same way you access other variables.

The key value on the External Context setting defines what variable that your data will be mapped to. In the case below, the product_feed variable was configured and the External Context was a list of products.

{% for product in product_feed %}
<div class="product">
  <h3>{{ product.product_name }}</h3>
  <p>{{ product.price }}</p>
</div>
{% endfor %}