Skip to main content

Experience Type

An Experience Type is an extension that enables your admins to create new Showpad Experiences.

Declare in Manifest

The first thing to do when adding an Extension is to define in the manifest.json file:

...
"experienceTypes": [
{
"extensionKey": "my-experience",
"name": "My Experience",
"description": "Excellent description",
"resources": {
"folder": "my-experience"
}
}
]
...

Required Files

The source code of your Experience type lives in the resources folder that you defined in the manifest. This folder contains all of the files (JS, CS, images, etc.) of your extension. In particular, two main files:

Index

This is the entry point your Experience type. When your extension is opened in Showpad, the index file is displayed inside an iFrame with the configUrl query parameter appended to the URL defined in the index.html file:

index.html?configUrl={path_to_config_file}

The configUrl is used to retrieve the configuration of your Experience. To fetch the config, you can use the Showpad.parseConfig() SDK function:

const config = await Showpad.parseConfig();

Config

The config.json file defines the configuration of your Experience type. It describes what content will be shown in your Experiences (e.g., assets, labels, tags, etc.).

The Showpad administrator will be able to change the content of this configuration in the Online Platform when creating/editing and Experience.

Your config.json file should follow this structure:

PropertyDescription
versionThe version of the configuration structure. Currently at version 1.
labelsEverything related to text and copy.
contentsAn object containing all of the links to Showpad content. Here are the supported types: asset, tags, channel, folder, url

For more detail, you can refer to this page Define Experience Config.

Example

{
"version": 1,
"labels": {
"homepage": {
"title": "Your own Experience",
"subtitle": "How to get started with your own Experiences."
},
"slide1": {
"title": "Getting Started",
"contents": "This Experience thing is going to be YUUGE"
}
...
},
"contents": {
"slide1": {
"presentation": {
"type" : "asset",
"value" : "d5d7736f4ecf8106f0be8ba35d11a2c4"
}
}
...
}
}