This example integrates Hygraph with Bynder. It leverages Bynder's Compact View v2 component to browse assets from Bynder and use these within Hygraph content entries.
Deploy the code to Vercel, Netlify, GitHub Pages, or run locally, and install on Hygraph as a UI extension using the URL to your index page as the URL for your extension, and run the compatibility test.
You can get started with our hosted example, but you should deploy and maintain this on your own host: https://hygraph-uix-bynder.vercel.app/
When configuring the extension you'll be asked for the following:
| Name | Type | Description | Example |
|---|---|---|---|
| Default Domain | String | Your Bynder portal url | https://<your-domain>.bynder.com/ |
| Default domain editable | Boolean | Should users be able to change the default domain? | |
| Available asset types | String | Determines which asset types your users will be able to select. | ["image", "audio", "video", "document"] |
Follow the docs about Hygraph UI extensions.
npx degit hygraph/hygraph-examples/uix-bynder-input uix-bynder-inputYou'll then need to run a server locally, if you're on Mac, you can run a simple Python server within your project directory:
python -m SimpleHTTPServer 8000Alternatively, you could run something like http-server.