Hi
I am looking to add a banner image across the top of my board - as has been done for this one.
I am trying to understand how to do it.
Is it done in the Header template? If so I can't understand where to put the URL of the image.
Or is it a background that is set somewhere in the CSS?
Please can anyone help with this? An "idiots guide" would be much appreciated - as my knowledge of coding is only at "keen amateur" level.
Thanks if you can help and I look forward to hearing from you.
Mark B
O.K. I found a short term fix for this.
It's a bit "old school" but I put a centred table at the top of the Header template code and put the image in there. And then deleted some of the other stuff.
It looks fine but I would prefer to do it "properly". I am sure now that I need to put the url of the image somewhere in that original Header template code.
But I can't see where??!!
Mark
You can simply put it into <div> with 100% width and text-align: center, position the img with position: absolute and right: 50% or do it with table as you do now (it's properly but not really recommended because table design is outdated).
As for the url - you can simple place something like <img src="images/mylogo.png" alt="{$mybb->settings['bbname']}" /> or you can edit the logo url in theme properties (below stylesheet choice menu) and add this <img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" />
(2013-06-08, 01:20 AM)Destroy666 Wrote: [ -> ]You can simply put it into <div> with 100% width and text-align: center, position the img with position: absolute and right: 50% or do it with table as you do now (it's properly but not really recommended because table design is outdated).
As for the url - you can simple place something like <img src="images/mylogo.png" alt="{$mybb->settings['bbname']}" /> or you can edit the logo url in theme properties (below stylesheet choice menu) and add this <img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" />
Thanks so much for that. I didn't realise I could put the "url" of the image in that part of the code. I am going to try that later.
Thanks for helping me understand the way the code works. Hopefully I can help somebody myself in the future.
All the best
Mark
I always changed the image instead of the URL to change the theme default logo and didn't know about this way to do it. Thank you, very much!
(2013-06-08, 01:20 AM)Destroy666 Wrote: [ -> ]You can simply put it into <div> with 100% width and text-align: center, position the img with position: absolute and right: 50% or do it with table as you do now (it's properly but not really recommended because table design is outdated).
As for the url - you can simple place something like <img src="images/mylogo.png" alt="{$mybb->settings['bbname']}" /> or you can edit the logo url in theme properties (below stylesheet choice menu) and add this <img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" />
D
I tried this this evening and it worked a treat.
There's just one final piece of advice I would really appreciate.
The image is not quite flush with the left margin or top as it is at the top of this board. I think that is because at the #container level I have got width set to 742px and padding set to 4px.
Can I override this for the header (or logo?) div and set that to width = 750px and padding 0px.
I think if I can do that it will be JOB DONE but I can't for the life of me see where/how to do it.
If you can point me in the right direction that would be brilliant!
All the best.
Mark
In case it is of interest to anyone I finally resolved this problem.
I was correct that my problem was caused by the padding in the "container" styling.
I was still struggling to see how I could override this padding in the "header/logo" area when it suddenly occured to me that in the Header template I could just move the logo div ABOVE the container div.
This meant the logo attracted no padding and is exactly in line with the edges of the board (left and right) as at the top here. Of course it still relies on the px width of the logo being the same as the container width - forum plus padding.
Hope that makes sense.
^ if you still need any suggestions related to the above issue then please give forum url with the required thing(s).
(2013-06-13, 12:01 PM).m. Wrote: [ -> ]^ if you still need any suggestions related to the above issue then please give forum url with the required thing(s).
Sorry, I realise now I should have done that. Will remember for future posts.
Mark