The IntelligenceBank Contentful Connector makes it easy to access your IntelligenceBank DAM assets directly from within a Contentful Content Model.
To install the Connector in your Contentful instance, click here to go to the Contentful Marketplace, click Install and follow the steps, alternatively:
-
In Contentful, click into Apps > Manage Apps
-
Select "IntelligenceBank Connector" from the available apps
-
Click Install
Once installed, to place IntelligenceBank content into a Content Model:
-
Click Add Field when in an applicable Content Model
-
Select JSON Object as the field type
-
Add a relevant name and click Create & Configure
-
In the Appearance tab, select "IntelligenceBank" from your Apps
-
Click Confirm and save your Content Model
IntelligenceBank resources are uploaded into a JSON object field type. Make sure any APIs you are using are directed to gather this JSON package.
When adding Content for the associated Content model, you'll now see the field that was created above.
-
Clicking on Select an Asset will open the connector .
-
Use your IntelligenceBank platform URL, email and password to login. To login via SSO, select the Browser Login option and follow the steps.
-
Navigate or search through the folders.
-
Click on the asset to insert it into your field. Note that only assets that are enabled for public sharing can be selected. You can also select a Global or Single Preset when available for supported image types. Learn more about how to optimize Image Assets with Public CDN Links in IntelligenceBank CMS Connectors here.
-
You can insert multiple assets by re-clicking the Select an Asset button and selecting more.
- For an Alt Text to be automatically populated with the Description of the Resource, or with the Title/Name if there is no Description available, you can implement this code in the frontend where you render the inserted IntelligenceBank Image assets:
function getAltText(imageData) { if (imageData.description && imageData.description.trim() !== '') { return imageData.description; } else if (imageData.name && imageData.name.trim() !== '') { return imageData.name; } return 'Image'; // fallback if both description and name are empty or not present }
// When rendering the image:
<img
src={intelligenceBankImageField['en-US'][0].url}
alt={getAltText(intelligenceBankImageField['en-US'][0])}
// other attributes as needed />
Comments
0 comments
Article is closed for comments.