Join us live as we unveil the all new Hygraph Studio!

Remote Source Data Picker

Give your editors the ability to pick data from Top Level Remote Sources for use in a remote source field their content

Give your editors a picker for data they need to attach to content via Remote Source fields. Instead of requiring an editor to know the proper ID for any external data, install this picker and configure each field to search through the data in a top-level remote source field and allow for editors to choose content in a human-readable way.

Install the app

Use this page to install the app in your project of choice.

If you don't already have a Remote Source. Add one following this guide. After a remote source is added, create a top-level remote source field that contains an array of data for use in the picker. Example top-level remote source field with products For example, if your remote source contains product information from your PIM system, a products top-level remote source makes sense. This would allow for an editor to choose a product on an individual document.

Add a Picker field

The picker fields for GraphQL sources work slightly differently than REST sources, so choose the correct field for your project and then configure. The interface for GraphQL picker vs. REST picker

When adding the field, you'll be asked to configure certain values to tell the picker what to display and what to store for the ID.

Configuration fields for Data Array Key, ID FIeld ID, API ID, and Title Field ID

Once these fields are added, your editors can then choose from the list provided by the API. Because this uses the top-level remote source fields, it means that the data available will always be in sync with what's available to your front-end API, as well.

Build your own app

Build your own app using our SDK and extend Hygraph functionalities according to your unique requirements.