Overview
The Embed Camera feature allows you to show a live feed from any camera connected to your Coram organization on external websites, using an iframe embed code. This enables seamless integration of your camera feeds into third-party dashboards, websites, or other applications where real-time video monitoring is needed.
This guide provides clear instructions for first-time users on how to enable embedding, generate the embed code, and customize the iframe to suit your requirements.
Enabling the Embed Feature for a Camera
To embed a live video feed from one of your Coram cameras, you first need to enable the camera embedding for that camera through the camera's settings in the Coram web app. This process also generates an embed code.
Important:
Enabling embedding makes the live feed freely accessible via the embed code. Ensure that you only share the embed code with trusted parties.
Each time you enable the embed feature, a unique link is generated. Disabling and re-enabling the feature creates a new link, and renders any previous links inactive.
To enable the Embed feature for a camera:
Access the Coram web app and sign in to your account.
From the main navigation menu, click Devices.
The Cameras tab appears by default.
Locate the camera you want to embed, and click the associated Settings button.
In the camera settings menu, enable the Embed Camera toggle switch.
Camera embedding is enabled, and the embed code appears in a popup window in the following format:
<iframe
src="https://public.coram.ai/camera/349e0fa3-4f1b-4fad-b2d3- 603d14ef41b1"
width="100%"
height="100%"
title="Coram 12MP Fisheye Front"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen
>
</iframe>
Tips:
To view the embed code after you close the Embed Camera popup window, in the camera settings menu, click the embed icon (
).To disable embedding for the selected camera, disable the Embed Camera toggle switch
Customizing the Embed Code
The generated embed code is an HTML <iframe> element that you can insert into your website's HTML code. You have the option to customize certain attributes of the iframe to suit your specific requirements.
Common iframe Attributes
Width and Height
Width and Height
Sets the dimensions of the embedded video.
<iframe src="..." width="640" height="480"></iframe>
Adjust the width and height values to fit the layout of your webpage.
Allow Fullscreen
Allow Fullscreen
Allows users to expand the video to full screen.
<iframe src="..." allowfullscreen></iframe>
Frameborder
Frameborder
Sets the width of the iframe border.
<iframe src="..." frameborder="0"></iframe>
Tip: To remove the frame, set frameborder="0".
Styles
Styles
Apply CSS styles directly to the iframe.
<iframe src="..." style="border: none;"></iframe>
Add inline styles to adjust appearance, such as border, margin, etc.
Responsive Design
Responsive Design
Make the embedded video responsive to different screen sizes.
<iframe src="..." style="width: 100%; height: auto;"></iframe>
Note: You may need additional CSS to maintain the aspect ratio.
Security and Privacy Considerations
The embedded live feed does not require authentication to view, so take precautions when you embed the code and provide access. You must ensure that embedding live feeds complies with your organization's security policies and any applicable laws or regulations.
Tip: If you suspect unauthorized access, disable and re-enable the feature to generate a new link and disable the old one.
Frequently Asked Questions
Can I embed multiple cameras on the same page?
Yes, you can embed multiple camera feeds by enabling embedding for each camera and inserting each embed code into your webpage. Alternatively, you can create a Kiosk Wall, which allows you to configure a multi-camera view in the Coram web app, and then embed all those cameras with a single embed code. To learn more, refer to Kiosk Walls.
Can I password-protect the embedded video?
Not directly, as the embed feature does not support authentication. To restrict access, consider embedding the iframe on a protected webpage that requires user login.
Is there a limit to how many times I can enable or disable the embed feature?
No, you can enable or disable the embed feature as many times as needed.
Can I adjust the quality of the live feed?
The embed code shows the live feed at the quality set in your camera settings. To adjust the quality, modify the settings within the Coram web app.