Joomla Templates Club 406,261 posts

[productid Friend productidJoin date: August 2009Posts: 9Downloads:0Uploads:0]

#145722

When I adjust the logo size in the template.css it has no effect on the front page.

Also, how do I resize the header?

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#322438

Depends on what you are resizing in your CSS.

You’ve got a JA-Header, h1-logo and h1.logo a all to concern yourself with.

The original logo is 338 x 37…so unless you go over these numbers you probably won’t notice any difference.
The logo file itself is also tied to the color of the template you are using…so perhaps you’re working on the wrong logo file.
(i.e. the Orange template’s logo is found in /images/orange/logo.jpg

So can you provide a little more detail as to what you are wanting to do?

[productid Friend productidJoin date: August 2009Posts: 9Downloads:0Uploads:0]

#322439

Regarding the logo:

When I adjust the size of the logo.jpg in the style sheet it doesn’t reflect the change on the joomla site.

Overall header height:

Within in the style sheet, there appear to be no adjustments available for the header. I am attempting to reduce the over height and so far have been unsuccessful.

The problem may be that the CSS is not working.

[ksarb Friend ksarbJoin date: October 2009Posts: 10Downloads:0Uploads:2 Thanks: 4]

#322442

i am a newbie here but i have been having the same issues, but with a lot of trial and errors and help form these forums and jbrett above :)i have been figuring out some things.

for just the logo sizing alone to see without the quite few logo styles,divs…etc to see a quick change …..

the original…
h1.logo a {

width: 355px;

height: 38px;

display: block;

background: url(../images/logo.jpg) no-repeat center;

when i change the width and height and save (i have my dream weaver set to automatic upload on save). I see the changes right away.
i think its just not uploaded to the server. I noticed sometimes even with those settings i had to click the upload arrow, especially for new images…etc.
The header…i still having issues on that myself, just waiting for something concrete..I am back at that today.

P.S. You may already saw it but there is a great thread on the logo
http://www.joomlart.com/forums/topic/insert-background-image-in-header-ja-rutile/

but the entire logo which i believe jbrett is referring to is below contains (from original template)

[PHP]#ja-header {

line-height: normal;

position: relative;

padding: 20px 0 0;

z-index: 999;

}

h1.logo, div.logo-text {

margin: 0 20px 20px;

padding: 0;

}

h1.logo a {

width: 355px;

height: 38px;

display: block;

background: url(../images/logo.jpg) no-repeat center;

}

h1.logo a span {

position: absolute;

top: -1000px;

}

div.logo-text {

outline: none;

}

div.logo-text h1 {

font-size: 250%;

font-weight: bold;

letter-spacing: 2px;

margin: 0;

padding: 0;

}

div.logo-text h1 a {

color: #333333;

text-transform: uppercase;

}

.site-slogan {

color: #999999;

margin: 0 0 -2px 10px;

padding: 0;

letter-spacing: 1px;
[/PHP]

Good luck 🙂

[ksarb Friend ksarbJoin date: October 2009Posts: 10Downloads:0Uploads:2 Thanks: 4]

#322449

<em>@productid 151380 wrote:</em><blockquote>Regarding the logo:

When I adjust the size of the logo.jpg in the style sheet it doesn’t reflect the change on the joomla site.

Overall header height:

Within in the style sheet, there appear to be no adjustments available for the header. I am attempting to reduce the over height and so far have been unsuccessful.

The problem may be that the CSS is not working.</blockquote>

I have noticed there is a lot of extra padding around the logo

for instance (drastic change ) if i change

[PHP]#ja-header {

line-height: normal;

position: relative;

padding: 20px 0 0;

z-index: 999;

}

h1.logo, div.logo-text {

margin: 0 20px 20px;

padding: 0;[/PHP]

to say just for examples sake

[PHP]#ja-header {

line-height: normal;

position: relative;

padding: 0px 0 0;

z-index: 999;

}

h1.logo, div.logo-text {

margin: 0 0px 0px;

padding: 0;

}
[/PHP]

i notice a drastic change. the header shrinks a lot.. just to see a big difference….i have played with th epadding and margins just to see what affects what, then make sure i go back so i know where i am…

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#322453

<em>@productid 151380 wrote:</em><blockquote>Regarding the logo:
Within in the style sheet, there appear to be no adjustments available for the header. I am attempting to reduce the over height and so far have been unsuccessful.
</blockquote>

This area is controlled by:
template.css – line 771

To adjust the distance between the top of the page and the top of the logo, which I think is what you are asking, simply change the 20px below…for instance 10px 0 0 will move the page up 10px. If you make it 0 0 0 the logo will touch the top of the page. etc.


#ja-header {
line-height:normal;
padding:20px 0 0;
position:relative;
z-index:999;
}

Have fun!
John.

[Author]

Posts