Quick Start: The Basics

In this tutorial, we'll go through how to set up an Agility CMS instance, create some content, and then how to access that content using the Agility Content Fetch (REST) API.

You'll need a login for Agility CMS in order to create an instance.

Sign Up for an Account

Navigate to https://manager.agilitycms.com/ to sign up for a new account. You can sign up using GitHub, Google, Microsoft, or Email/Password combo.

Sign up for an Agility Account

Fill out your profile details to complete the sign up.

Form field to sign up for Agility CMS

Create a New Instance

Once you've logged in to your account, you can create a new instance.

Select an instance starter from the list. We recommend using one of the Blog Starters if you are new to Agility, but this tutorial will work with any starter/framework that you've selected.

Agility CMS starter options 

Choose a name for your instance and click Go.

Create a Content Model

In order for editors to create content or to access content from the API, you'll need to define a Content Model that dictates what fields the content is comprised of.

Navigate to Models > Content Models.

Content models in Agility CMS

In the example above, there are already a few Content Models defined. In our case, we are going to create a new one.

Click on the Add button to create a new Content Model.

Enter a Banner as the Name, and give it a description. Click Save to create the new model.

Creating new models with Agility CMS

Click the Add a Field button to add your first field to your newly created model.

Name the first field Title and ensure the Text field type is selected. Click Add Field to add the field to your model.

Creating fields and properties with Agility CMS

Next, click Add Field button again and this time create a field for an image. Name your field Image and ensure the Image field type is selected.

Naming images with Agility CMS

Click Add Field to add this to your model. 

Click Save to save the changes to your model.

Saving changes in Agility CMS

Initialize Content

Now that you've set up a structure for content, you can now initialize content to use this model. This will allow editors to manage content for it and expose it to the API.

Under the Content Using this Model area, click the Add here or + button to create a content list based off of the Banner model we created.

Name your content list Banners and click the Create Content button to initialize the list.

Initializing banners in Agility CMS

Now that you've initialize the list of Banners, you can access this content list to start entering content items by navigating to the Content (area) from the main navigation.

Accessing banners in Agility CMS

Add Content

Now that you have your list of Banners available, you can now start to enter content for it. 

Click the New + button to create a new Banner.

Populate the fields and click Save to save your content item.

Adding content with Agility CMS

Now that you have at least one item in the list, you are ready to query the API to retrieve the list of Banners.

Access Content

You can access content using the Content Fetch REST API directly (as we will in this example), however its important to note that Agility also supports accessing content through a variety of SDKs for common programming languages.

To retrieve our list of Banners from the API, we'll need to collect some information we'll need to authenticate and request this content.

  • Guid - this is the ID of your instance, you can retrieve this by navigating to API Keys
  • API Key - this is the key you'll use to authenticate with Agility CMS, you can retrieve this by navigating to API Keys
  • API Type - this is the type of API request we are making, valid values are fetch (published content) or preview (returns content that is not published)
  • Reference Name - this is the identifier of the content list we are trying to lookup in Agility, you can retrieve this by clicking the Settings button on the the details of the content list - in our case this will be Banners
  • Locale - this is the locale code of the content you want to request (i.e. en-us)

Making the API request:

curl https://api.aglty.io/3e1a3c85-u/preview/en-us/list/banners -H 'apiKey: defaultpreview.14e9c38e5e5aeb7bf8280aa1098b592e51ed7577fc6706dfb1ee2659462708c4'
{
  "items": [
    {
      "contentID": 130,
      "properties": {
        "state": 1,
        "modified": "2021-09-15T16:24:45.173",
        "versionID": 1040,
        "referenceName": "banners",
        "definitionName": "Banner",
        "itemOrder": 0
      },
      "fields": {
        "title": "Hello World 🌎",
        "image": {
          "label": null,
          "url": "https://cdn.aglty.io/cwnmkkqb/posts/canadian.jpg",
          "target": null,
          "filesize": 143582,
          "pixelHeight": "830",
          "pixelWidth": "1200",
          "height": 830,
          "width": 1200
        }
      },
      "seo": null
    }
  ],
  "totalCount": 1
}