Accordion Widget


Apps - Widget - Accordion icon.png This type of widget belongs to the Basic category in the widget library. It enables you to create an accordion menu containing a list of sections displayed one below the other. These sections can contain text or images, point to a HTML page, or call a page from the app or from another app. This is used to display a maximum amount of information in the least number of pages.

Notes

 Open url.png See General information on widgets.

Best Practice big icon.pngBest practice

  • You use the Accordion widget to group a small amount of information in sections. If you want to group information in horizontal or vertical tabs, you should use the Tab widget.
  • Define the height of the widget so that all of the sections are displayed (Theme > Widget Height).

Example

       EVApps - widget Accordion - Example.png

List of properties

Content

Accordions: List of sections, each with a title and content. Click [ ADD ITEM ] to add a new section. Open url.png See the procedure.

Theme

   Open url.png See the description of properties

Procedures

How to create an accordion menu with sections

1. Click [ ADD ITEM ]. In the Accordions field, enter the title of the first section of the accordion menu and specify its content. You can enter the code directly in the field or click Apps - Edit icon.png to open the text editor.

2. Repeat this procedure for the other sections in the order in which you want to display them.

  • To change the order in the Accordions list, click and drag the section you want to its new position using Apps - Order objects icon.png.
  • To delete a section, click Apps - Delete icon.png.

3. Switch to execute mode EVApps - GUI - Execute icon.png to view the accordion menu as it will appear to users.

How to retrieve the launch URL of an app

1. In the App Gallery, click Apps - Application properties icon.png next to the app you want to run.

2. In the graphic editor, click EVApps - GUI - Share icon.png in the toolbar.

             EVApps - GUI - Share Apps.png

3. Copy the app launch URL.

4. Return on your app and paste the URL:

  • either in the URL property of a hyperlink inserted on a Label, Header/Footer or HTML Code properties of a widget (via Apps - Text Editor - Hyperlink icon.png in the text editor);
  • or in the URL to Load property of the Button widget ;
  • or in the Data > Select Link Type property of the Menu widget.

Tags:
Last modified by Unknown User on 2016/12/14 14:55
Created by Administrator XWiki on 2014/11/12 20:39

Shortcuts

Recent Updates

Haven't been here in a while? Here's what changed recently:

-   Product name - ev itsm.png
-   Product name - ev sas.png

Interesting Content

How to Automate Integration
Add a Shortcut to an App
History
Quick Dashboard
Full text search - Stop Words

Powered by XWiki ©, EasyVista 2018