Editing Texts

This chapter will teach you how to design the texts on your website.

• You can edit text directly in the preview. This practical new function is presented in this chapter.
• After that, you will learn about various options for designing your text in an appealing manner and for insertig dynamic elements. For example, you can change the type face with HTML and CSS, insert images and links, or insert personalized data using wildcards.

Editing Texts Directly in the Preview

The texts which the panelists see originate from various sources. Page names and texts of function modules, for example, are defined in the website editor on the respective page. Error messages and wildcards, however, are managed in dedicated menus.

The more familiar you are with EFS Panel, the fewer problems you will have finding the right place and editing the desired text directly at the source. However, you can edit most of the text directly in the preview:

• The following types of text can be edited: Wildcards, messages, texts from page modules and page titles. Texts which are not part of the CMS, such as news or forum posts, cannot be edited directly. They are managed in dedicated menus.
• Templates can be edited as well.
• The direct editing feature is only available for users logged into the admin area.
• As usual, the changes are made in the preview, not in the publicly accessible version of the page. You have to publish them explicitly.
• This feature is protected by the ACL right “panel_online_editing”. Write rights are required.

Working Directly in the Preview

To work directly in the preview, please proceed as follows:

1. In the preview drop-down list, select “Direct editing”. The preview is opened in a new window.
2. Open the page you wish to edit.
3. Switch to editing mode by clicking on the Edit button in the header section of the preview window.
   
   
   
   

4. Move your mouse pointer over the text elements. A green frame will indicate a text element that can be edited. Click on the desired text element.

5. The editing window will open.
   – The title will indicate the source of the text. In this case, the source is a page module.
   – Change the text as desired.

6. Save your changes. Check the result before publishing the changed version of the page via the website editor.

Formatting Text with HTML and CSS

The formatting of text elements – font, font size, color etc. – is defined by the page module’s template in combination with the panel’s CSS classes. This gives you efficient, centralized control over the layout properties of the entire panel. Details such as line breaks or formatting of individual words, on the other hand, can be directly defined with HTML and CSS in the text input fields.

The following tables give an overview of the most important HTML tags.

The most important HTML tags:

HTML tags for formatting text components:

HTML entities for German umlauts:

Uploading and Managing Images

Images and other media files for the website are managed with a panel-specific version of the EFS media library:

• The library is located in the menu Website → Asset library (until EFS 10.3: Media library).
• From EFS 10.4, the files are separated as follows:
  • Website assets: website-specific files.
  • Panel assets: files which can be used on all websites.
  • TIVIAN
  • assets: read-only assets provided by TIVIAN, sorted by website themes.
• You can use not only images, but SVG graphics, flash and video formats as e.g. RealVideo or Quicktime. To access a detailed list of the permitted file types, open the Upload file dialog and click on the Question mark icon.
• The maximum file size is installation-specific. If you exceed the threshold value, a note will be displayed.

Inserting Links

Panel CMS contains different types of links.

• External links: Refer to a page outside the respective panel language version, usually an external domain. They are inserted in modules or templates using normal HTML tags. See the following section “1. External links”.
• Internal links: Refer to a page that is part of the respective panel language version. Internal links are also inserted using HTML tags; however, the so-called page identifier is inserted instead of the full URL. See the section “2. Internal links” for instructions.
• Short URLs: It is possible to display URLs shortened with a Smarty modifier, which are widely used on Twitter or in smartphone communication. Instructions can be found in section 3 “Optimized short URLs for Twitter”.

1. External Links

Links to other domains (e.g. http://www.domain.com) can be inserted into modules or templates in a “normal” way, i.e. with the HTML tag <a href=http://www.domain.com>Linkname</a>.

Example: Inserting a link to your company homepage

The contact address entered on the “About us” page contains the company homepage URL http://www.example.com. However, it is not a clickable link. You can create a clickable link by amending the <a href=“URL“>Linkname</a> tag.

1. Enter the following into the “www” line:
   WWW: <a href=http://www.example.com>http://www.example.com />
2. Confirm by clicking on Save.
3. Click on Preview working version. The following figure shows the results of your work. Test whether the new link functions properly. If you are satisfied, click on Publish page to apply the change to the publicly accessible panel page.

2. Internal links

You can create internal links – i.e. links that refer from a panel page to another page of the same language version – using wildcards. Wildcards are based on the page identifier. They always follow the same pattern:

{$links.pageidentifier}

Example

You want to insert a back link on the “About us” page that allows panelists to return to the “Home” page.

1. First, in the website editor, determine the page identifier of the “Home” page for the desired language version. This is also named “home”.
   
   
   
   
2. Assemble the wildcard: {$links.home}
3. To create a clickable link, insert the <a href=“URL”>Linkname</a> HTML tag in the desired place in the content module of the “About us” page. Replace the URL with the {$links.home} wildcard:
   <a href="{$links.home}">back to home</a>




4. Click on Save.
5. Check the result in the working version. You can then publish the page.

3. Optimized short URLs for Twitter

You can create and display short URLs optimized for Twitter directly in the website editor. This is realized with the help of the Smarty modifier:

{"URL"|shorturl}

It can be entered in all fields of the website editor marked with “Smarty code” as well as in all panel templates. The entered URL will then be converted into a shorter URL.

Example:

Original URL: {"http://www.Tivian.de/"|shorturl}
Shortened URL: http://i.gpefs.com/?i=3-DW5w

Instead of a static URL, you can also use Smarty wildcards to insert indiviual URLs for each panelist, for example.

Using Wildcards to Output Predefined Text Elements

You can use wildcards to insert text elements instead of entering them into a module or the template source code. In the standard panel, this option mainly allows you to define and update message texts and labels of frequent input fields such as “Name” or “E-mail” for the entire language version. In addition, you can export these wildcards and edit them externally.

Example

In the main template “main_default” of the standard panel, the copyright claim is integrated by the following source code:

{* START COPYRIGHT *}
<div id="gpCopyright">
{$content.label_footer_copyright} {$env.now|localize_date:'Y'} //
</div>
{* END COPYRIGHT *}

In the Wildcard menu, look for the wildcard entitled “label_footer_copyright”. In the standard panel this wildcard contains the text “Tivian &copy;”. If you call up a panel page, {$content.label_footer_copyright} is filled with this content, and “Tivian ©” is displayed. If you change the content of the wildcard, the copyright claim on the panel pages will also be changed.

1. Managing wildcards

The menu Website → Standard content → Wildcards contains an overview of all wildcards available. The table has the usual search function, the individual wildcards can be edited or deleted.

2. Creating a new wildcard

1. Click on the Create wildcard button in the menu Website → Standard content → Wildcards.
2. Enter a name for the wildcard. Permissible characters are a-z, A-Z, 0-9, _ and -. Special characters and blank spaces are not permitted.

3. Enter the desired content in the “Content” field.
   
   

   Information

   
   

4. You can add a description to facilitate orientation.

5. Confirm by clicking on Create.

3. Editing wildcards

1. In the menu Website → Standard content → Wildcards, click on the Edit button or the title of the wildcard you wish to change.
2. You can change the name, content and description. If the wildcard is already being used in a module or a template, make sure you also correct the name of the wildcard there.
3. Confirm by clicking on Save.
4. Inserting wildcards in modules or templates

If you wish to insert a wildcard created in the Wildcards menu in a module or a template, use the following syntax:

{$content.wildcard}

This allows you to insert these wildcards in any module or template.

5. Deleting wildcards

There are two options to choose from when deleting wildcards:

• If you want to delete only one wildcard, click on the Delete icon. The wildcard will be removed after a confirmation prompt.
• If you want to remove several wildcards at once, tick the respective checkboxes of these wildcards in the “Delete” column. Depending on the situation, you may also use the checkboxes “Mark all entries on this page” and “Mark all entries found” below the table. After that, confirm by clicking on Delete. This batch delete function is particularly helpful while building or making major changes to a website when a large number of wildcards may have to be replaced and removed.

Using Wildcards to Output Data Dynamically

The wildcards introduced in the previous chapter are used to output predefined text elements. However, EFS Panel also has wildcards that can be used to dynamically output personal data of panelists, for example. These wildcards are primarily used in Smarty templates. You can, however, also use them in page modules, to further personalize and localize your panel pages:

• Information that can be output includes
  • Localization information (e.g. date and time)
  • Panel information (e.g. panel name)
  • Participant data (only for logged-in panelists)
  • Master data (only for logged-in panelists)
• Which wildcards are available on a certain page depends on various criteria, such as the page modules used on the respective page or the login status of visitors. The following three tables contain wildcards that are available across the entire panel.
• Page module input fields that allow the use of Smarty wildcards are marked accordingly with “Smarty code”.
• If you have the necessary programming skills you can program conditions for wildcard output.

Example

In the standard, panelists are welcomed by their first name on the personal homepage entitled “My home”.

In the content module, which defines the upper part of the page, enter the following text:

Hello {$respondent.u_firstname|escape:'html'}

The {$respondent.u_firstname} wildcard is dynamically filled with the first name of the respective panelist.

The escape:'html' command is a security measure: It ensures that any code in the u_firstname field of the user data table is not executed. It is recommended to use this escape command on output for all data, or at least for all data entered by visitors and panelists. This way you can prevent unauthorized persons from manipulating page output by entering JavaScript code, for example, or from obtaining data of other panelists.

Syntax

The following syntax is mainly used when entering dynamic wildcards in a module or a template:

{$prefix.wildcard}

The prefix indicates the context from which the variable is taken. The “respondent” prefix in the example above is used for the data of currently logged-in panelists, for example, whereas “content” is used for the wildcards defined in the Wildcards menu.

Overview of wildcards available across the panel site

1. Wildcards available across the panel site

2. Wildcards available in the internal area of logged-in panelists

Editing Messages

EFS panel has its own error message system. In the standard panel, the messages are shown on the right side of the content area above the login.

The messages are configured by our support when the panel is set up. You can make subsequent changes to the content of the messages. However, you currently have no access to the rules that determine whether and in which situation a message will be invoked. Accordingly, it is usually not advisable to create new messages. Only when configuring the RegEx checks for the registration form do you have the option of defining new messages with related rules on invoking them.

Message Types

In EFS Panel, there are different message types:

• Error messages: Messages of the “error” type consist of a header and the actual message text.
• Notifications: Messages of the “notification” type consist only of the message text.
• Notifications which relate to keying errors during registration are a special case.

Managing Messages

The Website → Panel websites → {Selected language version} → Messages menu allows you to view existing messages, create new messages and delete messages that are no longer used.

The Messages overview comprises all the messages created for the predefined language version and contains the following information:

• Identifier: Internal Wildcard, used to invoke the message from the “Error messages” template.
• Header: Message header as displayed to visitors. Is only used with the “Error” message type.
• Message text: The actual content of the message.
• Message type:
  • Error
  • Notification

If you want to view messages of another language version which you’re authorized to access in a given installation with several websites and/or language versions, simply change the settings in the upper section of the dialog. You can use the View function to change the number of table columns displayed as well as the number of rows per page.

The table can be browsed according to the content of messages.

You can use the “Actions“ icons to edit the messages:

• Change: Opens a form in which you can change the type, header and text of a message.
• Delete:
  • If you want to delete only one message, click on the Delete icon. The message will be deleted after a confirmation prompt.
  • If you want to remove several messages at once, tick the respective checkboxes of these messages in the “Delete” column. Depending on the situation, you may also use the checkboxes “Mark all entries on this page” and “Mark all entries found” below the table. After that, confirm by clicking on Delete. This batch delete function is particularly helpful while building or making major changes to a website when a large number of messages may have to be replaced and removed.

Creating a New Message

A new message will only be displayed if you also define a rule for invoking it. Currently, this is only possible for the registration form. Rules on invoking the other messages must be configured by our support. Therefore, creating messages is currently not advisable unless the messages concern registration or have been erroneously deleted.

To create a new message, please proceed as follows:

1. Clicking on the Create message button will open the entry form for creating a new message assigned to the current language version.
2. You can enter the following:
   – Message type: You can choose between “Error” and “Notification”
   – Identifier: A wildcard that will be inserted into the source code and filled with the message’s content.
   – Header: Should only be entered for the “Error” message type.
   – Message text: This field is used to enter the actual content.
3. Confirm by clicking on Save.

Maintaining FAQ and News

Maintaining FAQ

A well maintained FAQ list provides visitors and panelists with answers to frequentlyasked questions. This reduces the amount of support required by you, the panel operator, for answering simple questions.

The EFS Panel’s FAQ management function simplifies creation and maintenance of FAQs. At the same time, CMS gives you considerable room to design the FAQ area:

• FAQ items are created and maintained with the help of a specially developed optimized GUI. This means that a user who is not familiar with the CMS can take over their maintenance without requiring a great deal of training.
• You can create an FAQ area for each language version of the website(s).
• You can create FAQ items that are restricted to certain panel groups.
• A rich text editor is available for designing FAQ items.
• You can sort the items into different lists and place these on the panel pages at your discretion. The standard panel comprises an FAQ list the content of which is displayed in the “FAQ” menu. Further lists can be created as required.
• You can position the FAQ lists on the panel pages and modify how they are displayed with the help of the “FAQ list” module. Further changes to display and layout can be made using the “func_faq” template.

This Chapter will show you how to maintain the content of the FAQ. The “FAQ list” function module is presented in Chapter "Function Module FAQ List".

Managing FAQs

The starting point for FAQ management is the Website → Standard content -> FAQ management menu. In this menu you can view and maintain the current FAQ items, create new ones and assign them to the various lists.

The FAQ overview comprises all the FAQ items created for the predefined language version and contains the following information:

• Title (internal): Internal title of the FAQ item.
• Sort order: Position of the FAQ item in the list on output.
• Question
• Answer
• Author
• Active:
  • Green traffic-light icon: Yes. The FAQ item is displayed.
  • Red traffic-light icon: No. The FAQ item is not displayed.
• List: Shows which FAQ list the FAQ item belongs to.

If you want to view FAQ items of another language version in a given installation with several websites and/or language versions, simply change the settings in the upper section of the dialog. You can use the View function to change the number of table columns displayed as well as the number of rows per page.

You can search the content of FAQ items in the overview table. The advanced search allows you to selectively search by panel group, author or activity status.

Click on the icons in the “Actions” colum to Edit, Copy or Delete individual FAQ items.

Creating a new FAQ item

1. Click on the Create FAQ item button in the FAQ management menu.
   
   
   
   
2. Fill in the form. The most important fields are listed below; please refer to the table below for more details. Optionally, you can activate the rich text editor and use it to format the texts.
   – Title (internal): This title is for orientation purposes only, it will not be seen by panelists.
   – Sort order: Position of the FAQ item in the list on output.
   – List name: By assigning an item to a list you determine which panel page the FAQ item will be displayed on. As the items of the “main” list are displayed on the FAQ page of the standard panel, choose this list.
   – Active: Only active FAQ items will be displayed. Therefore select “Yes” so you can immediately see your new item on the FAQ page.
   – Access control: You do not wish to restrict access, all visitors and panelists are to have access. Therefore select “Public”.
   – Question and answer

3. After you have filled in the form, confirm by clicking on the Save button.

Using Rich Text Editor for Item Design

FAQ items, news items and quick polls may be edited using the TinyMCE rich text editor. This allows you to create appealing items without great effort.

• TinyMCE is a Javascript-based WYSIWYG editor. Detailed information is available at http://tinymce.moxiecode.com/.
• The admin area features a comprehensive tool bar. In addition to standard formatting options such as bold, italic, underline, alignment and ordering, it also includes text and background color, “Paste from Word” and full-screen mode.
• If you prefer working with HTML, use the Edit HTML source button to open an alternative entry field.

If you wish to use the rich text editor, open the Options → Personal preferences menu and activate the “Use rich text editor for news etc.” option.

Properties of FAQ Items

The table lists all properties FAQ items can have.

Managing FAQ Lists

Many panels offer various FAQ pages with different contents within one language version, e.g. a FAQ for normal panel visitors and another FAQ for logged-in panelists. This is realized with the help of so-called FAQ lists:

• For each purpose you create an individual FAQ list.
• Then you allocate the individual articles to the appropriate FAQ lists.
• The FAQ pages are created with the “FAQ” function module. From this module the appropriate FAQ list is referenced.

When delivered, there is only one FAQ list in the standard panel, containing all the articles of the FAQ menu. Usually, it is labelled “main”.

If you want to view the FAQ lists of your panel, click on the Manage lists button in the FAQ management.

• The overview list shows all existing lists with their respective titles and descriptions.
• In order to create another list, click on the Create list button and enter the desired title and a description. After clicking on Save the list is created and you can start allocating articles to it.
• You can rename or delete the lists.

Maintaining News

The design of your panel would not be complete without a policy of good and especially regular information in a designated news area. You can publish, for example, the results of surveys you have already conducted, announcements of new surveys and news related to the subject of the panel.

EFS Panel’s news management function makes it easier to create and maintain news; at the same time CMS gives you considerable room to design the external view of the news area:

• News items (articles) are created and maintained with the help of a specially developed optimized GUI. This means that a user who is not familiar with the CMS can take over their maintenance without requiring a great deal of training.
• You can create a news area for each language version of the website(s).
• You can create news items that are restricted to certain panel groups.
• You can predefine the publication period of articles; subsequent manual release is not required.
• The rich text editor is available for designing news items.
• You can sort the news items into different lists and place these on the panel pages at your discretion. The standard panel comprises a list of current news the content of which is displayed in the “News” menu. Further lists can be created as required.
• You can position the news lists on the panel pages and modify how they are displayed with the help of the “News” function module. Further changes to display and layout can be made using the “func_news” template.
• You can optionally offer RSS news feeds.
• EFS allows you to subscribe to feeds from high-quality blogs, for example, and to import those items directly into the news section.

This Chapter will show you how to maintain the content of the news area. The “News list” function module is presented in Chapter "Function module: News".

Managing News

The starting point for news management is the Website → Standard content → News management menu. In this menu you can view and maintain the current news items, create new ones and assign them to the various lists.

The news overview comprises all the news items created for the predefined language version and contains the following information:

• Title (internal): The internal news title.
• Headline: The headline that will be output for the panelists.
• Subtitle: The subheading.
• Teaser: A short introduction to the news that will be displayed in the news list together with the link to the news item.
• Author
• Publication start date/time / Publication end date/time (GMT): The period in which the news item is published.
• Displayed date of publication: Date displayed in the list of news both in the admin area and on the panel page.
• Active:
  • Green traffic-light icon = Yes: The news item is displayed.
  • Red traffic-light icon = No: The news item is not displayed.
• List: Shows which news list the news item belongs to.
• Viewed: Indicates how often the panelists have opened a news item. If a panelist opens a message twice, this is also counted as two hits.

If you want to view news items of another language version in a given installation with several websites and/or language versions, simply change the settings in the upper section of the dialog. You can use the View function to change the number of table columns displayed as well as the number of rows per page.

You can search the content of news items in the overview table. The advanced search allows you to selectively search by publication period, target group, activity status, list name or author.

Click on the icons in the “Actions” colum to Edit, Copy or Delete individual news items.

Creating a new news item

1. Click on the Create news button in the News management menu.
2. In the header and the “News options” section, the properties of the article are defined. Please refer to Table 22.2 for details. Optionally, you can activate the rich text editor and use it to format the texts.
   – Title (internal): This title is for orientation purposes only, it will not be seen by panelists.
   – Publication start and end date/time (GMT): These drop-down lists allow you to define the period in which the news item is to be displayed.
   – List name: By assigning an item to a list you determine which panel page the news item will be displayed on. In the standard panel, for example, you can find a list “main” whose items are displayed on the news page. Select this list.
   – Active: Only active news items will be displayed. Therefore select “Yes” so you can immediately see your new item on the news page.
   – Access control: You do not wish to restrict access, all visitors and panelists are to have access. Therefore select “Public”.
   
   
   
   
3. Next, enter the content. The most important fields are listed below.
   – Displayed date of publication (GMT) (shown on website): The date displayed in the news.
   – Heading and optional subtitle.
   – Teaser: The teaser displayed on the news page together with the link to the full news text.
   – Content: The actual news.
   – Author: Displayed in the news.
4. After you have filled in the form, confirm by clicking on the Save button.

Incorporating Images

The Insert image icon is located to the right of the “Teaser” and “Content” input fields. Clicking on it will open a pop-up window displaying the Asset library. If you wish to incorporate an image, click on the Insert image icon. The <img> tag of the image will be inserted into the input field.

Properties of News Items

The table lists all properties news items can have.

Managing News Lists

Many panels offer various news pages with different contents within one language version, e.g. a page with current news and a news archive. This is realized with the help of so-called news lists:

• For each purpose you create an individual news list.
• Then you allocate the individual articles to the appropriate news lists.
• The news pages are created with the “News” function module. From this module the appropriate news list is referenced.

When delivered, there is only one news list in the standard panel, containing all the articles of the news menu. Usually, it is labelled “main”.

To access the news lists of your panel, click on the Manage lists button in the News management.

• The overview list shows all existing lists with their respective titles and descriptions.
• In order to create another list, click on the Create list button and enter the desired title and a description. After clicking on Save the list is created and you can start allocating articles to it.
• You can rename or delete the lists.