How do I post an image in the header of my front page?

Posted by bobobrazil10 on February 18, 2008 at 8:24pm

I'm a new user, and relatively unsophisticated. I'm trying to add an image to the header of my 501(C)(3) organization's localhost test site.

I installed the header image module, and added a block. There are no header image nodes associated with this block,though. I presume I next need to associate a header image node with the block somehow, but I'm not sure how to create a header image node, or how to associate it with the block. Can anyone help me?

Thanks.

Drupal 5.3
Configuration file Protected
Cron maintenance tasks Last run 44 min 13 sec ago
Database schema Up to date
File system Writable (public download method)
GD library bundled (2.0.34 compatible)
MySQL database 5.0.45
PHP 5.2.5
Unicode library PHP Mbstring Extension
Web server Apache/2.2.6 (Win32) mod_ssl/2.2.6 OpenSSL/0.9.8g PHP/5.2.5

Comments

Specifics

Posted by jacobmn on February 18, 2008 at 9:41pm

Are you trying to add ONE image to the header of all the pages across your site or custom images on a per-page basis?

Specifics

Posted by bobobrazil10 on February 18, 2008 at 10:01pm

For now, just one image. Maybe later, I'll add other images to different pages.

Thanks.

Template file

Posted by jacobmn on February 18, 2008 at 10:53pm

Well, if I were you and I wanted to add just one across the site I would simply give the header DIV a background image using css... or if that's not exactly where you want to put it you could add a div in your page.tpl.php file for whatever theme you are using.

That would simplify it for now and add one less module to slow down your site during loading. Then later, when it comes time to customize things a bit more add in that module.

Way over my head

Posted by bobobrazil10 on February 19, 2008 at 8:12pm

Thanks for the response, but I don't understand how to do what you suggest. I know next to nothing about css and php.

I presume, from what you say, that I could edit the theme I am using. I believe I can find the right file, but I don't know how to "add a div".

Could you give me a few more details? Thanks.

Sure

Posted by jacobmn on February 25, 2008 at 4:43pm

So depending on what theme you are running it will have a folder. It will be in the /themes folder or if it's a non-default theme it will be wherever you put the files. In the directory of the theme you are using there will be a file called page.tpl.php. This is what is determing the html output for a page layout.

Most themes will include a <div id="header"> or something like it that contains your site name, logo and maybe some navigation. It's pretty hard to know exactly what that will be without knowing what theme you are using.

If you can tell me that I can give more in-depth instructions.

Theme

Posted by bobobrazil10 on February 27, 2008 at 9:47pm

The theme is Pushbutton, which came with the Drupal download. I'm not married to it, I just used it because it looks so much different than this site- I have my site open in one tab, and this site open in another tab, so I can follow instructions easier.

I'm out of the office until Monday, so I'll check the page.tpl.php when I get there, and post the results.

Thanks for the help.

More details

Posted by bobobrazil10 on March 3, 2008 at 7:24pm

I found my page.tpl.php file, opened it and looked through. There is no in the pushbutton theme file.

The only mention of "header" in my file is this:

<?php
print $header 
?>

There are several other div id's, but no div id="header".

Thanks.

Scott

Oops

Posted by bobobrazil10 on March 3, 2008 at 8:51pm

That doesn't seem to print out right.

(td colspan="2")(div)(?php print $header ?)(/div)(/td)

I replaced the carrots with parens.

Ok, it's been a while since

Posted by jacobmn on March 5, 2008 at 7:06pm

Ok, it's been a while since I've looked at this thread. One thing you might try that wouldn't involve any coding would be to simply open the file 'header-b.jpg' which is set as the background image for the <div id="primary-menu"> . It's located in the same folder as your page.tpl.php for pushbutton.

If you create a file with the same dimensions as that one and name it 'header-b.jpg' it will show up where the default pic of a hand on a keyboard is with the pushbutton theme (behind the primary links).

This doesn't offer a lot of flexibility unless you want to get into editing the html and css output of the theme, but it might do the trick in this case. Good luck!

Can't quite get it to work

Posted by bobobrazil10 on March 10, 2008 at 7:23pm

Thanks for your reply. I found "header_b.jpg", and it's the background image I see in the header, right where I want my header. So far, so good. I renamed this header-b1.jpg, and put my banner in the same folder, and renamed it "header_b.jpg."

I then closed my site and reopened it, expecting to see my header banner instead of the old one. The old one showed up instead. I even rebooted the computer, thinking that there might be an .ini file that needs to be restarted. Still no luck.

I then looked for the div id="primary-menu" you mentioned in the page.tpl.php file. I found a table id="primary-menu", but no div id. There was no mention of header_b.jpg anywhere in the page.tpl.php file.

My banner is close to the same size as the original header_b, but not exact. Does it need to be?

Sorry I haven't been more "johnny on the spot" about replying, but I'm doing this as a volunteer job on Mondays only, so I end up thinking about it once a week. I appreciate the help.

Oops

Posted by bobobrazil10 on March 10, 2008 at 7:55pm

Well, I started working on some other things while I waited for a reply to my last post. I looked up, and somehow my banner was up where I wanted it! I have no idea why it didn't appear the first time, but it's there now. Thanks!

Point and click solution?

Posted by mysty on February 21, 2008 at 11:09pm

Of course jacobmn is right, but the following may be simpler depending on what you need to do.

Go to admin > themes > configure (the active one) > enable the logo checkbox > and under 'Logo image settings' select an image to upload. And presto!

This will replace the existing (drupal) logo with a new files of the same name, so in the case of the bluebreeze theme, the drupal logo will be files/bluebreeze_logo.gif and then the new logo file you upload will overwrite this with the same file.

Anyway, the result is that there will be a replacement picture, without having to edit the php.tpl files. If you aint backup up the original, then you know where to get it..

You may also need to enable the checkbox under the Global (defaults for themes) settings under -insert.yoursite-/admin/build/themes/settings, if its not already, as well.

Hope that helps. Do pls consider replying with the solution that you find in case someone else is looking.

Thanks,

mysty

Logo replacement

Posted by bobobrazil10 on February 27, 2008 at 9:41pm

I successfully did that, but the pic I want to use is a wide banner-like pic. It got squeezed into the logo field, and the aspect ratio was then all wrong.