Phoenix

Add Bookingmood to your Phoenix website so guests can check availability and book your rental without leaving your site. You set it up once, and every change you make in Bookingmood shows on your website automatically.

Create a widget#

• Create a widget in Bookingmood. Widgets explains how.

• Click Embed and copy the Inline embed code. You need it in the next step.

Add the widget to Phoenix#

Phoenix doesn't run scripts inside HTML blocks, so you add the widget and the script that sizes it separately.

• Click the + icon to insert content.

• Click HTML and paste the embed code you copied.

• Remove the script and style parts, so only the iframe remains.

• Click + Add.

• Go to Settings > Custom scripts.

• Add a custom script with these settings:

  • Name: a name of your choice, for example Bookingmood resize

  • Script placement: body-tag

  • GDPR compliance: Functional (user consent not required)

  • Optimize script for pagespeed: off

• Paste the following code and save. If Phoenix shows 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>

That's it. Changes you make in Bookingmood now show on your website automatically.