Valamis LXP Theme
The way Valamis LXP looks overall is determined by a Liferay Theme. A theme can be applied to a site or course to define its visual style and functionality in the form of various menus and buttons. By default, a Valamis LXP Theme is used, which has several notable parts:
- Control menu
- Portal menu
The Theme settings define several aspects of its appearance, like buttons, links, and fields. You can access the settings as admin, by going to Control Panel -> Configuration -> Theme Settings
There are several settings available there.
Control menu tab
Control menu is a horizontal bar on top of the screen, which includes the sidebar button and logo on the left, and various configurable icons and buttons on the right.
In the Theme Settings, you can define the following Control Menu elements:
- Upload a logo to be displayed in the top-left corner, and define a URL to which it will redirect.
- Enable or disable the Notification icon
- Define a search engine to be used: default Liferay search engine, or GSearch (recommended), and provide the results page URL.
- Toggle Saved or Messages icons and their corresponding page URLs.
Product menu tab
Product menu is a sidebar to the left of the screen, which can be opened and closed by clicking on the hamburger button.
Currently, there are three default links present on the sidebar: Courses, Dashboard, and Grades. Each have a predefined icon. You can rename them, as you like, and provide a relevant page URL to which clicking on it will lead the user.
You can also add new list items to the sidebar. They will appear on top of the previously mentioned items.
To do this, in Theme settings -> Product menu, click Add menu item, then click on the New menu item that has appeared below. You will see fields for localizable title, page URL, and Custom CSS class. You can also set an icon here, as well as hide the link from the all (or guest) users.
An item can also have a child item, which can be expanded or collapsed. This tree structure doesn't reflect the actual site page structure - you can organize these items independently from it and provide a relevant page URL for each item.
In this tab, you can set a landing page background, which will be seen when users need to log in.
Theme icons tab
Here, you can upload an icon collection in an SVG sprite format. You can then use these icons for custom side menu items.