Ektron
Ektron’s Menu feature lets users create and maintain a drop-down menu system for your website. The menu options can link to content, library files, external hyperlinks, and submenus. Below is a sample menu.
In this example (delivered with Ektron OnTrek sample site), the menu appears when a site visitor moves the cursor over Products on the home page. If a content contributor with permission to edit menus signs in to Ektron then views the menu, it has options for editing the menu and adding content.
NOTE: If you choose to hide the border that surrounds content when you are logged in, the Add and Edit options are also hidden. This lets you view the page as it appears when not logged in. If the page is set to show borders and you still do not see Add and Edit, the feature may be turned off. Ask your administrator or website Developer for more information.
Managing menus is a two-step process. The first sections in this chapter describe the first step: how Ektron users create and update menus. In the second step, a developer places a menu server control on a Web form. The control manages how the menu displays on your website.
There are 3 ways to access the Menus feature:
If you choose the first or second option, you select a specific menu. Then, it appears on the View Menu screen. For the third option, the selected menu appears on the View Menu screen.
From the View Menu screen, you can perform the following actions on a menu.
To work with menus, a user must be one of the following.
You can create a menu by navigating to a folder or by choosing Content > Menus from the Workarea’s left frame. If you choose Content > Menus, it is automatically assigned to the root folder. In contrast, if you choose a content folder then create a menu, it is assigned to that folder.
Fields on the Add/Edit Menu Screen
Field | Description |
Title | The name given to the menu by its creator. It appears on the Web page to indicate the kind of information on the menu. |
Image Link | You can have an image appear next to or instead of the menu title. For example: To do this: Prerequisite The image must reside in the library. If it does not, add it before proceeding. For more information, see Adding a File to the Library.
Using Image to Replace Title Text Alternatively, you can replace menu text with an image, so that only the image appears on the menu. To do this, check the Use image instead of a title box. |
After you create a menu, your developer links it to text or an image on a Web page by modifying a page template. When a site visitor moves the cursor over the text or image, the menu appears. In the example below, the menu appears when the site visitor moves the cursor over Products. You can also assign a URL link to a menu using this field. If you do, and the user clicks the link text or image, he jumps to the specified page. For example, in this field, you assign the product landing page, Entering the Path to the Landing Page The path may be
| |
NOTE: This field applies to content only. It has no effect on other types of menu items (such as images). Also, this field only affects content that dynamically references a content block, such as If you want to apply a template to this menu, enter it here. If you do, content on this menu uses this template when selected from the menu. If you do not, this menu's content uses the template specified in its Quicklink. | |
Description | Add a more detailed description for the menu. |
Folder Associations | |
Template Associations |
After creating the menu, you may assign items to it. See Adding a Menu Item .
If you choose a content folder then create a menu, it is assigned to that folder.
After creating the menu, you may assign items to it. See Adding a Menu Item .
There are 3 ways to add a menu item.
To add a menu item via a content folder:
The Add New Item screen displays a list of items you can add to the menu. Use to the table below to select a type of menu item, and follow the steps to add it.
Fields on the Add/Edit Menu Item Screen
Title—The name of the menu item. It appears on the Web page to indicate the item.
Image Link—You can have an image appear next to or instead of the menu title. For example:
To do this:
NOTE: Before beginning these steps, the image must reside in the library. If it does not, add it before proceeding. For more information, see Adding a File to the Library.
Replacing Title Text with Image
Alternatively, you can have the image replace the menu text, so that only the image appears on the menu. To do this, check the Use image instead of a title checkbox.
URL Link—After you create a menu, your developer links it to text or an image on a Web page by modifying a page template. When a site visitor moves the cursor over the text or image, the menu appears. In the example below, the menu appears when the site visitor moves the cursor over Products.
You can also assign a URL link to a menu using this field. If you do, and the user clicks the link text or image, he jumps to the specified page.
For example, in this field, you assign the product landing page, siteroot/products.aspx
. In the illustration above, if the user moves the cursor over Products, the assigned menu appears. However, if the user clicks Products , he jumps to siteroot/products.aspx
.
Entering the Path to the Landing Page
The path may be
siteroot/jobs.aspx
wellness.aspx?id=40&wellness=Hemophilia
http://www.example.com
.Description—Add a more detailed description for the menu.
Target—
Determines the type of window that appears when you click a link in the server control.
Link—Use this field if you want to override this content's menu template by using the template specified in its Quicklink.
IMPORTANT: If you check items then proceed to another screen before clicking Add, the items on the first screen are not added to the menu.
As an alternative, navigate to a content folder, click items to be assigned, right click the mouse and select Copy. Then, locate the menu, right click the mouse, and select Paste Items to Menu.
The View Menu screen reappears, showing the new content.
To add a library file as a menu item via a content folder or menus tab:
NOTE: To insert assets, the menu’s folder must contain library assets. However, you can insert library assets from other folders for which you have permission.
To add an external hyperlink as a menu item via a content folder or the Menus tab:
www.example.com
.NOTE: When you add an external hyperlink menu item, the URL does not get added to the library nor is an ID assigned to it. So, when you save the menu item, it is not added to the Ektron database nor can it be retrieved for future use.
NOTE: You can only use this feature after your Web developer has modified a page template to display the menu. For more information, see Introduction to Menu Server Controls.
This section describes each option for editing a menu's properties.
Alternatively, hover the cursor over the menu in the left panel, right click the mouse, and click View Properties.
Just like editing a menu, you can view a menu via...
When viewing a menu via the content or menu folder, you get an internal view of information entered by menu creator. When viewing via a navigation link on a Web page, you get an external view of the menu, as seen by anyone navigating website.
Alternatively, hover the cursor over the menu in the left panel, right click the mouse, and click Reorder Items.
The Reorder Items screen appears.
NOTE: Deleting a menu automatically deletes all menu items associated with it. Do not confuse the menu link with the item itself. For example, deleting a menu deletes its links to content but has no effect on the content.
NOTE: For background information about supporting multiple languages on your website, see Working with Multi-Language Content.
You can create an edition of any menu in every supported language. When a site visitor selects a language and clicks a menu link, Ektron displays the menu in that language if it is available. If it is not available, nothing appears.
Before creating or translating a menu, you should create or translate all content that will be on the menu. In this way, you can link this content to the new menu. However, after creating a menu, you can add new items to it.
To translate a menu into any supported language: You can navigate to the menu via the website or from the Workarea. Each procedure is described below.
The View Menu screen appears for the selected menu.
The Add Menu screen appears.
The Add Menu screen appears.
If all of the following conditions apply...
EnableSmartOpen
property is true appears on the screen...the Flex Menu automatically displays the items on the associated submenu.
NOTE: Navigation to the content can consist of clicking a quicklink, a menu option, a list summary item, the result of a search, and so on.
In effect, you are instructing Ektron to expose a menu whenever a content item that resides in a selected folder appears. As a result, a user looking for a specific item sees similar items.
As an example, assume your website sells books, and folders are organized by genre. One of your folders is “Teen Fiction.” You create a submenu that contains the top 5 sellers in “Teen Fiction.” You then associate the Teen Fiction folder with that submenu. When a site visitor finds views a book in that category, a Flex Menu in the page’s left column displays the top 5 Teen Fiction titles.
The Select Folder screen lets you assign new folders to a menu, reorder folders, and delete folders from the menu association. These tasks are described below.
When you click Change below Folder Associations on the Edit menu screen, the Select Folder screen appears.
The following table describes tasks you can perform on these screens.
Task |
Instructions |
Add folder to list |
|
Remove folder from list |
|
Remove all folders from list |
|
Move a folder up or down on the list NOTE: The folders' sequence has no impact on how they are used. It only affects the appearance of the Select Folders screen. |
|
Save changes and return to Edit Menu screen |
Click Save. |
Exit screen; do not save changes |
Click Exit (). |
If all of the following conditions apply....
EnableSmartOpen
property is true appears on the screen...the Flex Menu automatically displays the items on the associated submenu.
NOTE: Navigation to the content item can consist of clicking a quicklink, a menu option, a list summary item, the result of a search, and so on.
In effect, you are instructing Ektron to expose a menu whenever a content item that uses one or more selected templates appears on the screen. As a result, a user who begins looking for a specific content item sees similar items.
As an example, assume your website sells books, and your templates are organized by genre. One of your templates is “Teen Fiction.” You create a submenu that contains the top 5 sellers in “Teen Fiction.” You then associate the Teen Fiction template with that submenu. If a site visitor visit a page describing the book, the Flex Menu in the page’s left column displays the 5 top Teen Fiction titles.
To later change or remove the template, select it then click Change or Remove.
IMPORTANT: Starting from release 8.6, the Flex Menu and Menu server controls were replaced by the FrameworkUI: <ektron:MenuView> templated server control. If you are already using the Flex Menu and Menu server controls, you can continue to do so, but Ektron recommends using current versions of functionality.
Managing menus is a two-step process. The previous section describes the first step, which is how Ektron users create and update menus. The second step involves a developer placing a menu server control on a Web form. The server control manages the display of the menu on your website. This section introduces concepts that affect all of them, and explains the differences between them.
Ektron provides 2 menu server controls: Flex Menu and Menu
Type | Appearance |
---|---|
Flex |
or (Other styles are available) |
Menu |
|
Property |
Flex Menu |
Menu |
|
|
|
Shutter menu (When you click a menu, it opens directly below the menu title) |
|
|
Secondary menu opens when cursor hovers over it |
(alternative: secondary menu opens when clicked) |
|
Starts out collapsed; expands as site visitor selects secondary menu |
|
|
All menu levels open when page displays |
(optional) |
|
Can display secondary menu to the right of the root menu, instead of directly below it |
(optional) |
|
How appearance is modified |
Server control properties and style sheet |
Xslt and style sheet |
How behavior is modified |
Xslt |
Xslt and style sheet |
Option to launch menu links in a new window |
|
|