Contentful Cross Space References is a simple app that makes it easy to create a relationship between content in multiple Contentful spaces via the Contenful UI:
To use this app in your spaces, follow the below steps:
- Install the app to your space
- Select the Space and Environment that you want to install the app in, then select "Continue" to be redirected to the Apps page in the selected space/environment:
- Select "Authorize access" to allow Cross Space References app to access your space, after which you'll be redirected to the App Configuration screen:
- This app will only be able to be installed after you've defined at least one external space from which you'd like to create relationships to this space's content, so select the "Add Space Configuration" button:
- In the modal window, enter a Space ID and Content Delivery API token that will be used to retrieve Content from your external space as seen here
(Note: you will be unable to save this configuration if the Space ID and Token are invalid.):
. - Select Save in the modal window, at which point you'll see the external space listed in your App Configuration:
- Select "Install".
- Note: Additional external spaces can be added after installation by returning to this screen via the App tab -> Manage Apps
- From the Apps management page, selecting the dropdown menu to the right of your Cross Space Configuration app and choose the Configure option.
- Once back in the App Configuration Screen, you can add a new space configuration and select "Save" to update your new configurations.
- _You can also install this app in additional spaces from the App Managment tab of those spaces by selecting the Cross Space References app from the list of Available apps, then following steps 3-7 above.
- For every Content Type you'd like to be able to reference content from an external space, create a new "JSON Object" field, then set the appearance for this field to use the Cross Space Reference App:
When using the Cross Space References app, the reference will be stored as a JSON object with the following structure:
{
"sys": {
"type": "Link",
"linkType": "CrossSpaceEntry",
"id": "<entry-id>",
"space": {
"sys": {
"type": "Link",
"linkType": "Space",
"id": "<space-id>"
}
}
}
}
To retrieve the entry data, make an API call to the appropriate space and query by entry id as described in our documentation: Getting a single entry
To contribute back, fork this project and clone the repo, then run npm install
in your local directory.
This project was bootstrapped with Create Contentful App.
In the project directory, you can run:
Creates or update your app definition in contentful, and runs the app in development mode. Open your app to view it in the browser.
The page will reload if you make edits. You will also see any lint errors in the console.
Builds the app for production to the build
folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes. Your app is ready to be deployed!
- Create a new app definition as described in Building your first app.
- Give your app a name (such as Cross Space References).
- Configure your app:
- Set the frontend url of your app to the local development url from
npm run start
(http://localhost:3000 by default), or Select "Hosted by Contentful" and upload the output ofnpm run build
- Select the checkboxes for "App Configuration Screen" and "Entry Field", then select the checkbox for "JSON Object" below "Entry Field"
- Set the frontend url of your app to the local development url from
- Select "Save", then select "Save" in the confirmation modal that appears.
- From the App Definition window, select the down arrow next to "Actions", then select "Install to space".
- Select a Space and Environment where you'd like to install this app in the modal window that appears, then select "Continue".
- Authorize the Cross Space References app for your space, after which you'll be redirected to the App Configuration screen, as seen here:
- Follow installation steps above, beginning with step 4.
Make any necessary changes then submit a PR to contribute the changes back to CF.