I like your new (to v2.x) negative margin trick to change the source order of navigation. I successfully used the same trick to create a Leaderboard region, in source order at the bottom but positioned at the very top.

But how do I add another "featured" region above #content and sidebars? I've tried a few things but each time navigation remains positioned below the "featured" region, which I don't want (otherwise I would just use the existing header region of course).

Any ideas?



no longer here 133581’s picture

Status: Active » Needs review

You need to do few little things to achieve this with this method :

1/ PLace your 'featured' regions right after the navigation region
2/ Apply exactly the same style as navigation to the feature region :

#navigation, #content-top {                        
  float: left;                       
  margin-left: 0;
  margin-right: -100%;
  padding: 0;
  width: 100%;

3/ Add some margin top to the feature region, and add this value to the margin top of the content and sidebars.

Makes sense ?

glennr’s picture

That makes perfect sense and it works well, thanks.

Just a couple of small problems: Because of the type of content that will go into it, I would have preferred for the 'featured' region to be higher in the source order. And the region isn't collapsible.

However, as it's only likely to be used on certain pages, eg the front page, I can always just include the region in those page templates only.

Or I could just push the new region and the navigation back up the top in the source order. Not ideal but not a huge problem.

Thanks for your help.

no longer here 133581’s picture

Assigned: Unassigned »
Status: Needs review » Fixed

Regarding the source order, I'm fairly confident that you could place this anywhere in your page template and have it show at the same spot. floating everything leaves you with some flexibility.
Have faith in CSS, there's always a way :)
Happy I could help !

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

hga77’s picture

I have the same issue as couzinhub. The solution here makes sence and works. However, since we are hard-coding the top-margin of the content/sidebars, we are assuming that the height of 'navi' + 'feature' is always the same.

What if the 'feature' region has varied height? How do we tell the content and sidebars to always drop under nav/feature regardless of thier height?

no longer here 133581’s picture

Well in that case, you might have to bring the navigation up.

hga77’s picture

I thought so...

duntuk’s picture

Title: Navigation Bar Position » Positioning a new region above #content and sidebars?
Status: Needs work » Closed (fixed)

That's the problem with zen using content above nav...

SEO speaking this really doesn't make any difference anymore (it may have a few years ago) as long as your html uses proper semantic markup and structure... e.g.

<div id="header"></div>
<div id="nav"></div>
<div id="content"></div>
<div id="sidebar-first"></div>
<div id="sidebar-last"></div>

This is where HTML5 is headed, and Google loves HTML5.

Google algorithm is smart enough to know the difference between 'content' (or 'article') and 'nav' ... it's ridiculously advanced and constantly getting better... Plus if you're still not convinced that google can't tell the difference, then check out the source code of any top SEO sites, or highest ranked sites, and see how they are structured. You'll probably get no penalty for now, but you most likely will not get any benefit either--just headaches trying to use this inflexible css formatting.

no longer here 133581’s picture

Title: Positioning a new region above #content and sidebars? » Navigation Bar Position
Status: Closed (fixed) » Needs work

There you go, I didn't need much more to be convinced to remove this from BASIC. It was just getting too complicated anyway.
Thanks for the inspiration @duntuk. Not sure if I should roll this into a BASIC 3 or stick it into BASIC 2..

hga77’s picture

Thanks duntuk that makes perfect sence.

I've tweaked Zen to do just that, header, nav then content... All the minus margins and adding/subtracting element widths is plain overkill for what its worth.

duntuk’s picture

Title: Positioning a new region above #content and sidebars? » Navigation Bar Position
Status: Closed (fixed) » Needs work

Happy to be of assistance. And... I see no reason not to use proper semantic structure on Basic 2 as well as Basic 3.

damiankloip’s picture

Have started work to use 'normal' markup order and remove the negative margins on the 3.x-dev branch.

CatherineOmega’s picture

Status: Needs work » Closed (fixed)

This is no longer applicable to 7.x-3.x with Bourbon and so on. (Yay, Google engine improvements!)