Set up an Airtable and Without Code Collection for Sort Ordering:
- Open your Airtable and click on Grid View.
- In the “Add a view” options, select Grid.
- Name the grid. For this demonstration, we will use “grid” for the name. Note that the name you create will not affect the name of the Airtable. The view option simply creates a new view of the table, and does not affect any data in the table.
Now that we’ve set up a grid view for our Airtable, we will make a new Collection in the Without Code builder, and connect it to the Airtable grid view.
- Create a new Collection: Content > Collections > New Collection > Airtable
- Above the first field (Airtable API Key), click the link for Airtable Account Page. This will load the Airtable.com site (log in if you need to).
- Copy your API key.
- Paste the API key into the Airtable API Key field.
- Back in the Without Code builder, click on the Airtable API Page link. This will take you to the Airtable site.
- Select your Airtable from the list.
- In the sidebar, click on the name of the Airtable.
- Select “List Records” from the options that appear below your Airtable in the sidebar menu.
- Find the API URL encoder tool link, and click it.
Scroll to the bottom of this page, and enter the name of your Airtable grid in the View section. This is what we did in the first few steps in the beginning of the instructions.
- Now on the very bottom of the page you will see the URL has been updated with the grid view name.
- Copy the URL.
- Paste the URL into the second field on the Collection creation page in the Without Code builder.
- Click the Import Fields button.
- After importing the fields and connecting your collection to a list widget, your dynamic content will now be listed in the same order it is shown on the Airtable.
- Any changes in ordering made in the Airtable will be reflected in the connected widget on your site. Just make sure to use the Refresh Data button at the bottom of your Collection page in order to capture the changes.
For a complete overview and video tutorial of Dynamic Pages, check out our 5-part video series: