Carrd Integration
How to add Ziggeo to Carrd
Adding Ziggeo to Carrd
Adding Ziggeo to Carrd is very simple and will take you about the same time to add and have Ziggeo on your Carrd form as viewing the video about it.
It can be placed in 3 different sections:
- Adding the header code
- Adding Recorder code (optional)
- And finally adding Player code (optional)
Video Guide to adding Ziggeo to Carrd
Videos can say more than hundred words and often they do. In this case no words just a simple click through guide to help you see where you would get something as well as where you would add it to.
- If you are not sure how to get to some part, follow the same steps highlighted bellow with some useful links.
Step 1 - Adding header code
The header code is very important. It will load our system into your Carrd form for you.
First, you will need to open your form. Once you do, click on the plus to add another field to your Carrd form.
Choose the field type Embed
. This will allow you to add the HTML code directly.
For this specific one, we want the style to be hidden as the code will not really show anything, it is just used to load our system. The label can be anything as this would be something for you to know what the field is about.
Into the Code section you should add the code from our header page.
You can find the header code on our Docs > JS SDK > Header page.
Before you copy and paste, you might need to first change "APPLICATION_TOKEN" string from the header code.
- You will find your application token in your Ziggeo dashboard under the app you want to use on Overview page.
Step 2 - Adding Ziggeo Recorder
This is optional - you do not need to add the recorder unless you would like to use the recorder on your form.
To add it, the steps are very similar to the ones you already went through to add the header code:
- Click on + to add field
- Select
embed
field - Set label - this can be anything that would make sense for you and your customers to know that this is recorder
- Style - leave as "inline"
- Code - this is where you will add the recorder code
Now adding the code can be something as simple as:
<ziggeorecorder ziggeo-theme="modern" ziggeo-themecolor="red"></ziggeorecorder>
Now we understand that you might not know how or want to create code, so we have a link we want you to use instead. It is our sandbox that you can use to click around and set up recorder, after which you would grab the code to copy and paste.
You can find the sandbox here.
Step 3 - Adding Ziggeo Player
This is optional - you do not need to add the player unless you would like to show a video on your form.
Steps are again very similar to what we did previously:
- Click on + to add field and select
embed
as type of field to add - Set label - this can be optional if you want to highlight what the video is about or not
- Style - leave as "inline"
- Code - this is where you will add the player code
Now adding the code can be something as simple as:
<ziggeoplayer ziggeo-theme="modern" ziggeo-themecolor="red" ziggeo-video="VIDEO_TOKEN"></ziggeoplayer>
Unlike recorder, you will need to change "VIDEO_TOKEN" into actual video token. You can find them under your Dashboard > Videos.
If you are not too thrilled about creating your own code and prefer to copy paste, our sandbox can help.
You can find the sandbox here.