Embed items

Embedding items is similar to how YouTube videos can be embedded into other websites.

Here's how to embed an item:

Enable the "Embed" publishing option

1. Open the  Items manager
2. Select the item you would like to embed and click Edit
3. Under "Publishing options", check "Embed"
4. Click Save

Copy the embed code into your website

1. Click an item to open it. The embed code appears in the bottom right of the item editor
2. Choose an appropriate window size. This controls how large the embedded item will appear
   1. For image items, you have the choice between multiple ratios: the original image ratio, square, 16:9, 4:3, 3:2. 
      1. "Original ratio" will ensure that the image is not cropped
      2. After selecting a ratio, enter the desired width of the frame. The height will be automatically calculated based on the aspect ratio selected
3. For image items, choose an image layout.
   1. "Zoom in": when selected, the image will fill the embed frame, but it may appear cropped
   2. "Zoom out": when selected, the image will fit the embed frame and won't crop it, but there might be some additional space on each side
4. Choose the controls you want users to have on your embed. 
   1. You can allow them to see the content in fullscreen.
   2. "Show important areas": If you have annotated important areas in an image, you can choose to display those important areas as a ribbon inside the embed window. To select important areas, open the "select important areas" option from the item page, then click and drag to highlight the areas. See example below:

5. Choose the appearance of the embedded frame. For image items, you can select a white frame or a dark frame. 
6. Copy and paste the code generated below the settings into a suitable location in the source code of your website

Ensure the website domain is permitted to embed your content

Only websites on domains permitted on the  Embed page are allowed to embed your items. Learn more about how to control which websites can embed your content.

Example

Below is an item embedded directly into this page, we achieved this using the instructions above.