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)
-   -   Custom links IN header image (http://forum.bytesforall.com/showthread.php?t=1436)

mkny13 Apr 26, 2009 02:48 PM

Custom links IN header image
 
I've found posts that describe now to add a custom table of links above/below the header image. My question is, is it possible to add 4-5 links and one drop down menu inside the header image? I've set my title/tagline to be inside the image on the left, I'd like to have links to Contact Us, FAQ, etc opposite it, inside on the right.

Flynn Apr 27, 2009 06:14 PM

You can move the container with the menu up and to the right with CSS and additionally add z-index in case it is covered by other items in the header image area

div#menu1 {
margin-top: -50px;
margin-left: 200px;
z-index: 10;
}

Look into the source code of a browser-rendered page of your site to figure out the ID or class of the container with the menu. If you manually added a new menu bar the ID or class may be something else and not menu1

mkny13 Apr 29, 2009 06:53 PM

Thanks. I actually ended up just relocating the elements elsewhere, but I appreciate the reply.

mkny13 May 1, 2009 05:02 PM

Well, i circled back around to try this again. In the page source, the search box is in the midst of this section:
Code:

<!-- Header -->
                <td id="header" colspan="3">
               
                <table id="logoarea" cellpadding="0" cellspacing="0" border="0" width="100%"><tr><td valign="bottom" class="search-box" align="right"><div class="searchbox">
                <form method="get" class="searchform" action="http://www.valdosta.edu/~foguz/group7/">
                <div class="searchbox-form">
                        <input type="text" class="text inputblur" onfocus="this.value=''"
                        value="Search Site" onblur="this.value='Search Site'" name="s" />
                </div>
                </form>

In CSS Inserts, I put:
Code:

div#searchform {
margin-top: -50px;
margin-left: 200px;
z-index: 10;
}

Search box stubbornly stays put. You can see the site here

Thanks

Flynn May 4, 2009 10:03 PM

Use div.searchbox { ... }

mkny13 May 6, 2009 09:49 AM

Just tried that.
Code:

div.searchbox {
margin-top: -50px;
margin-left: 200px;
z-index: 10;
}

Search box disappears entirely. I tried a variety of positive and negative values for margin-top, but I can't get any overlap. Not a big deal at this point, just a niggling problem.

hyperkurt Jul 16, 2009 09:49 PM

Quote:

Originally Posted by Flynn (Post 5678)
You can move the container with the menu up and to the right with CSS and additionally add z-index in case it is covered by other items in the header image area

div#menu1 {
margin-top: -50px;
margin-left: 200px;
z-index: 10;
}

Look into the source code of a browser-rendered page of your site to figure out the ID or class of the container with the menu. If you manually added a new menu bar the ID or class may be something else and not menu1

Flynn,
This thread is of interest to me. Would I insert the above code into the ATO>Add HTML/CSS Inserts section? If not, where should it be added/changed?
Thx!

Flynn Jul 21, 2009 11:13 AM

Yes, all CSS code that needs to have the selectors and brackets should go into CSS Inserts

CSS Inserts is the place for CSS where no other text area is available anywhere in the theme options


All times are GMT -6. The time now is 06:34 PM.

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