Phoenix

Available onAvailabilityBooking

You can easily add a Bookingmood widget in your website built with Phoenix.

Create a Bookingmood widget

  • As a first step, you need to create a widget in Bookingmood. Here you can read how to do that: Creating a widget. You can also watch the video on the bottom of the page.

Add the widget in Phoenix

  • Select the + icon to insert content

Content insertion in Phoenix

  • Click on HTML.
  • Copy and paste the embed code of your widget that you created in step 1.
  • Remove the script and style parts.
  • Click + Add.

Embed code input in Phoenix

  • Go to Settings > Custom scripts.

Custom script selection in Phoenix

  • Configure the custom script
  • Using a name of your choice (e.g. Bookingmood resize)
  • Script placement should be "body-tag"
  • GDPR compliance should be "Functional (user consent not required)"
  • Optimize script for pagespeed should be off

Custom script input in Phoenix

  • Finally, paste the following code. When you get a warning, you can safely ignore it.
<script>
  window.addEventListener("message", function (event) {
    try {
      const height = JSON.parse(event.data).height;
      if (!(height > 0)) return;
      const frames = document.getElementsByTagName("iframe");
      for (const frame of frames) {
        const frameWindow =
          frame.contentWindow > frame.contentDocument.defaultView;
        if (frameWindow === event.source) {
          frame.height = height;
          frame.style.borderRadius = "12px";
          frame.style.width = "100%";
          frame.style.border = "none";
        }
      }
    } catch {}
  });
</script>

Last modified January 31, 2024

On this page

Create a Bookingmood widgetAdd the widget in Phoenix