Expandable Paragraphs
Previous Topic  Next Topic 


An Expandable Paragraph is an Html only feature that allows you to present your help text in an interactive, intuitive style, that allows the user to see only what they are interested in. For example:-


Let's say you want to show your user information on three options. Two may be completely irrelevant to them, so there is no point in having them read through or scan down the page until they see the option that is relevant. If they can immediately see what is relevant to them, they can click on it to reveal more information, which is very intuitive. Click on any of the options below to see an example.


Click here if you are under 20

Click here if you are between 20 and 40

Click here if you are over 40


Creating an Expandable Paragraph

  1. Type in some text that will act as the link to hiding and closing the hidden paragraph, such as "Click here"
  2. Select "Insert | Expandable Paragraphs" and decide whether your Paragraph will initially be hidden or visible. You may decide to make the first paragraph of a group of paragraphs visible.
  3. Select a pair of images to represent your expandable paragraph.
  4. Click [OK] and you will see that your highlighted text is now a link and that you have a BEGIN and END ExpandableParagraph tag. In between these two tags is where you edit your help text. In the above example I indented the text and added paragraph color from the "Format | Paragraph" menu.


Editing your Expandable Paragraph Link

Double-click the link and you can set the initial visibility of the paragraph or change the images used. To edit the text simply type within the BEGIN and END tags.


Changing Images

A collection of paired images is provided for your use. These are located in the "Templates\Images" folder, below your installation folder. You can add more images here and select them using the ellipsis button next to the Hidden and Visible image fields in the "Expandable Paragraph" screen.