The dimensions tag is a JS snippet that can be added to a page to easily embed Dimensions assets using HTML and/or Javascript code.
Follow these steps:
Include the script tag in your HTML:
<script src="https://dimensions-tag.cloudinary.com/latest/all.js"></script>
Initialize the tag:
const d8sApi = initDimensions({
account: "<my-account>", //replace with your account ID
viewers: ["IMAGE", "VIDEO", "3D"],
});Replace the account value with your account ID. You can copy the value from the Settings page.
The Viewers array tells which types of assets you’d like to include on the page. If you add “3D”, make sure also to include the Dimensions 3D Viewer script:
<script src="https://dimensions-3d-viewer.cloudinary.com/latest/all.js"></script>
This Viewer script URL will always give you the latest version of the Viewer as new ones are released. It's recommended that once you've finalized your integration, you fix the version of the viewer to the one you've tested with. The versioned URL can be ascertained by using the following URL: https://dimensions-3d-viewer.cloudinary.com/all.js which will redirect to the URL containing the version. This is the URL you should set in your production code.
Once loaded, the Tag will scan your HTML for containers that should display the images/videos/3d-viewer. Learn how to embed those using simple markup in this article.