Card configuration options

This page is intended as a helpful guide to make you aware of common mistakes in writing and editing card config, and hopefully help you find them in your own config if you are running into errors.

Where can I set the config?

Some ThoughtFarmer cards have configuration options available that allow customization and parameter changes without having to actually change and code. These configuration options are passed to the card in the details tab of the card editor.

Set your cards default configuration in the details tab of the card editor

Each set of configuration options is unique to the card. Some might have required configuration options, and some optional. Please check the configuration page in the Custom card marketplace for your cards config options, or, if applicable, the notes sent to you by the developer.

How does the card configuration work?

Card configuration options are passed into the cards code to increase flexibility and help each card suit multiple clients needs and data formats.

There are two ways that you can configure a card:

1. Use default configuration for every card

• When you configure the card through the admin panel like in the screenshot above, each card will receive those configuration options.
• When a card is added to a page, it will automatically receive that configuration.

2. Per instance configuration 

• If you want to pass, for example, different source content ids to different instances of the card (meaning the same card on different pages), you can check the "Allow card configuration on edit page" checkbox on the Details tab of the page edit screen in the admin panel. You can see this in the screenshot above.
• If this is checked, each new instance of a card will still receive the default configuration. It will just be possible to to edit the configuration through the page's template editor.
• If this is not checked, you will not be able to configure the card through a page's template editor.

Click the gear icon on the card to set configuration for that specific card only

What does it look like?

All configuration is expected to be written in a certain format called JavaScript Object Notation (JSON). Having the correct formatting in JSON is very important. Things as small as a missing apostrophe can cause parsing errors, which means the config cannot be read by the code and your card will break.

Below are examples of sets of configuration options where each line represents one config option. Some sources of common errors are noted in the list below.

{
"customTitle" : "My chosen custom title",
"winnerPoints" : "50",
"endDate" : "2018-01-24"
}

Common config errors

1. Curly Braces { ...config goes here.... }

Your config must be wrapped in curly braces.

2. Missing/extra apostrophes

Each config name (eg. "bronze") and most values, must be enclosed by apostrophes. Please check your card's configuration page for the correct config for the card you are working on.

{
"bronze" :  25,
"customTitle" : "My chosen title",
"customDate": "2019-04-02",
"customArray" : [325,235,2356]
}

3. Missing/extra colon between configuration name and value

Between each config name and value there must be a colon (Eg. "bronze" : 25 )

4. Configuration parameter name is wrong

Look out for capitalization, and refer back to the notes given you by the developers or the card configuration page on the correct names for each config value.

5. Date is in wrong format

If your customization options include a date, it must be in the correct format. Refer back to the notes given you by the developers on the correct formatting for your card.

6. Missing commas

Place a comma between each line item or name-value pair except for the last one.
*Notice in the example above there is no comma after "endDate" : "2018-01-24"

Still having trouble?

If you are still having trouble with setting your config, please open a Support request on our Helpdesk.

Is the above list missing something? Still confused? Leave a comment below :)