Booking request form
Link to form
You can use this page however you like, but one method is to send this link to the artist profile to a customer via mail or place a link on your website. It's also possible to use the link including a trailing "?booknow=1" to redirect directly to the Booking Request Form on the artist profile page.
Example:
<a href="https://artwinlive.com/booking/request/form/[id]">Book now</a>
Embedded in webpage
The second option is to use only the booking request form with the second URL. This one can be used to embed in your website using a <iframe>.
<iframe name="Framename" src="https://artwinlive.com/booking/request/form/[id]" frameborder="0" scrolling="auto" style="width:100%;height:800px">
</iframe>
You might have to change the height (in pixels) of the iframe to match the height of your site.
<iframe name="Framename" src="https://artwinlive.com/booking/request/form/[id]?background-color=white" frameborder="0" scrolling="auto" style="width:100%;height:800px">
</iframe>
The background of the form is transparent. If you need a solid background add: ?background-color=white (color name list)
Popup (lightbox) on WordPress
The third option is a lightbox with the iframe embedded on the page. This requires javascript or if you use WordPress a Lightbox-plugin. Or use this javascript code. Paste this anywhere on your page, where you want the link:
<a class="iframe-lightbox-link" href="https://artwinlive.com/booking/request/form/[id]?background-color=white" data-scrolling="true">Book now</a>
Place the next code at the bottom of the page just before </body>:
<link href="https://unpkg.com/iframe-lightbox@0.2.8/css/iframe-lightbox.css" rel="stylesheet" type="text/css">
<script src="https://unpkg.com/iframe-lightbox@0.2.8/js/iframe-lightbox.js"></script>
<script>
[].forEach.call(document.getElementsByClassName("iframe-lightbox-link"), function (el) {
el.lightbox = new IframeLightbox(el);
});
More information about this lightbox: https://github.com/englishextra/iframe-lightbox