Sign Up for OSTraining

Welcome, Guest
Username: Password: Remember me
  • Page:
  • 1

TOPIC: Adjust logo container size?

Adjust logo container size? 11 months 5 days ago #48975

  • redhalton
  • redhalton's Avatar
  • OFFLINE
  • OSTarlet
  • Posts: 42
  • Karma: 0
Hi

I'm trying to insert a logo 404 x 90px. When I upload my new logo it doesn't allow the logo to display properly. Using firebug I can change the html to 404 x 90px and the logo displays perfectly, however I'm not getting very far making permanent changes.

Can you have a look and let me know what steps I need to take to make the adjustments?

The webpage can be seen here; www.firstaidonsite.ca

Thanks
Please become a member of OSTraining to reply to this post.

Adjust logo container size? 11 months 5 days ago #48977

  • edandrea
  • edandrea's Avatar
  • OFFLINE
  • OSTop Dog
  • Posts: 3106
  • Thank you received: 7
  • Karma: 0
Hi Redhalton,

To make permanent changes you need to change the css in the actual style sheet that has that element. You'll do that with the file editor or download the file and use an editor on your computer then reupload it.

Before you make changes to the style sheets, save copies of the originals in case you need to revert back to an earlier version.

You can use firebug to find the location of the style sheet you need to edit. This tutorial will explain it pretty well. (It says it's for WordPress but it's actually very generic.)

www.ostraining.com/blog/wordpress/firebug-wordpress-css/

YOu might also be interested in this one.
www.ostraining.com/blog/coding/firebug-logos/

Let us know how it goes.
Cheers,
Ed
Please become a member of OSTraining to reply to this post.

Adjust logo container size? 11 months 5 days ago #48989

  • redhalton
  • redhalton's Avatar
  • OFFLINE
  • OSTarlet
  • Posts: 42
  • Karma: 0
Thanks for the prompt reply.

I'm completely stumped. I've been at this for hours and can't get the template container to 404 x 90px. Read the tutorials, taken all the OS courses (previously), came a long way but for the life of me, this has me beat.

I need help.

Thanks...
Please become a member of OSTraining to reply to this post.

Adjust logo container size? 11 months 5 days ago #49006

  • tessa
  • tessa's Avatar
  • OFFLINE
  • Moderator
  • Posts: 3946
  • Thank you received: 134
  • Karma: 9
Hi Redhalton,

I've been in this similar situation with trying to insert a larger logo on a template in that position, but part of it was getting cut off.

Is this the issue you are experiencing? What exactly is happening?

Could you replace that logo with the logo you are wanting so I can possibly take a look at it in firebug?
Warm Regards,

Tessa Mero



Follow us on Twitter - twitter.com/OSTraining
Like us on Facebook - facebook.com/ostraining
Please become a member of OSTraining to reply to this post.

Adjust logo container size? 11 months 5 days ago #49011

  • redhalton
  • redhalton's Avatar
  • OFFLINE
  • OSTarlet
  • Posts: 42
  • Karma: 0
Hi Tessa

The logo I'm trying to display is 404 x 90px. The template allows for a 360 x 98px logo. I need to increase the size of the logo template container(?) to allow my larger logo to display properly. The logo on the page now is 404 x 90px and as you will see, it is compressed and not looking very good.

Hope you can provide me some direction and help resolve this issue so I can move on.

Great job here on OST, thanks for everything!

Bob
www.firstaidonsite.ca
Please become a member of OSTraining to reply to this post.

Adjust logo container size? 11 months 4 days ago #49033

  • tessa
  • tessa's Avatar
  • OFFLINE
  • Moderator
  • Posts: 3946
  • Thank you received: 134
  • Karma: 9
Hi Redhalton,

I see in your img code that your width and height is being defined as the 360 x 98.

Could I see your index.php file to see where these values are coming from?


If so, could you email me your php file to tessafenwick at gmail dot com

Thank you :-)
Warm Regards,

Tessa Mero



Follow us on Twitter - twitter.com/OSTraining
Like us on Facebook - facebook.com/ostraining
Please become a member of OSTraining to reply to this post.

Adjust logo container size? 11 months 4 days ago #49060

  • redhalton
  • redhalton's Avatar
  • OFFLINE
  • OSTarlet
  • Posts: 42
  • Karma: 0
Thanks Tessa

I'm at work right now and don't have access to the file. I'll send late this afternoon.

Thanks again.
Please become a member of OSTraining to reply to this post.

Adjust logo container size? 11 months 4 days ago #49068

  • edandrea
  • edandrea's Avatar
  • OFFLINE
  • OSTop Dog
  • Posts: 3106
  • Thank you received: 7
  • Karma: 0
I'm sure Tessa will be able to get to the root of this problem for you. If you don't mind me contributing, I did see some things that might help you figure it out for yourself.

There are several divs that control the size of that area. I highlighted them in the screen shot. You also have the size of the image specified in the image tag. That's what tessa was referring to. You need to change the size of the container, but also the picture itself.

Also there is a margin set for the top of the area beneath the logo. This may also have to be adjusted. Margins from overlapping divs may need to be adjusted.

Ed
Please become a member of OSTraining to reply to this post.

Adjust logo container size? 11 months 4 days ago #49119

  • redhalton
  • redhalton's Avatar
  • OFFLINE
  • OSTarlet
  • Posts: 42
  • Karma: 0
Hi Tessa

I'm so proud of myself…I figured out the issue…LOL

The logo is being called from a 'Logo' module (I should have known) and when I deleted the existing image and replaced it with the 404px image, viola it worked. All I had to do then was adjust the padding in a 'custom.css' file I created and all is well.

Thanks again for the help, I really appreciate you and all the staff at OST!
Please become a member of OSTraining to reply to this post.

Adjust logo container size? 11 months 4 days ago #49125

  • tessa
  • tessa's Avatar
  • OFFLINE
  • Moderator
  • Posts: 3946
  • Thank you received: 134
  • Karma: 9
Hi redhalton,

I'm glad you got things figured out! :-)

That was the first thing I was checking for in your code, whether your omg width/height was being pulled from inputting a field in your admin, or simply a change in the code.

Well now your logo looks excellent! :-)
Warm Regards,

Tessa Mero



Follow us on Twitter - twitter.com/OSTraining
Like us on Facebook - facebook.com/ostraining
Please become a member of OSTraining to reply to this post.
  • Page:
  • 1

Sign Up for OSTraining

Open Source Training is not affiliated with or endorsed by the Joomla, WordPress or Drupal projects.
All product names and trademarks are the property of their respective owners.

Copyright 2013 Open Source Training, LLC. All rights reserved.