• Welcome to Simple Machines Community Forum. Please login or sign up.
January 16, 2022, 01:55:31 PM

News:

SMF 2.0.19 has been released! Please update. Read more.


Header logo resizing

Started by XHIBIT911, May 20, 2013, 06:33:29 AM

Previous topic - Next topic

XHIBIT911

May 20, 2013, 06:33:29 AM Last Edit: May 20, 2013, 09:15:15 AM by XHIBIT911
Could someone direct me to a thread that might help me adjust whatever coding needs to be resized ?

The dimensions for this logo are 500x120, and I'm using  SMF 2.0.4
http://hobbymafia.com/forum/index.php

kat

Looking for an easy way out, couldn't you move the actual image to the right, a bit, like the attached?


XHIBIT911

Actually I didnt think about it until after I posted it.
I'd probably prefer it to the left side. And all I actually need is the header to allow a larger size than whats there now and heres why...Its a good chance I'll have the current logo edited with some additional images and I just want the forum already set for ez upload of the newer logo.

I figure if its already to the left, just with a larger width and height my problem is basically solved, so all I need now is where do I make the changes ?

Kindred

the the size and location of the logo is really a theme specific thing....   there are several themes that have a centered logo.

Use firefox+firebug to find the css which needs to be adjusted...     you may have competing placements with other divs in the header section, though
Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

kat

This is where it could get tricky. As that's a custom theme, we won't have as much knowledge as the theme's author will have, about how it's all coded.

Looking at it, it looks like this section of code does the header.

<body style="">
<div id="wrapper" style="width: 90%">
<div id="header">
<div class="frame">
<div id="top_section">
<br class="clear"/>
<script type="text/javascript">
<div id="main_menu">
<br class="clear"/>
</div>
</div>
<div id="content_section">
<div id="footer_section">
</div>


Dunno where that all is, you see... I'd guess at index.template.php. I'd also guess that where it says "style="width: 90%", you could probably set the height, too.

BUT, I'd suspect that the theme's index.css file will control some of what you see, there, too. (I'm no coder, as you may have guessed).

If I were you, I'd backup the theme's files, in case I seriously screw something up, and try a bit of the ol' "Trial and error", to see if I could work it all out, for myself. :)

If that makes you go you might want to wait for a coder to drop by. Or, perhaps, ask in the theme's support topic. Personally, I like trying to figure these things out, for myself, by doing things, like that.

But, of course, you might not enjoy doing those kinda of things. ;)

XHIBIT911

Firefox especially with add ons screws this old PC up so i dont even install any further add ons.
The theme I'm using is Origin Red and from what I can tell the logo is centered left. I just want to slightly increase the sizing of the width and height and Im having problems locating where to do it is all.

But I'll give your siggestion a go and see if I can find that code and if it will work after I tinker with it a bit.
I'll let ya know how it went shortly

XHIBIT911

May 20, 2013, 07:49:34 AM #6 Last Edit: May 20, 2013, 08:06:19 AM by XHIBIT911
Here's what I found in index.template.php, and now Im confused even moreso because I cant adjust it from there. Also its not in the css as i expected it would be

}

function template_body_above()
{
global $context, $settings, $options, $scripturl, $txt, $modSettings;

echo !empty($settings['forum_width']) ? '
<div id="wrapper" style="width: ' . $settings['forum_width'] . '">' : '', '
<div id="header"><div class="frame">
<div id="top_section">
<div><h1 class="forumtitle">
<a href="', $scripturl, '">', empty($context['header_logo_url_html_safe']) ? $context['forum_name'] : '<img src="' . $context['header_logo_url_html_safe'] . '" alt="' . $context['forum_name'] . '" />', '</a>
</h1></div>';

       
// the site slogan; only appears when not using a logo
        if (!($context['header_logo_url_html_safe']))
        echo '
<div id="siteslogan">' . $settings['site_slogan'] . '</div>';

        echo '

Kindred

yeah... that will require CSS updates to the various div classes and ids
Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

ARG01

The top_section is set to a minimum height which logically, simply installing a larger logo image should automatically increase the top_section height to accommodate a larger image.
That said, I cannot for the life of me understand why designers still code the images into the index.template file rather than index.css? Makes no sense in today's world.  :-\
No, I will not offer free downloads to Premium DzinerStuido themes. Please stop asking.

Kindred

ummm.... probably because they don't think the logo should be a background image? :P
Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

XHIBIT911

Hmmmm...turns out youre spot on ARG...now I'll just have to redo the banner to give it a more uniform look to it. I could actually make it larger without having to tamper with the coding.
Thanks guys

ARG01

Quote from: Kindred on May 20, 2013, 09:55:55 AM
ummm.... probably because they don't think the logo should be a background image? :P

The logo should never be considered a background image. It's simply an image added to the #top_section with the #header div.frame color being the actual background.  Logo image positioning is why css should be considered for the logo and not coded directly in php/html files. ;)
No, I will not offer free downloads to Premium DzinerStuido themes. Please stop asking.

kat

Looks pretty groovy, now!

Yay!

XHIBIT911

Yes and thanks...it does look a lot better now. Im going to add some text to it for good measure and load up some mods and push it out the old forum assembly line. Thanks again

ARG01

Back up your files before installing mods.  But of course you know that already. ;)
No, I will not offer free downloads to Premium DzinerStuido themes. Please stop asking.

kat

Always worth reminding folks, ARG. :)

Glad we could all help out, Xhibity thingummy. ;)

Advertisement: