Pular para o conteúdo principal

FV Decipher Support

Todos os tópicos, recursos necessários para FV Decipher.

Base de Conhecimento da FocusVision

Customizing the Page Timer Element

1:  Overview

Respondents view an ad for a predetermined amount of time, and then proceed automatically to the next page. 

The timer ad test element does not utilize Flash.

Learn more: Timer Ad Test Concepts

2:  Timer Ad Test Dynamic Element

The timer ad test element  requires:

  • a survey with compat 129+
  • no rows
  • no columns
  • the attribute sst set to 0
  • the attribute atleast set to 0
  • the attribute ss:questionClassNames set to sq-timertest 
  • the attribute where set to notdp

3:  Underlying Question Architecture

The dynamic style sits on top of a <checkbox> question. See bellow for an example of the base XML code inserted when using the survey builder.

Example XML 

<checkbox 
  label="q11"
  atleast="1">
  <title>New Multi-Select Question</title>
  <comment>Select all that apply</comment>
  <row label="r1">Sample Row #1</row>
  <row label="r2">Sample Row #2</row>
</checkbox>
</survey>

4:  Converting to the Timer Ad Test Element

To add the timer element style to this question, simply update the <checkbox> tag as shown below: 

  • uses="timertest.3" is added to the question tag
  • ss:questionClassNames="sq-timertest" attribute is specified
  • timertest:image is specified to provide the image link

The image file can be uploaded in our file manager, or hosted on a separate domain. Click here to find out how to use the file manager and upload your image file.

Example XML 

<checkbox 
  label="q11"
  atleast="0"
  ss:questionClassNames="sq-timertest"
  sst="0"
  timertest:image="/survey/selfserve/1d20/160105/20160208_145910.png"
  uses="timertest.3"
  where="notdp">
  <title>Take a look at this logo. You will be automatically redirected when the timer hits 0.</title>
  <comment>After 10 seconds, you will automatically be advanced.</comment>
</checkbox>

The example above produces the following result:

5:  Customization

Listed below are all of the attributes available for this element. Override them to create a custom look and feel for your timer ad test element:

The image must be mobile-friendly to display correctly on mobile device. Image sized to portrait mode on a mobile phone should be large enough for proper viewing.

Click an attribute to navigate to the details.

 

  • timertest:image
    • Enter the file name of the image uploaded in the file manager. You may also provide a full link to the image. 
    • Type: string
    • Available in survey builder: yes
    • Examples: 
      timertest:image="/survey/[path]/image.png", enters the file name of the image uploaded in the file manager, or 
      timertest:image="http://www.domain.com/image.png", provides a full link to the image.    
  • timertest:timerLimit
    • Enter a whole number to set the number of seconds that the ad should be displayed
    • Type: int
    • Available in survey builder: yes
    • Default: 10
    • Example: timertest:timerLimit="30"the ad test advances to the next question after 30 seconds.
  • timertest:counterPosition
    • Allows you to specify the position of the counter bar in relation to the image. 
      • Select Above to display the counter bar above the image.
      • Select Below to display the counter bar below the image. 
      • Select Both to display the counter bar above & below the image.
    • Type: enum
    • Available in survey builder: yes
    • Default: below
    • Example: timertest:counterPosition="above", displays the counter bar above the image.
  • timertest:showCounter
    • Show counter as number. 
      • When checked, the counter timer also displays a number timer. 
      • When unchecked, a number timer is not shown with the counter timer.
    • Type: bool
    • Available in survey builder: yes
    • Default: 1
    • Example: timertest:showCounter="1", the counter timer also displays a number timer.
  • timertest:autoscale
    • Autoscale image. When checked, the image scales to browser width.
    • Type: bool
    • Available in survey builder: no
    • Default: 1
    • Example: timertest:autoscale="1", the image scales to browser width. 
  • timertest:primaryColor
    • Primary counter color. Allows you to change the color of the shrinking portion of the countdown bar, which indicates the time remaining. Enter a color code, or click the color wheel to select a color. 
    • Type: color
    • Available in survey builder: yes
    • Default: #b7b7b7
    • Example: timertest:primaryColor="#3357ff", makes the shrinking portion of the countdown bar blue. 
  • timertest:secondaryColor
    • Secondary counter color. Allows you to change the color of the growing portion of the countdown bar, which indicates the time that's gone. Enter a color code, or click the color wheel to select a color. 
    • Type: color
    • Available in survey builder: yes
    • Default: #f4f4f4
    • Example: timertest:primaryColor="#b6d8ff", makes the growing portion of the countdown bar light blue.