Embedding Contents On a Website You Own
Learn how to embed a content into any website you can modify the HTML for. There are three ways you can embed content into a website. All of them are available via the Publish icon in the left sidebar, under the Website section:
Website settings
There are three ways you can embed content into a website:
- Using a Publishable Key
- Using an Access Token
- Into a Thinkific Course (Multimedia Content).
This method allows you to copy and paste an embed into any website, just like a YouTube video.
However, this embed method does not support persistent code or enable more data integrations or reporting, because a unique user ID is not provided. Additionally, it exposes your publishable key to website users, which allows them to copy and paste the same code into a different website.
This embed type may only be used for testing purposes. For production usage, authenticated embeds are required.
This is the recommended method for website embeds as it:
- Enables persistent code storage so the user can return to where they left off.
- Enables more useful data integrations and reports.
- Generates an access token from your server using a secret key and a content identifier, which is more secure.
The general process for this embed is as follows:
- 1.Obtain your secret key from your organization page. If you would like multiple keys, for example, for testing, please contact support.
- 2.Using your secret key and content identifier, submit a POST request to the access tokens endpoint to generate an access token, as described here.
- 3.Render an
iframeusing the returned access token by replacingACCESS_TOKENin the following HTML:
<iframe src="https://api.next.tech/api/v1/access_token/ACCESS_TOKEN" frameBorder="0" marginHeight="0" marginWidth="0" height="768px" width="100%" allowfullscreen webkitallowfullscreen mozallowfullscreen ></iframe>
Next Tech content can also be embedded into Thinkific courses using the "multimedia" content type.
This embed is prone to breaking due to updates Thinkific makes. If that happens, please reach out to us so we can get it addressed for you!
To embed content in the multimedia content type, select Into a Thinkific Course (Multimedia Content) in the Embed Code dropdown from the Publish sidebar on Next Tech.
Copy that URL and paste it into the URL for a Thinkific multimedia content. Be sure to check the Add dynamic variables to the URL option.
Click Save Changes, then your content will be visible in your course!
Want to push the data generated by your users to an external location? Check out our Zapier integration!
Two embed settings can be used to configure the embed code. These settings only change the current code presented for you to copy and paste and do not persist for the content.
If enabled, the left navigation is hidden. This prevents the user from being able to navigate to different sidebars in their project, change their settings, and so forth.
Toggling this option results in a cleaner embed experience when displaying the project alongside existing interface elements in your website.
When this option is not set, a project will look like this:
When set, it will look like this:
.png?alt=media&token=1ad392b4-38d1-4835-89d7-5b1e1f011ff0)
Overlay embeds are recommended when:
- Embedding multiple contents into the same page.
- Embedding content into a page where the user may not always interact with the embed.
Using this option prevents all embeds from launching when the page loads, which leads to increased costs and more accurate engagement data.
When enabled, the user will first be shown an overlay like the following:
Upon clicking the Launch button, the project will render like normal. The text and button text can be configured on your organization page.
Last modified 2yr ago