Serendipity Forums

Posted: **Thu Mar 13, 2008 3:36 am**

ok I have my site http://www.websmuggler.com/blog2

I amhappy with what I have so far but I have one issue I have searched the forums and maybe I am just looking wrong but how can I put my banner in the top part of the header where the blue is on the site andmake it clickable so that it returns to the homepage of my site. I have looked on the board and cant find anything at all. Kinda depressing if you ask me

. If someone could even point me to the post that might have this information I would be happy beyond measure.

Posted: **Thu Mar 13, 2008 10:07 am**

Hi!

For that, you can edit the "index.tpl" template file of your selected template. You can copy over the templates/default/index.tpl file if your template directory has no such file.

In there you can add your custom HTML you need for your header. The alternative is to try to solve it with CSS only, by editing your style.css template file.

HTH,
Garvin

Posted: **Thu Mar 13, 2008 10:37 am**

virtex wrote:I amhappy with what I have so far but I have one issue I have searched the forums and maybe I am just looking wrong but how can I put my banner in the top part of the header where the blue is on the site andmake it clickable so that it returns to the homepage of my site.

You're using Bulletproof, and as far as I can tell you're adding the banner using the BP theme option to include an additional banner. Is that right?

First of all, there is no way to make the banner clickable with this technique. This was meant for people who want to just add their own banner image easily, period.

I'm afraid you're going to have to reset that again and hack the index.tpl. It's probably a good idea to either create a copy of /templates/bulletproof/ and it's content, maybe /templates/bp or something. The alternative is to keep a copy of your modified index.tpl and "reinstall" this copy every time BP is updated (which will most likely be the case with any s9y update).

Here's the code for your index.tpl:

Code: Select all

<div id="serendipity_banner">
    <a href="{$serendipityBaseURL}"><img src="http://www.websmuggler.com/blog2/uploads/logo_hdr.gif" width="701" height="180" alt="Logo (links back to start page)" /></a>
</div>

You're also going to have to modify blue_style.css like this (which means you're going to have to keep a backup copy of this, too):

Code: Select all

#serendipity_banner {
    margin: 0;
    height: 180px;
    background: #3D98C5 url('img/blue_header.jpg') repeat-x center left ;
    border: 0px;
}

#serendipity_banner img { border: none; }

That's it, at least for starters. You could also put these changes into a new file called user.css and activate the BP theme option to use this file, which wouldn't be altered in case of an update, but I figured this is pointless because you're going to have to keep backup files anyway.

For further information on BP also see http://s9y-bulletproof.com

YL

Posted: **Thu Mar 13, 2008 10:04 pm**

Of course, all that stuff is only necessary if you want the whole banner to be clickable to return you to your home page. The blog name and subtitle (which you can set in your admin options) are already clickable links to the home page. I notice you've set them blank; if you add them back in, you'll get the links you're looking for.

If you just want a custom header, I had problems getting Bulletproof to use my custom image in the header, too. I didn't realize that two steps were necessary:

Select an image for the custom header
Enable the "use custom image" option

I've got a couple of ideas for a clickable banner that don't require modifying Bulletproof files or keeping copies around for when an updates overwrites your changes.

Option 1 for a clickable banner is to enable the nav bar. Just provide a single link, "home". With this option, you could even set the "whole banner" clickable with a little something in your user.css (after you turn that option on in the config):

Code: Select all

#sitenav a {
  display: block;
  width: 701px;
  height: 180px;
}

Unfortunately, the banner may not overlap with the nav bar, and you may wind up with some visual anomalies. (Bear with me, I'm making this up as I go along!)

Option 2 is probably your best bet. Don't worry about the nav bar. Make sure your user.css is enabled in the BP options, and then expand the H1 and H2 links so they entirely cover the banner. Finally, replace the banner with a custom banner in the BP options, as described above.

I'd probably remove the H2 link altogether, and make the H1 link take up the whole banner, like this:

Code: Select all

.serendipity_banner h2 {
  display: none;
}
.serendipity_banner h1 a {
  display: block;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 72px;
}

I used Firebug on your site to make sure that would work.

The nice thing about Option 2 is that it uses the existing options and won't be overwritten when Bulletproof is updated. You get a custom, clickable banner that takes you back to your home page, just as you desired.

Posted: **Sun Mar 16, 2008 12:28 pm**

I ended up resetting my theme to serendipity 3.0 and have been fooling around. Thanks alot for the feedback. will impliment it as soon as I get back to my office this monday

Serendipity Forums

Having issues find/ putting banner,

Having issues find/ putting banner,

Re: Having issues find/ putting banner,

Re: Having issues find/ putting banner,