OBRAZ W (top) MENU [Joomla 1.5x]

[Jaczus]

Witam,
mam następujący problem.
Na stronie www.infoterm.com.pl (http://www.infoterm.com.pl) chciałbym żeby w górnym (top) menu zamiast napisu "Stiebel-Eltron" widniał obrazek:
http://imperia.de/imperia/md/images/news_logos/stiebel-eltron-logo_184x104.gif
Pracuję za pomocą narzędzia "Fire-Bug" i w nim wszystko działa, ale kiedy chcę to umieścić na stronie, nie wiem gdzie znaleźć plik html, żeby to zmodyfikować. A może da się to jakoś zmienić w stylach css ?


Z góry dzięki za poświęcony czas.

Pozdrawiam
Jacek

[idek]

w cssie musisz sobie ostylowac odpowieni identyfikator danej pozycji menu

[Jaczus]

hmm...
W wiki.jooma.pl/Moduly (http://wiki.joomla.pl/Modu%C5%82_witryny_-_Menu_witryny) znalazłem coś takiego :

"Łącze graficzne [Menu Image Link]: umożliwia grafiki jako odnośnika zamiast odnośnika tekstowego; obraz należy wybrać w projektancie pozycji menu. Zaznacz jedną z opcji. "Wybieram w Danej pozycji menu grafike menu. W module top menu(mod_mainmenu) zmieniam "Łącze graficzne" na TAK. I wciąż nie działa.

Odnośnie css

"w cssie musisz sobie ostylowac odpowieni identyfikator danej pozycji menu"Gdzie to mogę znaleźć możesz mnie jakoś pokierować ?

W template.css ?



body {
background:#FFF url(../images/bg.png) repeat-x;
margin-top:0px;
font-family:Trebuchet MS, Helvetica, sans-serif;
color:#333;
font-size:12px;
}

a:link, a:visited {
text-decoration:none;
font-weight:normal;
color:#135cae;
}

a:hover {
text-decoration:none;
font-weight:normal;
color:#999;
}

a img {
border:none;
}


/*****************************************/
/*** Template specific layout elements ***/
/*****************************************/

div#header {
width:900px;
height:200px;
margin:0 auto;
}

div#logo {
float:left;
width:210px;
height:188px;
background:url(../images/logo.png) no-repeat;
}

div#topnav {
margin-top:104px;
float:right;
width:670px;
height:38px;
}

div#breadcr {
float:right;
margin-top:15px;
height:25px;
width:670px;
font-size:10px;
}

div#container {
width:900px;
margin:0 auto;
border:1px solid #DCDCDC;
background-color:#F9F9F9;
}

div#modleft {
float:left;
margin:5px 0px 5px 5px;
width:200px;
}

div#content {
margin:5px;
float:right;
padding:10px;
width:660px;
border:1px solid #DCDCDC;
background-color:#FFF;
}

div#modbot {
margin:5px;
background-color:#E1E1E1;
padding:5px;
}

div#footer {
width:886px;
background:url(../images/footer_bg.png) repeat-x;
height:30px;
margin:0 auto;
padding:8px;
color:#FFFFFF;
font-size:10px;
}

div#copyr {
padding-right:5px;
color:#FFF;
text-align:right;
}

div#copyl {
padding-left:5px;
color:#FFF;
text-align:left;
float:left;
}



/* horizontal menu */

#pillmenu {
text-align:left;
margin: 0;
}

#pillmenu ul {
margin: 0;
padding: 0;
list-style: none;
line-height:250%;
}

#pillmenu li {
float: left;
margin-bottom:0;
margin-right:5px;
height:38px;
width:150px;
background-image:url(../images/btn_top.png);
background-repeat:no-repeat;
text-align:center;
}

#pillmenu li a {
font-family: Arial,Helvetica, sans-serif;
color:#666;
font-size: 11px;
font-weight: bold;
text-align:center;
display: block;
line-height:350%;
text-decoration: none;
}

#pillmenu li a:hover {
color:#336699;
background-image:url(../images/btn_top_mo.png);
background-repeat:no-repeat;
}

.clr {
clear:both;
}



/*****************************************/
/*** Joomla! specific content elements ***/
/*****************************************/

h1,.componentheading {
font-size:1.5em;
font-weight:bold;
color:#135cae;
}

h2,.contentheading {
font-size:1.5em;
color:#135cae;
font-weight:normal;
}

h3 {
font-size:1.3em;
}

h4 {
font-size:1.2em;
}

h5 {
font-size:1.1em;
}

h6 {
font-size:1em;
font-weight:700;
}

#footer,.small,.createdate,.modifydate,.mosimage_c aption {
font:0.8em Arial,Helvetica,sans-serif;
color:#999;
}

table.moduletable th {
color: #135cae;
}

.moduletable {
margin-bottom:1em;
padding:0 10px;
}



/* Heading of Modules */
.moduletable h3 {
text-align:left;
margin:0 -10px 0.5em;
padding:0.25em 0;
color:#135cae;
}


/*### Navi left ###*/

.moduletable_menu {
margin-bottom:1em;
border:1px solid #DCDCDC;
padding:0 10px 10px;
background-color:#FFF;
width:180px;
}

/* Heading */
.moduletable_menu h3 {
background:url(../images/mod_bg.png) repeat-x;
height:30px;
color:#666;
margin:0 -10px 0.5em;
padding-top:8px;
padding-left:15px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
text-decoration:none;
text-align:left;
}

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

.moduletable_menu li {
margin:0;
}

.moduletable_menu li a {
text-decoration:none;
line-height: 2;
background-image:url(../images/dot.png);
background-repeat:no-repeat;
background-position:left center;
}



#leftcolumn ul.menu li a {
padding-top: 6px;
padding-bottom: 6px;
padding-left: 8px;
display: block;
color: #333333;
background: url(../images/hdot2.gif) repeat-x bottom;
text-decoration: none;
outline: none;
}

#leftcolumn ul.menu li a span {
padding-left: 0px;
background: url(../images/bullet.png) no-repeat 5px 5px;
}

#leftcolumn ul.menu li a:hover,
#leftcolumn ul.menu li a:active,
#leftcolumn ul.menu li a:focus {
color: #333333;
background: url(../images/hdot2.gif) repeat-x bottom #ECECEC;
text-decoration: none;
}

#leftcolumn ul.menu li.active a {
background: url(../images/hdot2.gif) repeat-x bottom #F1F9F9;
color: #135cae;
font-weight: bold;
text-decoration: none;
}



#leftcolumn ul.menu li li {
padding: 0 0 0 10px !important;
list-style: none;
}

#leftcolumn ul.menu li li a {
color: #333333;
background: none !important;
font-size: 92%;
font-weight: normal;
}

#leftcolumn ul.menu li li a:hover,
#leftcolumn ul.menu li li a:active,
#leftcolumn ul.menu li li a:focus {
font-size: 120%;
font-weight: bold;
color: #48a9e0;
}

#leftcolumn ul.menu li li a span {
background: url(../images/bullet.gif) no-repeat 5px;
padding:0px 0px 0px 17px;
font-weight: bold;
}





a.sublevel:link {
text-decoration:none;
padding:3px 5px 3px 20px;
line-height: 2;
font-size:10px;
background-image:url(../images/dot.png);
background-repeat:no-repeat;
background-position:left center;
}

/*#############################*/

.moduletable {
margin-bottom:1em;
border:1px solid #DCDCDC;
padding:0 15px 10px;
background-color:#FFF;
width:170px;
}

/* Heading */
.moduletable h3 {
background:url(../images/mod_bg.png) repeat-x;
height:30px;
color:#666;
margin:0 -15px 0.5em;
padding-top:8px;
padding-left:15px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
text-decoration:none;
text-align:left;
}

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

.moduletable li {
margin:0;
text-align:left;
}

.moduletable li a {
text-decoration:none;
padding:3px 5px 3px 10px;
line-height: 2;
background-image:url(../images/blue_arrow.png);
background-repeat:no-repeat;
background-position:left center;
text-align:left;
}
/*#############################*/


/* END Navi */



/* META
--------------------------------------------------------- */
.article-tools {
border-top: 1px solid #DDDDDD;
width: 100%;
float: left;
clear: both;
margin-bottom: 15px;
display: block;
background: #ECECEC;
}

.article-meta {
padding: 5px;
width: 290px;
float: left;
}

.createby {
padding: 3px 3px 3px 20px;
background: url(../images/icon-user.gif) no-repeat 0 2px;
}

.createdate {
padding: 3px 3px 3px 20px;
background: url(../images/icon-date.gif) no-repeat 0 2px;
}

.modifydate {
width: 200px;
float: left;
}

div.buttonheading {
float: right;
width: 60px;
}

.buttonheading img {
margin: 7px 5px 0 0;
border: 0;
float: right;
}

/* Small text */
small, .small, .smalldark, .mosimage_caption, .createby, .createdate, .modifydate, a.readon, .img_caption {
color: #666666;
font-size: 92%;
}



/* spacers */
span.article_separator {
display: block;
height: 20px;
}

.article_column {
padding-right: 5px;
}

.column_separator {
border-left: 1px dashed #e0e0e0;
padding-left: 10px;
}

td.buttonheading {

}

td.buttonheading img {
border:none;
}

td.greyline {
width: 20px;
background: url(../images/mw_line_grey.png) 50% 0 repeat-y;
}

div#maindivider {
border-top: 1px solid #ddd;
margin-bottom: 10px;
overflow: hidden;
height: 1px;
}

table.blog span.article_separator {
display: block;
height: 88px;
}




/* forms */
table.adminform textarea {
width: 540px;
height: 400px;
font-size: 1em;
color: #000099;
}

form#form-login fieldset { border: 0 none; margin: 0em; padding: 0.2em;}
form#form-login ul { padding-left: 20px; }

form#com-form-login fieldset { border: 0 none; margin: 0em; padding: 0.2em;}
form#com-form-login ul { padding-left: 20px; }

.button {
border:none;
background:url(../images/btn_bg.png) repeat-x;
height:22px;
padding:3px 10px;
color:#FFFFFF;
font-weight:bold;
font-size:12px;
}

.button:hover {
border:none;
background:url(../images/btn_bg_mo.png) repeat-x;
height:22px;
padding:3px 10px;
color:#FFFFFF;
font-weight:bold;
font-size:12px;
}

.inputbox {
border:1px solid #CCC;
background-color:#ECECEC;
padding:1px;
}

.inputbox:hover, .inputbox:focus {
border:1px solid #CCC;
background-color:#FFFFCC;
padding:1px;
}

}

[Bazyl]

Firebug i item (http://wiki.joomla.pl/Item)

[Jaczus]

Firebug i item (http://wiki.joomla.pl/Item)

Jeśli chodzi o http://wiki.joomla.pl/Item to mój plik php modułu main_menu wygląda zupełnie inaczej.
w dodatku mam tam tylko pliki modules/mod_mainmenu/tmpl : default.php (http://www.speedyshare.com/999200294.html) i index.php (http://www.speedyshare.com/191257668.html).
Folder w góre, czyli modules/mod_mainmenu mam 5 plików (helper.php, index.html, legacy.php , mod_mainmenu.php, mod_mainmenu.xml) : PLIKI (http://www.speedyshare.com/749577989.html).
Jeżeli móglbyś rzucić okiem byłbym wdzięczny.

Z góry dziękuję za poświęcony czas.

[Bazyl]

Może link troszkę niefortunny...

Każda pozycja menu ma swój numer: itemID, gdzie ID to cyfry.

Dzięki temu możesz dowolnie ostylować...

[Jaczus]

Ok.

id=56 Itemid=29

item29

Chciałem go ostylować tak aby wyświetlić zamiast tekstu obrazek http://infoterm.com.pl/images/stories/stiebel.jpg

Czy kod będzie wyglądał tak ?:


#ul.pillmenu li.item29
{
background-image: url(http://infoterm.com.pl/images/stories/stiebel.jpg);
}
(od razu zaznaczę, że ^^ nie działa)

Czy mam go umieścić w arkuszu stylów template.css ?