Embedding Optio Dentistry on your website
In this article
It's easy to add Optio Dentistry videos to your dental website. Find out how to embed the video library, a single video with or without the Lightbox function and how to customize the language options for your patients.
Embedding the Optio Dentistry video library using JavaScript
First include the Optio JavaScript API by adding the following line inside the section of the website HTML.
<script src="https://www.optiopublishing.com/api/js" async defer></script>
Then place the following snippet where you would like the video library to appear in your site.
<div class="optio-library"></div>
Optional attributes
There are a number of optional attributes that can be used to configure the video library. For example, the following snippet will only include dentistry videos.
<div class="optio-library" data-filter="^dentistry"></div>
The following table lists the optional attributes available for the video library.
| Attribute | Default | Description |
|---|---|---|
| data-autoplay | False | Whether to begin playback immediately after the page loads. |
| data-captions | False | Whether to display captions |
| data-filter | None | Regular expression to filter videos based on video ID. |
| data-language | en | Player language. Languages available include English (en), French (fr), Spanish (es) and Hebrew (he). |
| data-video-id | First "featured" video | ID of video initially loaded into player. |
Embedding a single video
First include the Optio JavaScript API by adding the following line inside the section of the website HTML.
<script src="https://www.optiopublishing.com/api/js" async defer></script>
The following snippet will embed a single video. It should be placed where you would like to video to appear in your site. This example embeds the Decay: Crown video. Change the data-video-id attribute to display a different video. View a list of video ID's.
<div class="optio-video" data-video-id="dentistry/decay/crown"></div>
Optional attributes
There are a number of optional attributes that can be used to configure the video library. For example, the following snippet will include the video library with the language set to French.
<div class="optio-library" data-language="fr"></div>
The following table lists the optional attributes available for the video library.
| Attribute | Default | Description |
|---|---|---|
| data-autoplay | False | Whether to begin playback immediately after the page loads. |
| data-captions | False | Whether to display captions |
| data-language | en | Video language. Note that not all content is available in all languages. |
| data-video-id | None | ID of video to load. |
Linking to a lightbox video player
It is possible to create your own links to the videos within a lightbox player. First include the Optio JavaScript API by adding the following line inside the section of the website HTML.
<script src="https://www.optiopublishing.com/api/js" async defer></script>
To play a video, use the optio.openLightBox() function passing the identifier of the video to play. For example, the following code will open the Missing Teeth: Bridge video.
<a href="javascript:optio.openLightbox('dentistry/missing_teeth/bridge');"> Watch a video on Bridges </a>
Changing the language
Subtitles for the Optio Dentistry videos are available in English (en), French (fr), Spanish (es) and Hebrew (he). The default language can be changed by including the optional data-language attribute. For example, the following code will embed the video library with the default language set to French. Please note that not all content is available in all languages.
<div class="optio-library" data-language="fr"></div>
Embedding Optio Kids Zone
A page of content just for kids is available. First include the Optio JavaScript API by adding the following line inside the section of the website HTML.
<script src="https://www.optiopublishing.com/api/js" async defer></script>
Then place the following snippet where you would like the content to appear in your site.
<div class="optio-kidszone"></div>
For further assistance please email us at support@optiopublishing.com