Intro
Overview New in V14
Apps
Overview Configuration
<camera>
Overview Browser Support Embedding Configuration Custom Interface JS Methods JS Events Collecting Videos
<room>
Overview Browser Support Embedding Configuration Custom Interface JS Methods JS Events
<player>
Overview Embedding Configuration JS Methods & Events
<wall>
Overview Embedding Configuration JS Methods
<photobooth>
Overview Embedding Configuration Custom Interface JS Methods JS Events
<photo>
Overview Embedding
<microphone>
Overview Embedding Configuration Custom Interface JS Methods JS Events Collecting Audio
REST API
Overview List Assets Show Asset Update Asset Delete Asset List Apps Show App Create App Update App Video Object Photo Object Audio Object List Rooms Create Room Show Room Update Room Delete Room

Embeding a <photobooth>

Below are instructions on how to embed your PhotoBooth into a webpage.

Embedding with HTML
Embedding with JS

Embedding with HTML

First, make sure you have the cameratag.js and cameratag.css files included in the header of your site. The following <script> tag should appear at the bottom of your page's <head> tag

<head>
  <script src='//www.cameratag.com/v14/js/cameratag.min.js' type='text/javascript'></script>
  <link rel='stylesheet' href='//www.cameratag.com/static/14/cameratag.css'>
</head>
Next, create a new <photobooth> somehwere in your <body> like the one below. 
<photobooth id='[BOOTH_ID]' data-app-id='[YOUR_APP_UUID]'></photobooth>
You will need to replace the values denoted by brackets in the above example.

You will replace [YOUR_APP_UUID] with the UUID of the App you would like to use with this <photobooth>. This can be found under the name of your App on any of the App pages on CameraTag.

You will replace [BOOTH_ID] with a unique id you choose for that instance of the <phtobooth>. This will allow you specifically refernce that <photobooth> on the page (in the JS API).

Please note: Each photobooth on a page MUST HAVE A UNIQUE BOOTH ID (id atribite) however multiple photobooths on a page may be attached to the same App.

How do I dynamically add a <photobooth> to the DOM?

If you want to embed at a PhotoBooth after the page has loaded simply add the <photobooth> element to the DOM as described above then call 
CameraTag.setup();
This will rescan the DOM for any uninitialized <photobooth> tags.