Oh dear. Why there are no support here from the community.
Had a sleep and found the answer. I am sure a lot of there wanna change the banner (I call it banner) and clueless how to do so.
I will post how I did it.. and I dont even know wot the heck is CSS!
First I uploaded the logo, you must know the size of your logo, width and height, upload that pic into the template images folder ie if you are using milkyway it is in templates>rhuk_milkyway>images. Upload it there.
Now we need to look for the current logo and replace it. FInd it in Edit CSS> click Template> click edit
Code: Select all
div#logo {
position: absolute;
left: 0;
top: 0;
float: left;
width: 447px;
height: 172px;
background: url(../images/yourlogo.jpg) 0 0 no-repeat;
margin-left: 30px;
margin-top: 25px;
change the file name to the your logo name with correct file extension.
note : this is where it is critical in order to make the logo visible it is specs ie the size. You must adjust the width adn height according to the size of your logo. Here I have already adjusted mine to 447 and 172. That is just to reveal the logo .
But the you still have that random messages that changes as you refreshes your website. I dont need it so I took it off complete by removing this string on mikly way HTML edit option
Code: Select all
<jdoc:include type="modules" name="top" />
In order the header to fit the size of my logo which is at the height of 172px. Milky way banner height was just less than half of that. So my image would have looked oversize. So I increase the height of the banner. by including this on the milky way edit HTML. This way the banner will expand with enough room to fit the height of your logo. Go to Edit HTML
find
then add
so your code should now look like
Code: Select all
<div id="header">
<div style="height: 200px ;">
<div id="header_l">
note: I picked 200px because my image height is 172px. I wanted some room between my image heights. So you need to determine the heights value yourself.
And your banner/header should look like how I posted the problem.
http://i305.[spam].com/albums/nn22 ... aforum.jpg
Here I have 2 problems. the excess of the bar both left and right and the colour is not matching to logo background colour.
Here is what I have done.
I removed the greyish rounded banner completely. I looked for the scripts below on Milklyway edit CSS. I clicked on Green_bg. (depending on which colour theme you chose, mine is green)
find
Code: Select all
div#header {
background: url(../images/green/mw_header_t.png) 0 0 repeat-x;
}
div#header_l {
background: url(../images/green/mw_header_t_l.png) 0 0 no-repeat;
}
div#header_r {
background: url(../images/green/mw_header_t_r.png) 100% 0 no-repeat;
I deleted them. Here how it will look like
http://i305.[spam].com/albums/nn22 ... forum2.jpg
As you can see that inner greyish texture has now dissappeared along with its round borders. The excess has also been removed.
My final problem was the colour of the banner background is not matching. I do know the setting of my logo background colour with is complete white #ffffff. I went to edit CSS. Click on Green_bg.
find
Code: Select all
div#wrapper {
background: #ffffff url(../images/green/mw_shadow_l.png) 0 0 repeat-y;
I changed it to the above colour setting, which is complete white.
and here how it look like in the end which I am quite satisfied.
http://i305.[spam].com/albums/nn22 ... forum3.jpg
Hope this help