How To: Embed Qsite™ Into Your Own Website

Qsite Status

This article walks through the process of embedding Qsite™ into your own company website, using the iframe embed approach (as opposed to the methods currently in Beta using full html and/or API access). This will allow your customers to click a link on your website, enter their ticket number and last name, and receive all of the information that is currently available with Qsite™.

• We recommend first walking through how to brand your Qsite™ with your company logo, because it will display on your website with the RepairQ logo if you do not.
  
  
• Next, we recommend creating a new page on your website, called something like "Repair Status". Make sure you add a link to it in the menu bar or somewhere easy to find.
  
  
• Navigate to the section of the new (or existing) page where you want it embedded, and copy/paste this specific html there, BUT substitute{yourrepairqurl} with your specific RepairQ URL, i.e. https://repairbros.repairq.io:

<iframe src="{yourrepairqurl}/t" style="display:block;margin:auto;border:0;width:100%;min-width:320px;min-height:480px;"></iframe>

• For example, the company Repair Bros would look like this:

<iframe src="https://repairbros.repairq.io/t" style="display:block;margin:auto;border:0;width:100%;min-width:320px;min-height:480px;"></iframe>

• If you wish to constrain the width and make it narrower, you can modify the width percentage down from 100%.

Qsite Opportunities

Available with RepairQ 1.16 you can also embed Qsite™ Opportunities into your site.

• Navigate to the section of the new (or existing) page where you want it embedded, and copy/paste this specific html there, BUT substitute{yourrepairqurl} with your specific RepairQ URL:

<iframe src="{yourrepairqurl}/qsite" style="display:block;margin:auto;border:0;width:100%;min-width:320px;min-height:480px;"></iframe>

• For example, the company Repair Bros would look like this:

<iframe src="https://repairbros.repairq.io/qsite" style="display:block;margin:auto;border:0;width:100%;min-width:320px;min-height:480px;"></iframe>

• If you wish to constrain the width and make it narrower, you can modify the width percentage down from 100%.

Qsite Ticket Lookup

Available with RepairQ 1.16.19, you can also embed Qsite™ Ticket Lookup into your site. This provides your customers with a place to securely manage their ticket and appointment details by entering their ticket number or claim number.

• Navigate to the section of the new (or existing) page where you want it embedded, and copy/paste this specific html there, BUT substitute {yourrepairqurl} with your specific RepairQ URL:

<iframe src="https://yourrepairqurl.repairq.io/qsite/lookup" style="display:block;margin:auto;border:0;width:100%;min-width:320px;min-height:480px;" allow="geolocation"></iframe>

• For example, the company Repair Bros would look like this:

<iframe src="https://repairbros.repairq.io/qsite/lookup" style="display:block;margin:auto;border:0;width:100%;min-width:320px;min-height:480px;" allow="geolocation"></iframe>

• If you wish to constrain the width and make it narrower, you can modify the width percentage down from 100%.