Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Header configuration & styling (http://forum.bytesforall.com/forumdisplay.php?f=15)
-   -   Positioning the header icon (?) (http://forum.bytesforall.com/showthread.php?t=8770)

GrahamW Aug 8, 2010 09:00 AM

Positioning the header icon (?)
I apologise. I can't believe that this hasn't been asked before, but I can't actually find it in a search of the forums.

I have a draft site (http://www.gbw247.info/rlsssurrey2/) and have managed to get the title and strapline to appear in the middle of the header images area. However, I can't seem to find a way of getting the header icon (wp-content/themes/atahualpa/images/lsavers2.gif) to display itself in the same box but to the left of the title and inside the block framed 'box'.

Any help would be hugely appreciated.

Many thanks

juggledad Aug 8, 2010 09:25 AM

put your image name at ato->Style & edit HEADER AREA->Style & edit HEADER AREA then make sure to add %logo to ato->Style & edit HEADER AREA->Configure Header Area

There is a thread - HOWTO: overlay the LOGO on the Header Image - in the 'Gold Forums Tutorials' you may be interested in.

GrahamW Aug 8, 2010 05:33 PM

Thanks, but I did all of those things, and ended up pulling them again because the logo seemed to go everywhere but where I wanted it. I've added them in again, so you can see what I mean.

I really have been trying all kinds of options for two days and still have no success.

Any advice much appreciated. Cheers, Graham.

juggledad Aug 8, 2010 07:49 PM

I think the tutorial is just what you need

GrahamW Aug 9, 2010 06:12 AM


Originally Posted by juggledad (Post 39745)
I think the tutorial is just what you need

Thank you. I think you are assuming that people have arrived here via a specific route that might make them aware of the 'tutorial'. I got here through a Google search - there were no intermediate steps. When I visit the homepage for the theme there is no reference to 'gold' or 'tutorials'. I realise it must be frustrating to you to have to answer questions from people who don't appear to have done their own research, but if resources are hidden from them it isn't surprising that they don't know anything about them.

Please provide a link to the 'tutorial' and I will gladly visit and experiment.

Regards, Graham.

juggledad Aug 9, 2010 08:18 AM

This site is broken into several sub forums to make it easier for people to find information/solutions to an issue in a particular area they may have with the Atahualpa theme.

One of the additional forums is the Gold Forums, where members who have donated $20 or more can ask questions and get prompter response. In addition, gold members have access to some tutorials that have been written on a number of topics.

In addition there is a Diamond forum for members who have donated $100 or more. Donations help encourage the continued development and support of this theme.

GrahamW Aug 9, 2010 05:13 PM

Thank you. Donation made. Best wishes, Graham.

GrahamW Aug 10, 2010 07:12 PM

I'm afraid I am still having trouble getting this fairly simple layout to work....


The logo (header icon) isn't in the header titles box.
The logo and the box aren't aligned.
I can't seem to split the title text into two lines.
I can't seem to lengthen the title box

As before, any help would be much appreciated.

Many thanks, Graham.

GrahamW Aug 11, 2010 05:43 PM

Don't suppose anyone can help can they? I followed the tutorial and it had some effect, but there's still several things not working as I'd expect them to.

Many thanks

lmilesw Aug 11, 2010 09:01 PM

This should give you a start. Just put all of this in the Style box at the bottom of ATO>Header Image.
HTML Code:

margin-top: 30px;
margin-left: 30px;
width: 460px;
padding: 7px 7px 7px 80px;
border: solid 2px #000000;
-moz-border-radius: 7px;
-khtml-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
background: #fff url(http://www.life-saving.net/wp-content/themes/atahualpa/images/lsavers2.gif) no-repeat 5px center;

If you set opacity to this your image will be affected. That may work OK if you don't have the opacity set to high. For this example I just have a white background. You will have to play with the width depending on your text. You can get the text to wrap my just reducing the width of the box.

I forgot to add that you probably should set the width of your layout to 980px in ATO>Style & Configure Layout for a better look to your header.

juggledad Aug 12, 2010 05:01 AM

Graham, I don't think Larry noticed you are using the 'overlay logo on header image' tutorial, so ignore his post -

The CSS inserts you copied from the tutorial has to be tweaked fur each situation, depending on where you want the logo to be. You have added a
HTML Code:

div.logooverlay {
        z-index: 4;
        position: relative;
        float: left;
        width: auto;
        margin-top: 35px;
        margin-left: 10px;

now you want to change teh margin-top and margin-left values to re-position your logo where you want it. Try changing the margin-top to '12px'

lmilesw Aug 12, 2010 07:01 AM

Sorry about that. The overlay logo on header image works great.

I did have to use a negative left margin for the Title overlay CSS in ATO>Header Image and a z-index of at least 5 on the logo overlay CSS in ATO>Add HTML/CSS Inserts>CSS Inserts but now you can have the opacity.

GrahamW Aug 12, 2010 08:13 AM

Ah ha! Thank you both very much. I've obviously learned a lot both about this superb theme and also about the support process which will hopefully mean I don't need to ask as many silly questions in the future.

In the end, I stripped out all the changes made by following the Tutorial and, instead, implemented the settings given by Miles. It works perfectly.

Out of interest, is there a way of forcing line-breaks at all, other than changing the space available to them by shortening boxes etc? It might be a useful trick for the future.

Many thanks again.

lmilesw Aug 12, 2010 08:28 AM

I know of no way to do that for the blog title short of creating a logo with text and turning off the display of the Blog Title and Tagline.

All times are GMT -6. The time now is 04:35 PM.

Powered by vBulletin® Copyright ©2000 - 2022, Jelsoft Enterprises Ltd.