[maskme]

dear support,

i want the menu style of sidebar in the below page

Alert Messages

to be applied to the department sidebar.

How can i do that?
The current style for department sidebar is class=”menu”
whereas the above page sidebar is class=”sub_nav”

please do help me out
thanks

Reply

[Fem]

We will consider adding sub navigation style for the departments as well in the future updates.

Reply

[maskme]

So what is the solution for now. Which file to edit so I can place it as sub_nav.

Please help

Reply

[Fem]

You have to create a template with sub navigation and add a wp_query. It’s not that easy to add just css and get it done. It’s a lot of work so that’s the reason we told you that it will be released in the future releases.

Reply

[maskme]

dear mr pam reddy,

it is very much possible,

i added this code in the custom css and it worked. only issue the sidebar name which you give in Custom Sidebars in LifeCare control panel appears above the Menu, which looks quite awkward and there is no way you can remove it, I had to apply the background color white to the text to make it invisible.

.menu {
	position:relative;
	margin: 0;
	padding: 0;
	list-style: none;
	-webkit-box-shadow: 1px 1px 2px 1px rgba( 0, 0, 0, 0.1 );
	-moz-box-shadow: 	1px 1px 2px 1px rgba( 0, 0, 0, 0.1 );
	box-shadow: 		1px 1px 2px 1px rgba( 0, 0, 0, 0.1 );
}

.menu li ul{
	margin: 0;
	padding: 0;
	list-style: none;
}

.menu li ul li a{
	background: #f5f5f5;
	color: #999999;
	padding: 9px 15px 9px 30px;
}

.menu li a {
	display: block;
	margin: 0 0 -1px 0;
	padding: 11px 15px;
	border: 1px solid #e8e8e8;
	border-bottom-color: #eeeeee;
	border-top-color: #eeeeee;
	color: #666666;
}

/* Left Sidebar Nav */
.leftsidebar .menu li.current_page_item > a,
.leftsidebar .menu li.current_page_item > a:hover {
	background-image: url(images/sub_arrowright.png);
	background-position:95% center;
	background-repeat:no-repeat;
}

.menu li.current_page_item > a,
.menu li.current_page_item > a:hover {
	position: relative;
	margin:0 -7px;
	padding: 11px 25px;
	zoom: 1;
	color: #ffffff;
	-webkit-box-shadow: inset 1px 0 0 rgba(0,0,0,0.1), inset -1px 0 0 rgba(0,0,0,0.1);
	-moz-box-shadow: 	inset 1px 0 0 rgba(0,0,0,0.1), inset -1px 0 0 rgba(0,0,0,0.1);
	box-shadow: 		inset 1px 0 0 rgba(0,0,0,0.1), inset -1px 0 0 rgba(0,0,0,0.1);
}

.menu li a:hover { background-color: #f5f5f5;}
.menu li:first-child a { border-top-color: #e8e8e8; }
.menu li:last-child a { border-bottom-color: #e8e8e8; }

.menu li.current_page_item > a,
.menu li.current_page_item > a:hover {
	background-color:#3888c8;
	color: #ffffff;
}

hope it helps somebody.

thank you

Reply

[Fem]

Thanks for sharing!

Reply