Customizing Survey Buttons

Buttons Overview

The Buttons tab within Preferences provides the ability to control:

  1. Which buttons appear in the survey
  2. The text that appears on the buttons or alternately
  3. The image to be used for the buttons, if the built-in image is not desirable
  4. The placement of the buttons on the page.

To modify the aspects above for the survey buttons:

  1. Choose Survey/Preferences from within the Survey Designer
  2. Click on the Buttons Tab
    6.5-DatStat Illume Survey Manager-Using the Survey Designer-Setting Survey Preferences and Styles-Customizing Survey Buttons 1

 

Available Buttons

Illume surveys include the following buttons:

  • Launch – The launch button appears on the launch page of surveys that run in a stripped down browser window. (That is, a browser window with no toolbar, no address bar, no forward and back buttons, etc. For more info on launching a survey in a stripped-down browser window, see the section on Embedding a URL to Launch the Survey with No Toolbar in the article Email Text.)
  • Login – The Login button appears on the login page. Participants click this to log in to the survey.
  • Restore – The Restore button appears on the Survey Resume/Restore page. When a participant logs in and Illume finds that he or she has a partially completed survey, the Resume/Restore page asks whether the participant would like to resume work on the incomplete survey, or start from the beginning with a new survey. Clicking the Restore button restores the partially completed survey, returning the participant to the page at which he or she left off.
  • Start Over – The Start Over button appears on the Survey Resume/Restore, described in the previous bullet point. Clicking Start Over deletes the participant’s incomplete survey and presents the participant with a new copy of the same survey.
  • Next – The Next button is what participants click to go to the next page of the survey. In the default survey template, this button is located at the bottom right corner of the page. It appears on all but the last question page.
  • Previous – The Previous button is what participants click to go to the previous page of the survey. In the default survey template, this button is located at the bottom left corner of the page. It appears on all but the first question page.
  • Save – Participants can click this button to save their survey without fully submitting it. Illume stores all participant responses, even before the participant submits the survey. When a participant abandons a survey, Illume has captured all of the participant’s responses except the responses on the last page the participant was working on. If the participant clicks Save, Illume does save the responses on the last page the participant was working on. After saving, a participant may resume the survey later. Authenticated participants can resume the survey by using the same URL they used to start the survey in the first place. Non-authenticated participants can choose request an email from Illume containing a special URL that will allow them to resume their survey. See Send Email, below.
  • Submit – The Submit button submits a survey. This button appears only on the survey’s final question page.
  • Close – The Close button closes a browser window. This button appears only on the Survey End page (which participants see after they submit a survey), and only if the survey was launched in a popup window.
  • Resume – Non-authenticated users can click the resume button to start answering questions where they had previously left off. This button has the same effect as the Restore button.
  • Send Email – When a non-authenticated user clicks Save to his survey responses, he needs some way to get back to his survey if he ever wants to complete it. The Send Email button appears after the participant clicks save. If the participant supplies an email address and clicks this button, Illume will send him an email containing a special link back to his survey. To make the Send Email button appear, you must define button text or a button image, and you must check a placement option for both the Save and Send Email buttons. The Send Email button is not necessary for authenticated surveys. In other words, if your survey only allows participants from specified participant lists, you do not need to use the Send Email button. In authenticated surveys, each participant has a unique URL to access the survey. If they save and return later through the original URL, Illume will know who they are, and will give them the option of resuming their in-progress survey or starting over.
  • Loop Done – Is displayed on the LAST page of loop questions when the loop has a loop summary table defined.  It allows for any changes made to the current set of loop questions to be saved.
  • Loop Cancel -Is displayed on the FIRST page of loop questions when the loop has a loop summary table defined.  It allows any changes made to the current set of loop questions to be canceled.
  • Loop Summary Respond – Appears within the loop summary table for each loop data set row and only applies for follow-up loops.
  • Loop Summary Edit – Appears within the loop summary table for each loop data set row.   It allows for the edit operation for the current data set that is displayed in the loop summary.
  • Loop Summary Delete – Appears within the loop summary table for each loop data set row.   It allows for the deletion of the current data set that is displayed in the loop summary.

 

Setting Button Text

To set the text for any button, click on the name of the button in the Buttons list, then type the text in the Button Text field. Click OK

Setting Button Images

To replace a button with an image:

  1. Select the button from the Buttons list and enter a URL for the image in the Image URL field. The URL may point to either a survey resource or to an absolute URL.
  2. Click the Choose buttonnext to the Image URL field. This brings up the Button image editor.
    6.5-DatStat Illume Survey Manager-Using the Survey Designer-Setting Survey Preferences and Styles-Customizing Survey Buttons-Setting Button Images 1
  3. To use a survey resource, check the Resource option and choose the image from the list of available resources. If the image does not appear in the list of available resources, click New Resource… to upload it.See “Working with Survey Resources” for details on uploading images and other resources.
  4. To use a URL, check the URL option and type in an absolute URL. An absolute URL is one that looks likehttp://www.datstat.com/images/newlogo.gif; in other words, and absolute URL includes the http:// or https:// prefix and a full path to the image. The URL does not have to point to the same server, or even the same domain as your survey. It does have to point to a publicly accessible web server, or your participants may not be able to see it.
  5. Click OK.

After setting a button image, the text in the Button Text field becomes that alternate text of the button. Alternate text appears when the mouse hovers over the button or when the browser is unable to load or display the image.

 

Placing Buttons

Each button can appear in more than one place on the survey pages. To place a button, select the button from the Buttons list, then check one or more of the Placement options.

 

Ordering Buttons

In some cases, there may be more than one button that appear in the same location on the page. For instance, there may be the Previous, Save, and Next buttons in the bottom center of the page.

To set the order in which these buttons display,

  1. Choose the Button group you wish to order under Button Groups (e.g. “Bottom Left”, “Bottom Center”, etc)
  2. In the middle panel under Button Order, click on the group of buttons to order.
    6.5-DatStat Illume Survey Manager-Using the Survey Designer-Setting Survey Preferences and Styles-Customizing Survey Buttons-Ordering BUttons 1
  3. Click on a button under Order Buttons.  Click Up to move the button up in the display order, or Down to move it down. Buttons are displayed left to right on the survey page, so the button at the top of the list appears furthest to the left, while the button at the bottom appears furthest to the right.
  4. Click OK to save the changes.

Button Style

Other aspects of the Button Style can be edited on the Style page under the Survey menu.  Users may edit the color, size, padding, border, and other aspects of the buttons.  Under the appropriate style tree based on the Rendering style (Survey, Mobile, and Table), editing the style of the buttons can be accomplished via the Navigation/Buttons portion of the tree.

6.5-DatStat Illume Survey Manager-Using the Survey Designer-Setting Survey Preferences and Styles-Customizing Survey Buttons-Ordering Buttons 2

 

Modifying Page Transitions

Users may set a Transition from page to page, and define the number of milliseconds of elapsed time for the transition.  The transition occurs when the participant clicks the Next button to move to the next page of a survey, and controls how the next page loads.   This results in a smooth, PowerPoint-like transition as the Next button is hit and the subsequent screen loads on the page.

To modify the page transition:

  1. Enter a transition time in milliseconds
  2. Determine the type of Transition: Fade, To Top, To Bottom, To Left, To Right
  3. Click OK
    6.5-DatStat Illume Survey Manager-Using the Survey Designer-Setting Survey Preferences and Styles-Customizing Survey Buttons-Modifying Page Transitions 1