Embedding rooomSpaces

Successfully embedding rooomSpaces viewers into your website or application requires proper iframe configuration and understanding of browser security policies. This guide covers common embedding challenges and their solutions.

Understanding rooomSpaces Embedding

When embedding rooomSpaces into your website, you're creating an iframe that loads the 3D viewer within your page. This integration allows users to experience immersive 3D spaces without leaving your site, maintaining your brand experience while providing rich interactive content.

Common Embedding Issues

Microphone doesn't work in iframe

Please add microphone to the iframe script tag following allow list:

<iframe src="..." allow="...; microphone"></iframe>

Screensharing doesn't work in iframe

Please add display-share to the iframe script tag following allow list:

<iframe src="..." allow="...; display-share"></iframe>

Fullscreen mode not available

Enable fullscreen functionality by adding fullscreen to the iframe permissions:

<iframe src="..." allow="...; fullscreen"></iframe>

Complete iframe permissions example

For full functionality, use this comprehensive allow list:

<iframe
  src="https://viewer.rooom.com/space/your-space-id"
  allow="microphone; camera; display-share; fullscreen; accelerometer; gyroscope"
  width="100%"
  height="600"
  frameborder="0">
</iframe>