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:
Property | Description |
---|---|
version | The version of the configuration structure. Currently at version 1. |
labels | Everything related to text and copy. |
contents | An 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"
}
}
...
}
}