Difference between revisions of "Iframe Resizing"

From Beds24 Wiki
Jump to navigation Jump to search
Line 8: Line 8:
 
== Introduction ==
 
== Introduction ==
  
This is a third party code project which can be installed on your booking page and your web site to autocratically resize the iframe containing your booking page to fir the content.
+
This is a third party code project which can be installed on your booking page and your web site to automatically resize the iframe containing your booking page to fit its content without using scroll bars.
  
For support using this code please refer to the developer: https://github.com/davidjbradshaw/iframe-resizer
+
Beds24 can not answer questions about this code, for support please refer to the developer site: https://github.com/davidjbradshaw/iframe-resizer
  
  
Line 23: Line 23:
 
== Your web page ==
 
== Your web page ==
  
Refer to the develpers web site for full instructions and problem solving.
+
Refer to the developers web site for a full set of options, instructions and problem solving.
  
 
Obtain the file iframeResizer.min.js and copy it to your web server.
 
Obtain the file iframeResizer.min.js and copy it to your web server.
  
Make sure to use the same version number as the iframeResizer.contentWindow.min.js which has been added to the booking page
+
Make sure to use the same version number as the iframeResizer.contentWindow.min.js which has been included on the booking page.
  
The file can be downloaded from github or from https://beds24.com/include/iframeresizer/3.5.3/iframeResizer.min.js
+
The file can be downloaded from the developer site or from https://beds24.com/include/iframeresizer/3.5.3/iframeResizer.min.js
  
 
Remove any height parameter from your iframe and add the script after the plugin, if necessary change the src path to the location of your iframeResizer.min.js file
 
Remove any height parameter from your iframe and add the script after the plugin, if necessary change the src path to the location of your iframeResizer.min.js file

Revision as of 11:01, 11 March 2016

This page explains how to use the iFrame Resizer 

Requires: Ability to add code to the html of your web site


1 Introduction

This is a third party code project which can be installed on your booking page and your web site to automatically resize the iframe containing your booking page to fit its content without using scroll bars.

Beds24 can not answer questions about this code, for support please refer to the developer site: https://github.com/davidjbradshaw/iframe-resizer


2 Beds24.com

Add the following to the menu Settings > Booking Page > Developer > Insert in HTML head

<script type="text/javascript" src="include/iframeresizer/3.5.3/iframeResizer.contentWindow.min.js"></script> 

If you want to use a more recent version, you can host the file externally and include it with a full URL, make sure to use https:// to avoid insecure content warnings.

3 Your web page

Refer to the developers web site for a full set of options, instructions and problem solving.

Obtain the file iframeResizer.min.js and copy it to your web server.

Make sure to use the same version number as the iframeResizer.contentWindow.min.js which has been included on the booking page.

The file can be downloaded from the developer site or from https://beds24.com/include/iframeresizer/3.5.3/iframeResizer.min.js

Remove any height parameter from your iframe and add the script after the plugin, if necessary change the src path to the location of your iframeResizer.min.js file


<iframe src="https://beds24.com/booking.php?propid=3103" width="100%" scrolling="no"></iframe>

<script type="text/javascript" src="iframeResizer.min.js"></script> 
<script type="text/javascript">
  iFrameResize();
</script>