Industry type - all
Available with - All

Click here to enrol in a free course on how to promote Fixflo to your occupiers 

The Fixflo occupier repair reporting system is typically offered to tenants via a URL (ie using an anchor):

https://[custom domain]

However, there are scenarios where it is more appropriate to offer tenant repair reporting using the iframe plugin.

Once an agency is registered, the tenant repair reporting system may be accessed using the plugin instantiated using an iframe:

<iframe scrollbars="no" style="border:0px;width:100%;height:700px;overflow:hidden" src="https://[custom domain]"></iframe>

Additional parameters may be supplied to the source URL to pre-populate certain fields. Please ensure the property values are correctly encoded. The list of supported parameters is as follows:

address.addressline1Address line 1
address.addressline2Address line 2
address.townThe address town
address.postcodeThe address postcode
The tenant's title. Eg Mr/Mrs/Ms/Dr/Mx
firstnameThe tenant's forename
surnameThe tenant's surname
emailThe tenant's email address
contactnoThe tenant's contact number
callbackidThis optional value (max 40 chars) is not displayed to customers but is submitted and saved if the issue is submitted. Similarly, this value is not displayed in any issue report but may be read via the API. This value is useful to identify the source of any prefilled data so that on submission any potential data updates can be handled correctly
externalpropertyreferenceThis is an optional value to which relate the address entered in to an existing property/unit in Fixflo. If the address entered is different, that address will be added as an alternative address for the property. If you are using Fixflo Essentials or Professional and your existing property records carry external references, please ensure that the 'externalpropertyreference' you pass through the source URL is the same, otherwise you risk creating duplicate property records.


  • The plugin is designed and tested to operate within an iframe of height 700px. For the best user experience overflow: hidden should be applied to the iframe 
  • The plugin is designed to be responsive vertically. Therefore the width may be set to anything sensible
  • The attribute scrollbars="no" is implemented to support some legacy browsers
  • Please remember that only requests using SSL are accepted (ie https)

Example HTML Code

(Add in '<' as the first character to implement)

NOTE: Do not use the example data from the Example HTML code.



Making the plug-in responsive:

While the content of the Fixflo plugin is responsive, the parent iframe is not by default.

To make the iframe responsive (for use by mobile handsets for example), some additional JavaScript needs to be included in the parent webpage.

NOTE: The following JavaScript is provided to convey intent and method. Actual implementation may include the use of frameworks, additional error handling or browser quirks support.

Resizing the iframe:

To make the iframe fit the device size exactly, the following JavaScript is suggested. This JavaScript should be played at the end of the web page just before closing the body tag: 

function resizeIframe() {  
  var el = document.getElementById("the_frame_id"); = "100%"; = window.innerHeight + "px";
  el.width = "100%"; 
  el.height = window.innerHeight + "px"; 
window.onresize = resizeIframe; 

Scrolling the viewport:

While resizing the iframe provides a better user experience, it might still be possible for an end user to scroll part of the iframe out of the viewport. If the user subsequently interacts with the visible content of the iframe important content might not be visible. 

Only the parent of the iframe can bring the iframe back into view.

The parent document can listen for user interaction with the child iframe (i.e. receive messages) and respond accordingly.
In other words, when a user clicks on a prev/next button or otherwise causes a modal to appear, a message is from the iframe source page to the parent. This allows the parent to scroll the 
iframe into view, if required:  

function receiveMessage(event) {
 //// alert("message received");
 if (event.origin.indexOf("") === -1) return; 
 if ( == "") {    
         var el = document.getElementById("the_frame_id"); 

window.addEventListener("message", receiveMessage, false); </script>