Visual Components

The Visual Components are elements you can use on one or more portal pages. To place a visual component onto a page, drag the component from the toolbox and drop it onto the page where you want to use the elements. You can also right-click on a page, and choose Insert Visual Component.

When a component has been added to a page, you can double-click the element (or right-click and choose Properties) to open the Properties page for the element and determine layout and functionality for it.

Page Area

The “Page Area” component determines where the page (portal page) is to be located on the overall page (Page Master).

Login

The Login element displays the username and password text-fields to the panelists - .

Figure 1 - Example of a page master with the Login element

Figure 2 - And how the login element will look to the panelist

You set up the login element using its Properties sheet (right-click on the element on the page and select Properties) - .

Figure 3 - The Login element's Properties sheet

Login name

The “Login name” element shows the username of the panelist after he/she logs in. In the figure below, the properties of the “Login name” element are being set. In the example below a custom text string (Format String) is entered so when for example Peter Jones logs in with his username “peterj”, the English text becomes “Welcome peterj!”

Currently, the “username” is the only element that can be piped into the Login name component.

Figure 4 - Setting the Login name properties

Login Status

The “Login Status” component allows you to place a hyperlink to a login page anywhere in your portal. This element is often used in combination with the “Show Login Status When Logged In” property on the “Login” element.

If this property is checked on the Login element, and the Login element is always displayed on screen (normally part of the Page Master), then the Login status element cannot be used.

Password Recovery

In the event a panelist forgets their password, the Password Recovery element enables the panelist to request that their password to be sent to their registered email address. This obviously requires that the person has previously registered as a panelist.

The Properties sheet for the Password Recovery element includes a number of different text fields; one field for each selected language for each property. Note that you can use text piping in the Email Subject, Email Plain Text Body and HTML Body fields. The primitives ^username^ and ^link^ can be used here to pipe the username and link information into specific places in the text that you type into these fields.

Change Password

This element allows the panelist to change his or her password at any time.

Navigator and Navigator Path

The Navigator element determines where on the page the menu is displayed. The Navigator path displays the route through the menu system to the current page. All the pages in the path are links, allowing the panelist to jump back to any page in the path by clicking on the link.

Language selector

The Language Selector element - enables the panelists and other visitors to your portal to choose the language their portal will be presented in.

Figure 5 - Example of the Language Selector element in use

Theme selector

Use a Theme Selector element - to allow the panelists and other visitors to your portal to choose which theme is to be used to present their portal (go to Themes for more information).

Figure 6 - Example of the Theme selector in use

Surveys List

The Surveys List component positions and defines the layout and content of the list of surveys available to the respondent on the page. Add the component to the portal page (drag and drop from the Visual Components toolbox), save the page, then double-click on the component to open its Properties pane - .

Figure 7 - The Survey Lists component properties pane

• List Type - specify the status(s) of the surveys that you want the list to display.
• Number of Rows - specify the number of list rows you want to be displayed at one time. In the event the list contains more surveys than can be listed, the list will be divided into pages.
• Display Style - determines how the survey list is rendered; either as an HTML table <table> or HTML List <ul>. Mobile portals will default to List, but both Desktop or Mobile can use either rendering option.
• Check the boxes for the columns you wish to include in the list.
• Specify the styles to be used for the various parts of the list.
• You can provide translations for the column header texts. One text field will be available for each language selected for the portal.

Credit Balance

Points earned for panelist participation are tracked. Use the “Credit balance” element to display the current number of earned points. In the example below - , the element has been placed in the “Your Points” page. When panelists go to this page, they will see the sentence “You have earned N points so far.” The variable N will display the credit balance, starting at zero.

Figure 8 - Example of using the Credit Balance element

Note: For Panelist Credits, a 'pending' flag is set when points are assigned to a respondent. From Version 15 this flag is removed (so the points are awarded) when the respondent's status is changed via the SetStatus function or when the respondent reaches a Stop node. Therefore points will also be counted for respondents who receive statuses such as "Screened" or "Quota full".

Edit Profile Link

Your panelists's circumstances will change during the life of your panel, and they should have the opportunity to change their profile, for example their home town, their age, whether or not they are married etc. The registration survey they answered when signing up as a panelist is available to the panelists at all times via the “Edit profile” element. When panelists navigate to this page, they can update their details so that the next time the panel is sampled for respondents to a particular survey, the group of respondents found for that survey are optimized.

Figure 9 - In this case the Update Your Profile link is placed in the Members Only menu

When the panelist goes to the Members Only > Update Your Profile menu command, he/she is taken to the appropriate portal page and the survey is run.

External link

You can insert hyperlinks on your portal pages. To do this:

1. Drag the “External link” element from the Visual Component toolbox onto the page.
2. Double-click the element (or right-click and choose Properties) to open the Properties page.
3. Set the properties for the element, and specify the URL you wish the link to go to.

Text

The Text visual component is used to display text on a portal page. You can enter text directly onto a page, however if you do the text will be the same for all panelists regardless of language. If you use the Text element, you can then specify the text for each language selected for the portal , this will display the text in the language chosen by the panelist via the Language Selector.

Figure 10 - Language transparent text element

Page Link

In addition to the Visual Components, you can drag a page directly onto another page to make a direct “go to page" link. This creates a hyperlink to the dragged page where the page was dropped. The panelist can then click the hyperlink to navigate to that page.

In our example portal we are using direct “Page links” inside the Page Master. The three links in the lower-left corner are all direct links, dragged onto the Page Master directly from the toolbox - . Double-click on the element (or right-click and choose Properties) to set visibility, style, titles for each selected language), and descriptions (also for each selected language).

Figure 11 - Example of Direct Page linking

Poll

This component allows you to add a poll to the portal (go to Poll Surveys for more information).