SDKs

Edgewise offers two SDKs (PHP and JS) that reduce the amount of work required to use the Edgewise GraphQL API. Both require an API access token.

This is the recommended way to integrate Edgewise into your website.

PHP SDK

The Edgewise PHP SDK provides convenient access to the Edgewise GraphQL API from applications written in PHP (eg, WordPress).

For more information on installation and capability, visit our GitHub repo

JavaScript SDK

The Edgewise JavaScript SDK (edgewise.js) splits the difference between easily embedded WebComponents, and the fully featured GraphQL API. There are two main capabilities to the Edgewise JavaScript SDK:

  • Edgewise Components
  • Edgewise Analytics

Edgewise Components

The Edgewise JavaScript SDK provides the ability to programatically create UI components. Under the hood, these are exactly the same as the WebComponents; but without the ShadowDOM limitation.

Usage

To use Edgewise Components, you'll need to include our SDK library; which is hosted on our CDN. For example, put this script include in the header of your page:

<head>
  <script src="https://libs.edgewise.cloud/edgewise.js@1"></script>
</head>

In the body of the page, you now have access to the Edgewise JS SDK.

If your website has multiple pages and you wish to capture UTM information no matter which page they initially land on, include this script on every page of your website, and initialize the library.

<script src="https://libs.edgewise.cloud/edgewise.js@1"></script>
<script>
  Edgewise()
</script>

This is an example of a contact form created using our Edgewise SDK.

<body>
  <div id="contact"></div>

  <script>
    Edgewise()
    .components()
    .create('ProjectContactForm', {
      projectId: 'ID_OR_SLUG_GOES_HERE'
    })
    .mount('#contact')
  </script>
</body>

This is an example of an inventory list created using our Edgewise SDK.

<body>
  <div id="inventory-list"></div>

  <script>
  var edgewise = Edgewise()
  var components = edgewise.components()

  components
    .create('ProjectInventoryList', {
      projectId: 'ID_OR_SLUG_GOES_HERE'
    })
    .mount("#inventory-list")
  </script>
</body>

Component Names

  • ProjectOpenHouseFlash
  • ProjectInventoryGrid
  • ProjectInventoryList
  • ProjectContactForm
  • ProjectDocuments
  • UnitBuyNowButton

See all components here.

Edgewise Analytics

If you are familiar with Google Analytics or Facebook Pixel, then Edgewise Analytics should look familiar. Once the SDK library is included in the page and initialized, you can start tracking events.

The tracking "push" method has two arguments:

  • Required: the event name (eg PageView, or Contact form submit)
  • Additional event properties

By default, the SDK will track page detail like the URL, browser, screen size, etc.. Unlike some tracking libraries, we do not track the page view by default. So you will need to manually track.

Usage

To use Edgewise Analytics, you need to first create a tracker in Edgewise (Seller Central). This provides the necessary tracker ID. You can create a tracker under organization settings.

Once you have a tracker, you'll need to include our SDK library; which is hosted on our CDN. If you're already including the code elsewhere on the page (eg for components), then you do not need to include it again. For example, put this script include in the header of your page:

<head>
  <script src="https://libs.edgewise.cloud/edgewise.js@1"></script>
</head>

In the body of the page, you now have access to the Edgewise JS SDK.

<body>
  <script>
  var edgewise = Edgewise()
  edgewise.analytics.init('[TRACKER ID]')
  edgewise.analytics.push('PageView')
  </script>
</body>

PageView is a standard event. However, you can push arbitrary custom events as well. It is recommended that you start with the standard PageView event before sending custom events.