Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Header configuration & styling »

overlay login boxes in header's logo area


  #1  
Old May 6, 2013, 10:42 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Hi guys..!

Could you please tell me how to overlay login boxes in header's logo area? I think It's positioning with CSS but where and how?

This is my website's URL: http://mlearning.mdsinsure.com/

Thank you
  #2  
Old May 6, 2013, 11:09 AM
juggledad's Avatar
juggledad
 
23,553 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
learn how to use Firebug in firefox, then you can examine the area involved and play with CSS to move it. I'd play with the 'position', 'top' and 'right' css rules.
  #3  
Old May 6, 2013, 11:53 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Ok, what I did was:

ATO --> Add CSS inserts:

div#wplb_wrap { position: relative; top: 40px; ;
}

and it seems to work although now there's a blank space at the top..I mean that's the background so seems that all website should closer to the top, right??
  #4  
Old May 6, 2013, 12:33 PM
juggledad's Avatar
juggledad
 
23,553 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
this is what happens when you start playing. How did that code get there in the first place?
why not add the code for those fields into the 'Configure header Area' option and style them from there.
  #5  
Old May 7, 2013, 03:52 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
well I found this piece of code using Firebug! Anyways, now I added the code into the 'Configure header Area' as you mentioned, it's looking better now but I still don't know how to overlap login boxes
  #6  
Old May 7, 2013, 06:56 AM
juggledad's Avatar
juggledad
 
23,553 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
It doesn't look like you added the HTML that makes the login section to the 'Configure Header Area' option
  #7  
Old May 7, 2013, 08:31 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Well I'm using a plugin.. WP login Box..and on its installation steps says to add this code: if(function_exists('wplb_login')) wplb_login(); so I added it to header.php file...do I have to add anything else??? Sorry!
  #8  
Old May 7, 2013, 12:06 PM
juggledad's Avatar
juggledad
 
23,553 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
That plugin is adding HTML outside of the header area which is why it makes it difficult to position it the way you want. You are going to have to play with positioning (absolute and relative) for it and see what you can come up with.

Have ou contacted the plugin author for guidance?

Last edited by juggledad; May 8, 2013 at 05:20 AM.
  #9  
Old May 8, 2013, 03:56 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Yes, I did! But till now no answer I'll try to google for it... Thank you! if I find anything, I'll post here!
  #10  
Old May 8, 2013, 10:48 AM
lmilesw's Avatar
lmilesw
 
10,173 posts · Jul 2009
Central New York State USA
Another option is to add a new widget area and then use a php aware widget to add your code.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #11  
Old May 10, 2013, 09:36 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Hi guys!

Atahualpa design is in tables which means I can't post the code '<?php if (function_exists ('wplb_login')) { wplb_login(); } ?>' in a div, so need to post it in the correct table row inside a td tag.

I've tried to add it in different places/files/etc...and tried use different margins/paddings/etc..still doesn't work!

I want to position login boxes at the top of the header, above search box, right aligned. Can you please help and tell me the right place to add this code?
  #12  
Old May 10, 2013, 09:57 AM
lmilesw's Avatar
lmilesw
 
10,173 posts · Jul 2009
Central New York State USA
See post #10
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #13  
Old May 10, 2013, 10:35 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
I inted to try to but there's something weird...I added in ATO --> style & edit header area --> 2 new widget areas but then I deleted one of them...but it still shows up in widgets??? Is this possible? How can I entirely delete it?
  #14  
Old May 10, 2013, 12:27 PM
lmilesw's Avatar
lmilesw
 
10,173 posts · Jul 2009
Central New York State USA
You have to delete the code and then delete the widget areas in the Add New Widget Areas section.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #15  
Old May 13, 2013, 03:32 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
lmilesw, I know! That's what I did... but widgets still there...or its boxes for it because if I add something to them, nothing happens! This is weird! Nevertheless, If you could just give a hint if there's a better place to put the login code instead of header.php...
  #16  
Old May 13, 2013, 06:06 AM
juggledad's Avatar
juggledad
 
23,553 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
to delete a new widget area
1) go to appearances->widgets and remove any widgets from your 'new' widget area
2) remove the 'new' widget agea code you added
3) view teh home page
4) go to ato->new widget area and check off the widget area you want to delete and press the delete button
5) go back and view the home page.

at this point it should be gone. If you still see it in ato->new widget area try going to posts and back to teh 'new widget azrea to refresh the browser cache.
  #17  
Old May 13, 2013, 06:23 AM
juggledad's Avatar
juggledad
 
23,553 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
easiest way to do this:
1) add a new widget area as last parameter to ato->Style & edit HEADER AREA->Configure Header Area
HTML Code:
<?php bfa_widget_area('name=Login widget'); ?>
2) view home page
3) go to dashboard->Apperances->Widgets
4) add a text widget to the new widget area 'Login widget'
5) add your login/out code to the widget area like
HTML Code:
<?php wp_loginout(  ); ?> 
6) go to ato->Add HTML/CSS Inserts->CSS Inserts and position the login area with omething like this
HTML Code:
#login_widget {position: absolute; top: 50px; right: 50px;}
you will have to play with the numbers.
  #18  
Old May 13, 2013, 08:41 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Quote:
Originally Posted by juggledad
to delete a new widget area
1) go to appearances->widgets and remove any widgets from your 'new' widget area
2) remove the 'new' widget agea code you added
3) view teh home page
4) go to ato->new widget area and check off the widget area you want to delete and press the delete button
5) go back and view the home page.

at this point it should be gone. If you still see it in ato->new widget area try going to posts and back to teh 'new widget azrea to refresh the browser cache.
Solved!! Old widgets definitively deleted Thank you juggledad!
  #19  
Old May 13, 2013, 08:44 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Quote:
Originally Posted by juggledad
to delete a new widget area
1) go to appearances->widgets and remove any widgets from your 'new' widget area
2) remove the 'new' widget agea code you added
3) view teh home page
4) go to ato->new widget area and check off the widget area you want to delete and press the delete button
5) go back and view the home page.

at this point it should be gone. If you still see it in ato->new widget area try going to posts and back to teh 'new widget azrea to refresh the browser cache.
Quote:
Originally Posted by juggledad
easiest way to do this:
1) add a new widget area as last parameter to ato->Style & edit HEADER AREA->Configure Header Area
HTML Code:
<?php bfa_widget_area('name=Login widget'); ?>
2) view home page
3) go to dashboard->Apperances->Widgets
4) add a text widget to the new widget area 'Login widget'
5) add your login/out code to the widget area like
HTML Code:
<?php wp_loginout(  ); ?> 
6) go to ato->Add HTML/CSS Inserts->CSS Inserts and position the login area with omething like this
HTML Code:
#login_widget {position: absolute; top: 50px; right: 50px;}
you will have to play with the numbers.
Tried this but nothing happened! Also added z-index property but still didn't work. When inspecting with Firebug, text widget is there... any ideas? Thank you once again!
  #20  
Old May 13, 2013, 08:49 AM
juggledad's Avatar
juggledad
 
23,553 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
ummmmm check your css against the css I gave you - also you might want to put some text in the widget to see where it shows.
  #21  
Old May 13, 2013, 11:01 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Hi again!
I gave up on this plugin.. I wasn't able to solve it...so I'll be using WP Sliding Login.

thank you for all your time

Bookmarks

Tags
boxes, css, login, overlay, positioning

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] How can I add div boxes to areas other than the posts/pages content area? tsheridan Atahualpa 3 Wordpress theme 7 Feb 22, 2012 07:27 AM
How to make logo area on beside or overlay header image? phuongnv Header configuration & styling 16 Mar 17, 2011 07:09 PM
creating 2 separate boxes in header, for logo and nextgen slideshow gallery rinoa3108 Header configuration & styling 8 Mar 8, 2010 06:19 PM
Putting a image background in the header's logo area kirinafa Header configuration & styling 2 Feb 18, 2009 05:08 PM


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


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