Display of SeamlessAccess Login Button

Including the component library

You will need to reference the SeamlessAccess component library before you can use it. For the Standard implementation, you will always reference through a CDN.

<head>
<!-- Include the SeamlessAccess Sign in Button & Discovery Service -->
<script src="https://service.seamlessaccess.org/thiss.js"></script>
</head>

Rendering the button

Include a <div> container that is identified with an id tag where you want the button to appear on your HTML page:

<body>
  <!-- Location for the SeamlessAccess login button -->
  <div id='putMyLoginButtonHere'></div>
</body>

And to display the button into this container, invoke the DiscoveryComponent.render function as a handler for the onload event on the window. This action will cause the button to initialize as soon as the window has finished loading. (NOTE: while it is possible to initialize the button component earlier, the behavior can be unpredictable and is not recommended.)

<script>
window.onload = function() {
  // Render the SeamlessAccess button
  thiss.DiscoveryComponent.render({
    loginInitiatorURL: 'https://sp.example.com/Shibboleth.sso/Login?target=https://sp.example.com/',
  }, '#putMyLoginButtonHere');
};
</script>

The render function in this code, takes two parameters:

The loginInitiatorURL: - See the next section, “Integration of Login Button with your SAML SP”, for more details
The location where to render the button - here you will use the id tag that you used for your html <div> container, formatted using CSS selector styling in quotes.

Content-Security-Policy considerations

If your website publishes a Content-Security-Policy you will need to make provision for the components served from the service.seamlessaccess.org CDN (or from your domain if you deploy your own version of thiss) by merging the following into your existing CSP:

The 'unsafe-inline' is required for the above DiscoveryComponent.render example, but could be removed if the onload function was included e.g. from a file.

<< Standard Integration | Integrating the Login Button with your SAML SP >>