Joomla Templates Club 406,261 posts

[marcendres Friend marcendresJoin date: August 2008Posts: 15Downloads:0Uploads:7 Thanks: 2]

#134101

Hello ladies and gents,

I´d like to know how to change the font-weight for the second level into bold. I can’t find a class for the second level. Sorry, I speak from the main menu at the left side.
For instance, I would get Welt der Familie a bit bigger or bolder or in a different color than level 1.

Anyone an idea???

---

Attachments:

1. 

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#274197

Hi marcendres !
you can do it following way below :
Open template.css file in templates/ja_edenite/css folder, find following code section at about line 864 :


ul.menu li li a {
font-weight:normal !important;
}


and change it to :


ul.menu li li a {
font-weight:bold;
color:red;
}


“red” is sample color , you can change it by other color .

[marcendres Friend marcendresJoin date: August 2008Posts: 15Downloads:0Uploads:7 Thanks: 2]

#274203

that`s not the effekt it should be!

Here `s the code I got in template.css:
ul.menu {
list-style: none;
margin: 0;
padding: 0;
}

ul.menu li {
background: none;
margin: 0;
padding: 0;
}

ul.menu li a {
display: block;
outline: none;
padding: 6px 4px;
color: #626A69;
border-bottom: 1px solid #E7E8E6;
background: url(../images/arrow.png) no-repeat 97% center;
}

ul.menu li a:hover,
ul.menu li a:active,
ul.menu li a:focus {
color: #2C79B3;
background: url(../images/arrow2.png) no-repeat 97% center;
}

ul.menu li.active a {
color: #2C79B3;
#color: #000000;
#font-weight: bold;
}

ul.menu li ul {
list-style: none;
margin: 0;
padding-left: 10px; //verantwortet die Einrückung für das untergeordnete Menü!
}

ul.menu li li a {
background: url(../images/bullet.gif) no-repeat 10px 13px !important;
border: none;
font-weight: bold;
color:red;
padding-left: 20px !important;
width: 75%; /*need for ie6 transparent*/

}

the result is hold in the jpg at the bottom.

Instead, I wolud be glad if only the 2nd level is bold as also the 1st level, but not the 3 rd level. Is there any solution for???

---

Attachments:

1. 

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#274204

Hi !
if you want it apply to 3 rd level , you add following code to template.css file :


ul.menu li li ul a {
background: url(../images/bullet.gif) no-repeat 10px 13px !important;
border: none;
font-weight: bold;
color:red;
padding-left: 5px !important;
width: 75%; /*need for ie6 transparent*/
}


[marcendres Friend marcendresJoin date: August 2008Posts: 15Downloads:0Uploads:7 Thanks: 2]

#274209

I only wnat the 1st and second level bold, the rest was o.k. Now there`s nothing bold and 3rd level is on the same position as the 2nd level!

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

ul.menu li {
background: none;
margin: 0;
padding: 0;
}

ul.menu li a {
display: block;
outline: none;
padding: 6px 4px;
color: #626A69;
border-bottom: 1px solid #E7E8E6;
background: url(../images/arrow.png) no-repeat 97% center;
}

ul.menu li a:hover,
ul.menu li a:active,
ul.menu li a:focus {
color: #2C79B3;
background: url(../images/arrow2.png) no-repeat 97% center;
}

ul.menu li.active a {
color: #2C79B3;
#color: #000000;
#font-weight: bold;
}

ul.menu li ul {
list-style: none;
margin: 0;
padding-left: 10px; //verantwortet die Einrückung für das untergeordnete Menü!
}

ul.menu li li a {
background: url(../images/bullet.gif) no-repeat 10px 13px !important;
border: none;
font-weight: normal !important;
padding-left: 20px !important;
width: 75%; /*need for ie6 transparent*/
}

ul.menu li li ul a {
background: url(../images/bullet.gif) no-repeat 10px 13px !important;
border: none;
font-weight: bold;
color:red;
padding-left: 5px !important;
width: 75%; /*need for ie6 transparent*/
}
ul.menu li li a:hover,
ul.menu li li a:active,
ul.menu li li a:focus {
background: none;
}

---

Attachments:

1. 

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#274948

Hi marcendres !
sorry for delay ! i have tried it on my local and it runs well , it seems have some differences of menu config in my local and your site, so it is the best if you can send url of your site, i will check it for you !

[marcendres Friend marcendresJoin date: August 2008Posts: 15Downloads:0Uploads:7 Thanks: 2]

#275013

saarmesse2.intersaar.de
It`s a subdomain for training… please without www.

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#275206

Hi marcendres !
you can fix it following way below :
Open template.css file in templates/ja_edenite_template_j15/css folder , find following code section at about line 861 :


ul.menu li ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0;
padding:0;
}


change to :


ul.menu li ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0;
padding:0;
padding-left:10px;
}


this is code for fix padding of menu level 3 .

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#275207

to bold level 2 menu , you add following code section to template.css file :


ul.menu li.current span {
font-weight: bold;
}


[marcendres Friend marcendresJoin date: August 2008Posts: 15Downloads:0Uploads:7 Thanks: 2]

#275981

.. but I construct simultaneously 3 pages…

But no, the effect of copying is that the 1st level is bold if activated, but not the second level.

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

ul.menu li {
background: none;
margin: 0;
padding: 0;
}

ul.menu li a {
display: block;
outline: none;
padding: 6px 4px;
color: #626A69;
border-bottom: 1px solid #E7E8E6;
background: url(../images/arrow.png) no-repeat 97% center;
}

ul.menu li a:hover,
ul.menu li a:active,
ul.menu li a:focus {
color: #2C79B3;
background: url(../images/arrow2.png) no-repeat 97% center;
}

ul.menu li.active a {
color: #2C79B3;
font-weight: bold;
}

ul.menu li ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0;
padding:0;
padding-left:10px;
}

ul.menu li.current span {
font-weight: bold;
}
ul.menu li li a {
background: url(../images/bullet.gif) no-repeat 10px 13px !important;
border: none;
font-weight: normal !important;
padding-left: 20px !important;
width: 75%; /*need for ie6 transparent*/
}

ul.menu li li a:hover,
ul.menu li li a:active,
ul.menu li li a:focus {
background: none;
}

That’s template.css with all changes I made…

[Author]

Posts