Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

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

Overlapping Logo/Image Header?


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
  #1  
Old Oct 24, 2010, 11:17 PM
chrswbrwn
 
1 posts · Oct 2010
Hi,
I'm trying to make a small (maybe about 300px x 300px) square or round logo/image overlap in the coner between the header and the side bar.

I found something similar to what I am looking to do on this theme:
http://wordpress.org/extend/themes/travelogue

Like how the polaroid pictures in the above link overlap the header and side bar. But I want to use my own image and customize it the way I want.

Basically is it possible to make a header image overlap the top bar and hang into the stuff below? Maybe some code to move the image down beyond the rectangular bounds?

I'm not super savvy with CSS, but I can figure out how to cut and paste and use trial an error if any one can direct me on how to edit the header image in this way.

I just installed Atahualpa 3.5.3 if that matters.

Thanks!
  #2  
Old Oct 25, 2010, 09:55 AM
lmilesw's Avatar
lmilesw
 
10,097 posts · Jul 2009
Central New York State USA
You could use absolute positioning for something like that. Here is the area at w3schools.com where you can try it out.
__________________
~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.
  #3  
Old Oct 28, 2010, 12:37 PM
everybodylies
 
17 posts · Oct 2010
I'm in the process of moving my blog to Wordpress, using this theme (awesome) and I'm trying to mimic my design at http://iloveto.blogg.se/

This is my blog using the Atahualpha353 theme:
http://iloveto.se/

1. I initially tried to get my little "visit stats" box onto the header by using css positioning, BUT it would change position when zooming out or opening the browser bookmarks sidebar.

2. I decided to create a new widget area and put the visit stats stuff in there as "text". The problem is it would only go above or below the header, creating a big white space. I couldn't get the overlapping effect that I wanted.

3. I went back to go with step 1 again. And this is where I'm stuck.

Can anybody please give me some insight, ideas??
  #4  
Old Oct 29, 2010, 02:29 AM
everybodylies
 
17 posts · Oct 2010
I put all those in "HTML Inserts: Body Top", and the CSS in "CSS Inserts".

All of them are absolute positioned, floating, and using top/left/right. No margins.

I'm looking for a way to lock their position relatively to the header or so to say.


WP Likes is under Edit POST/PAGE INFO ITEMS in the Footer section.
It's customised in the Plugins panel.

I'm using WP version 3.0.1
  #5  
Old Oct 29, 2010, 07:22 AM
lmilesw's Avatar
lmilesw
 
10,097 posts · Jul 2009
Central New York State USA
Have you tried putting the code for the blog designs or search boxes in the same box with %pages and using negative and positive margins for positioning? This is only a guess as I haven't tested.
__________________
~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.

Last edited by lmilesw; Oct 30, 2010 at 08:17 PM.
  #6  
Old Oct 30, 2010, 03:24 PM
everybodylies
 
17 posts · Oct 2010
Thanks for suggesting that
I didn't use %pages%, but %logo%, because I found it to be easier to tamper with.
I actually cut the header image in 3 and used the pieces as widget backgrounds. The top part is the header (chopped off a lot), the middle is a widget I created which shows the visit stats, and the bottom one is %logo% with only the search field.

I've still got that design thingy on the far right hanging loose... but I'm thinking about removing it.

Bookmarks

Tags
header, image, logo, overlap, overlay

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Can I make the logo image overlaid on the header image? essdeeay Header configuration & styling 1 Jun 16, 2010 05:23 PM
header image as background image for logo area soni Atahualpa 3 Wordpress theme 8 Apr 2, 2010 03:05 AM
If I Leave The Logo Image Field Blank, It Displays Broken Image Icon in Header psaltriparus Header configuration & styling 1 Oct 20, 2009 09:30 AM
[SOLVED] why insert image into image header in place to the blogtitle (like a logo) ? gilles Header configuration & styling 1 Sep 5, 2009 04:14 AM


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


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