# Contentful

## Description:

The features of the Contentful DAM App include:

* **Asset Manager Widget:** Manage and insert assets directly within the Contentful content editor, streamlining the asset handling process.
* **Multiple File Type Support:** Supports a variety of file types, including images, videos, and documents.
* **Metadata configuration:**
  * Asset metadata from Scaleflex DAM will show on your Rest/GraphQL response
  * You can choose which attributes will be saved in Contentful content field
* Configuration for limited file types and maximum file count

## Installation <a href="#od_4941c597" id="od_4941c597"></a>

### Prerequisites <a href="#prerequisites" id="prerequisites"></a>

1. [Register for a demo](https://www.scaleflex.com/request-a-demo) if you don't already have a DAM account.
2. Sign up to Contentful.

Contentful is 100% Cloud Native, so you have to sign up for a hosted CMS at [https://be.contentful.com](https://be.contentful.com/) and you will get a link to your space:

```
https://app.contentful.com/spaces/{Your Space ID}/home
```

### Step 1. Install from Contentful Marketplace <a href="#od_c5ae8232" id="od_c5ae8232"></a>

**There are 2 ways:**

* To install the Contentful DAM App, visit the [Contentful Marketplace](https://www.contentful.com/marketplace/app/scaleflex-filerobot/) and click 'Install'. Follow the prompts to complete the installation.

[![](https://www.ctfstatic.com/button/install-small.svg)](https://app.contentful.com/deeplink?link=apps\&id=7jJoGTAjjjTZqedusaIU7M)

<figure><img src="https://docs.scaleflex.com/~gitbook/image?url=https%3A%2F%2F3586816136-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252Fl0Yvbyw1t10jWRzoi0FW%252Fuploads%252FebgI3VxBH1tKTHMul16l%252Fimage.png%3Falt%3Dmedia%26token%3D6aa2b271-02a1-4bb8-83e7-54718fa314be&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=3ba1df83&#x26;sv=1" alt=""><figcaption></figcaption></figure>

<figure><img src="https://2536208400-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fqsq2dR7Fjagf5eTifWZx%2Fuploads%2FDjjbB2VM81OGdkRf4ceo%2Fimage.png?alt=media&#x26;token=0bfdd4ae-608a-4109-9acd-bd1e9c45f456" alt="" width="375"><figcaption></figcaption></figure>

<figure><img src="https://2536208400-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fqsq2dR7Fjagf5eTifWZx%2Fuploads%2FJGiECVctjGRbf1tp2POi%2Fimage.png?alt=media&#x26;token=fe28a11c-cf0d-4c3d-8385-0252abd5a9d7" alt=""><figcaption></figcaption></figure>

<figure><img src="https://2536208400-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fqsq2dR7Fjagf5eTifWZx%2Fuploads%2FVmUvfurtDOGP9xzimbz1%2Fimage.png?alt=media&#x26;token=b34a79b3-c225-4e07-9ba2-58e1dd6c1dbc" alt=""><figcaption></figcaption></figure>

### Step 2. Configure the app <a href="#od_b9b03603" id="od_b9b03603"></a>

<figure><img src="https://2536208400-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fqsq2dR7Fjagf5eTifWZx%2Fuploads%2FBGf9aAckxjkY3qlHGIlu%2Fimage.png?alt=media&#x26;token=28771f16-c880-40dd-8e0c-4cb1ef82e66d" alt=""><figcaption></figcaption></figure>

<figure><img src="https://docs.scaleflex.com/~gitbook/image?url=https%3A%2F%2F3586816136-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252Fl0Yvbyw1t10jWRzoi0FW%252Fuploads%252FSeOX4WIOWujsLu3kX1gU%252Fimage.png%3Falt%3Dmedia%26token%3D16dd6dbd-852f-4183-a00a-883114026f8b&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=1390ac5e&#x26;sv=1" alt=""><figcaption></figcaption></figure>

**Configuration keys(\* = required):**

* **Token\*:** This is the Scaleflex DAM token found in the Asset Hub interface, which allows the app to connect to your DAM account
* **Security Template\*:** Found in the *Project > Access > Security Templates* tab, this key is required for secure access
* **Asset directory:** Defines the top-level folder for storing assets. The default is the root directory (/).

{% hint style="info" %}
*You can quickly validate your token and security template by clicking **"Validate Scaleflex DAM Setting"***
{% endhint %}

* **Limit:** The max number of files that can be added to a single field
* **Attributes:** A string containing information (JSON attributes) that you want to store in a Contentful field, separated by commas. For example: meta, info.
* **Limit Type(s):** String type, acceptable values: any or all of the following: 'image', 'video', 'audio', 'application', 'application/zip', 'application/x-zip-compressed', 'application/vnd.rar', 'application/x-rar-compressed', separated by commas.

{% hint style="info" %}
Please refresh your browser (Ctrl + F5)  each time you change the settings so they take effect.
{% endhint %}

## Usage <a href="#od_da860408" id="od_da860408"></a>

### Field Setting <a href="#field-setting" id="field-setting"></a>

* In any content model, create a new **JSON Object** Field

<figure><img src="https://docs.scaleflex.com/~gitbook/image?url=https%3A%2F%2F3586816136-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252Fl0Yvbyw1t10jWRzoi0FW%252Fuploads%252FSMrQu8MAqljmRxWkIptE%252Fimage.png%3Falt%3Dmedia%26token%3D7efc1b4d-277a-4ef8-94ab-8d4077f9ad31&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=9f8ba050&#x26;sv=1" alt=""><figcaption></figcaption></figure>

* In Appearance section, choose Scaleflex DAM

<figure><img src="https://docs.scaleflex.com/~gitbook/image?url=https%3A%2F%2F3586816136-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252Fl0Yvbyw1t10jWRzoi0FW%252Fuploads%252FreLVat521BDuo6bmXmG9%252Fimage.png%3Falt%3Dmedia%26token%3Dc7f8adfe-50a5-4c71-8715-c3db50258238&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=65d02982&#x26;sv=1" alt=""><figcaption></figcaption></figure>

### Content Editor <a href="#content-editor" id="content-editor"></a>

* In any Scaleflex DAM Field, to insert assets from DAM to content, click on Asset Manager

![](https://docs.scaleflex.com/~gitbook/image?url=https%3A%2F%2F3586816136-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252Fl0Yvbyw1t10jWRzoi0FW%252Fuploads%252FOpHqS2lODn6PQRvphZQ3%252Fimage.png%3Falt%3Dmedia%26token%3D2f09f77f-1644-4c73-83db-205ef75c9a93\&width=768\&dpr=4\&quality=100\&sign=7f397bea\&sv=1)

* An Asset Dialog will appear:

<figure><img src="https://docs.scaleflex.com/~gitbook/image?url=https%3A%2F%2F3586816136-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252Fl0Yvbyw1t10jWRzoi0FW%252Fuploads%252FB4OvbDiI8sgeXKuL4JgW%252Fimage.png%3Falt%3Dmedia%26token%3D69d13356-6c02-4935-af91-2b4fefae7396&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=77b632c8&#x26;sv=1" alt=""><figcaption></figcaption></figure>

* Select one or more assets you want to add to the field.
* Click "Insert" on the top right corner of the opened Dialog
* You have 2 options:
  * Insert as original
  * Insert as transformed (change the image format or size before inserting)
* After inserted, assets will appear like below:

<figure><img src="https://docs.scaleflex.com/~gitbook/image?url=https%3A%2F%2F3586816136-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252Fl0Yvbyw1t10jWRzoi0FW%252Fuploads%252FYJ23iCKDvAqbFQQuehE6%252Fimage.png%3Falt%3Dmedia%26token%3D7a422f26-bd37-42a2-99cc-13a00a1ca5d0&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=d12d887d&#x26;sv=1" alt=""><figcaption></figcaption></figure>

**You can:**

* Reorder assets position by drag and drop

<figure><img src="https://docs.scaleflex.com/~gitbook/image?url=https%3A%2F%2F3586816136-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252Fl0Yvbyw1t10jWRzoi0FW%252Fuploads%252FKF9pv21eG0gfPHjMBFxV%252Fimage.png%3Falt%3Dmedia%26token%3D04451264-9c7c-4331-892b-19da2c99a81e&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=1e2b39e6&#x26;sv=1" alt=""><figcaption></figcaption></figure>

* You can delete unwanted asset(one by one - click on the 3 dots icon `...` then select "**Delete"**) or click "**Clear all***"* to remove all selected assets

<figure><img src="https://docs.scaleflex.com/~gitbook/image?url=https%3A%2F%2F3586816136-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252Fl0Yvbyw1t10jWRzoi0FW%252Fuploads%252Fqa8vPt4k6kAIYyNu1H2l%252Fimage.png%3Falt%3Dmedia%26token%3D37f2247b-527f-45a1-89b0-745464e68ca2&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=db71f59c&#x26;sv=1" alt=""><figcaption></figcaption></figure>

* If any changes are done from the Hub, please use **"Refresh Assets"** button so to update Contentful

<figure><img src="https://docs.scaleflex.com/~gitbook/image?url=https%3A%2F%2F3586816136-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252Fl0Yvbyw1t10jWRzoi0FW%252Fuploads%252FHVUYe7tNQo8A2PUk24oR%252Fimage.png%3Falt%3Dmedia%26token%3D60162937-dd2d-45e8-849d-7b57c933941c&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=30827701&#x26;sv=1" alt=""><figcaption></figcaption></figure>

## JSON format <a href="#od_f9476583" id="od_f9476583"></a>

The following is an example of how metadata for inserted assets is stored in JSON format within Contentful.

```
[
    {
        "url": "https://try.filerobot.com/Widget_demo_folder/%24R202RV2-AiiacoEg.jpg",
        "id": "2a9de85c-406a-5101-9ab5-7b6259250005",
        "name": "$R202RV2-AiiacoEg.jpg",
        "extension": "jpg",
        "type": "image/jpeg",
        "attributes": {
            "meta": {
                "boolean": true,
                "creator": "Hiep",
                "date": "2024-09-11",
                "dc_description": "dc description test",
                "description": {
                    "en": "neweded"
                },
                "multi_select": [
                    "Blue",
                    "Green",
                    "Yellow"
                ],
                "price": {
                    "default": "12"
                },
                "product_id": {
                    "default": "IIHHYTTD22"
                },
                "sport": "Sport test",
                "test": "None",
                "test-multi-select": [
                    "Test 2",
                    "Test 1"
                ],
                "test-price": {
                    "eur": "20"
                },
                "testsd": "2024-09-10",
                "title": {
                    "en": "testssssss"
                }
            }
        }
    }
]
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.scaleflex.com/digital-asset-management-dam/plugins-and-connectors/plugins/contentful.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
