Search this site
Customer Portals‎ > ‎

Embed In Your Website

All customer portals are designed to be placed within your website via an iframe.  The easiest way to do this is simply embed the call to the portal, with your organization ID, within the iframe tags.  You can find your URL's by going to Admin/My Portal within your account.

Note:  If you embed your portal within your website, you will want to adjust two email templates.  Go to Admin, Email tab then scroll to the bottom where the templates are located.  The two you will need to edit are:
  • Welcome new user - portal
  • Reset password - portal
Here is an example of what you will want.  Note - you will put your website URL for the href tag below.  This will ensure your customers are directed to your website page that you have the portal embedded in.

A new account has been created for you in the {{MyCompany.Name}} support portal.<br />
<br />
Your user ID is: {{PortalUser.Email}}<br />
Your new temporary password is: "{{Password}}"<br />
<br />
Click <a href="http://www.yourwebsite.com/support">here</a> to login in and change your password.<br />
<br />

Advanced Portal:
 
<IFRAME SRC="portal.teamsupport.com/youraccountname" TITLE="Customer Support Portal"></iframe>
 
Public Portal:
 
<IFRAME SRC="publicportal.teamsupport.com/youraccountname" TITLE="Customer Support Portal"></iframe>

Ticket Submission Form Only:
<IFRAME SRC="ticket.teamsupport.com/youraccountname" TITLE="Ticket Submission Form"></iframe>

Public Knowledge Base Only:

<IFRAME SRC="kb.teamsupport.com/youraccountname" TITLE="Public Knowledge Base"></iframe>  

Here's a good article which describes the iframe tag in a bit more detail.
 
Regarding the Advanced Portal: The only problem with this method is that when one of  your customers gets a notification about a change to a ticket they created through the portal (via our "Web Conversation" feature), the default link simply goes to "portal.TeamSupport.com/youraccountname".  This will work, but the portal will not be displayed within the iframe - it will be a "naked" stand alone page.
 
Solution:
 
Solving this requires a little bit of JavaScript and HTML knowledge. At the bottom of this article is some sample HTML and JavaScript code for you to reference.
 
Basically, this code simply passes the parameters (OrganizationID and TicketNumber) to the iframe.
 
JavaScript is very sensitive to capitalization, so make sure that OrganizationID and TicketNumber are capitalized correctly.
 
Once you have this page set up, go to Admin-My Portal settings in TeamSupport and change the "External Portal Link" to point to the page you created with the JavaScript.
 
Now when an e-mail is sent to a customer about a ticket update, the link will point towards your iframe embedded portal page!
 
<html>
<head>
  <title>Portal Example</title>
  <script language="javascript" type="text/javascript">
    function pageLoad() {
      var ticketNumber = getQueryParamValue("TicketNumber", window.location);
      var organizationID = getQueryParamValue("OrganizationID", window.location);
      var url = "http://portal.TeamSupport.com?OrganizationID=xxxx";
 
      if (ticketNumber != null)
      {
        var url = "http://portal.TeamSupport.com/protected/ticketdetail.aspx?TicketNumber=" + ticketNumber + "&OrganizationID=" + organizationID;
      }
      var frame = document.getElementById("frmPortal");
      frame.setAttribute('src', url);
 
    }
 
    function getQueryParamValue(name, url) {
      params = url.search.substring(1);
      name = name.toLowerCase();
      param = params.split("&");
      for (i = 0; i < param.length; i++) {
        value = param[i].split("=");
        if (value[0].toLowerCase() == name) {
          return this.unescape(value[1]);
        }
      }
    }   
  </script>
 
</head>