I am creating a theme with multiple navigation menus for a theme using theme-settings, in liferay look-and-feel.xml I have added the below code:
<settings>
<setting configurable="true" key="navigation" type="select"
options="left-vertical,right-vertical,horizontal" value="horizontal" />
</settings>
portal_normal.vm file:
<!DOCTYPE html>
#parse ($init)
<html class="$root_css_class" dir="#language ("lang.dir")" lang="$w3c_language_id">
<head>
<title>$the_title - $company_name</title>
<meta content="initial-scale=1.0, width=device-width" name="viewport" />
$theme.include($top_head_include)
</head>
## navigation menu selection related code
#set ($navigationLeft = $theme.getSetting("navigation"))
#if ($navigationLeft == "left")
#set ($css_class = "${css_class} navigation-left")
#end
#if ($navigationLeft == "left-right")
#set ($pull1 = "")
#set ($pull2 = "pull-right")
#else
#set ($pull1 = "pull-right")
#set ($pull2 = "")
#end
<body class="$css_class">
<a href="#main-content" id="skip-to-content">#language ("skip-to-content")</a>
$theme.include($body_top_include)
#dockbar()
## docbar settings
#set ($dockbar = $theme.getSetting("dockbar-mode"))
#if ($dockbar == "split")
#set ($css_class = "${css_class} dockbar-split")
#end
#set ($navigationLeft = $theme.getSetting("logo-menu-direction"))
#if ($navigationLeft == "left-right")
#set ($pull1 = "")
#set ($pull2 = "pull-right")
#else
#set ($pull1 = "pull-right")
#set ($pull2 = "")
#end
<div class="container-fluid" id="wrapper">
<header id="banner" role="banner">
<div id="heading">
<h1 class="site-title">
<a class="$logo_css_class" href="$site_default_url" title="#language_format ("go-to-x", [$site_name])">
<img alt="$logo_description" height="$site_logo_height" src="$site_logo" width="$site_logo_width" />
#* #if ($show_site_name)
<span class="site-name" title="#language_format ("go-to-x", [$site_name])">
$site_name
</span>
#end
*#
</a>
</h1>
<div class="navigation-menu $pull2">
<div class="line1"></div>
<div class="line2"></div>
<div class="line3"></div>
</div>
<h2 class="page-title">
<span>$the_title</span>
</h2>
</div>
#if ($has_navigation || $is_signed_in)
#parse ("$full_templates_path/navigation.vm")
#end
</header>
<div id="content">
<nav id="breadcrumbs">#breadcrumbs()</nav>
#if ($selectable)
$theme.include($content_include)
#else
$portletDisplay.recycle()
$portletDisplay.setTitle($the_title)
$theme.wrapPortlet("portlet.vm", $content_include)
#end
</div>
<footer id="footer" role="contentinfo">
<p class="powered-by">
#language ("powered-by") <a href="http://www.liferay.com" rel="external">Liferay</a>
</p>
</footer>
</div>
$theme.include($body_bottom_include)
$theme.include($bottom_include)
</body>
</html>
By default I am showing horizontal menu.
Now when the user selects left-vertical, or right-vertical I am displaying the navigation menu correctly but whenever user selects the horizontal I need to show the default horizontal navigation menu. How do I achieve this?
In the above code I have not written any code regarding 'horizontal' because again I need to write CSS for it. Instead of when I apply theme for first time it will show horizontal menu that settings I need to apply when I select horizontal.
How do I achieve it?
Using the GetterUtil you can have a default value in case of the select has no value yet selected.
This is an example: