1.2: Lesson 1 - Embedding the Spritz JavaScript SDK - JavaScript SDK Documentation -
Skip to end of metadata
Go to start of metadata

This lesson describes how to spritz the content of the current page.

Supporting files to download for Lesson 1


login_success.html (this is a required file to download and host on your website).

To start building your project, embed the Spritz JavaScript SDK and create a “redicle” on your web page.

A redicle is a visual frame where you can look to recognize a word without moving your eyes. The frame above shows how the redicle looks.

  1. If you do not have jQuery installed, download and install it.
  2. Download the Login Success page login_success.html included in the SDK distribution and add it to your site. In the next step, you will use the redirectUri to point to the location where this file resides.
    On any page where you want to have a redicle, copy the following script and paste it between the <HEAD> and </HEAD> tags in your document. Customize the piece below with your clientId and redirectUri to initialize spritz.

In the script above:

  • your_clientID_here is the unique key that spritz provided when you joined the PoweredBySpritz Developer Program. The key is unique to you or your company.

  • redirectUri is the fully qualified path on your webserver where login_success.html is located. The web server must be able to read (access) this location. If necessary, use the change mode (chmod) command to grant access permission to this location after placing the file.

4. Copy the script tag for jQuery (if you don't already include it) as well as the Spritz SDK and paste it into the same <Head> section for the page below the script in step 3 where you want to add a redicle. Make sure that jQuery is loaded before Spritz.

5. In the <BODY> section of your page, add spritz to the location where you want the redicle to appear.

Refer to the following code:

For your login success file to work, point your redirectUri parameter to the location of your login_success.html file, and include the full protocol and path to this file. For example your redirectUri setting should look something like:

Be sure your callback uri matches the originating domain. If your website user visits www.mysite.com/somepage.html, be sure your redirect uri includes www. If your website user is coming from mysite.com/somepage.html, be sure the redirect uri does not include www.


©2014 Houghton Mifflin Harcourt. All rights reserved.

Terms & Conditions of Use | Privacy Policy