Might be a simple question.

summary:

Modifying the text contents of #extra-div in the header.

Might be a simple question.

AoiMasamune 1209363895|%e %b %Y, %H:%M %Z|agohover

A friend of mine is a graphics designer and she decided she wanted to play with my CSS theme a bit after seeing what I had come up with. Well she drafted a really neat design that totally blew me away. I'm really excited about implementing it. Theres a catch though. (Isn't there always?)

Part of the design she put together has something similiar to breadcrumbs at the very top of the page, above the logo and login status div. So my question is, how in the world would I pull that off?

I was thinking about doing some complicated hack involving using #header-extra-div2 and the :content tag, which would contain the breadcrumbs since I can't actively edit divs in the header.

The easier way would be to define a div in the sidebar and place it with position:absolute; and building the rest of the theme around it by manipulating the margins of the rest of the elements in the header and somehow using include to get the contents up there to seem dynamic, but still can't ponder out exactly how I would do it.

So the easiest way I can think of would be to just leave a big empty gap at the top where the breadcrumbs element would go, and creating the div to put up there on each of the pages that would use it. Which is very not-elegant. Even if I predefine the class for the div.

Am I missing something obvious here? I hope so.

Re: Might be a simple question.

Stephen Kay 1209409819|%e %b %Y, %H:%M %Z|agohover

Good question, I'm sorry I cannot solve it for you, but I am interested in the answer myself. I would like to insert my own top menu bar, generated separately, for example (perhaps using flash) - and insert it in the same place the other one normally is, at the top of each page in the header.

Re: Might be a simple question.

AoiMasamune 1209415606|%e %b %Y, %H:%M %Z|agohover

Oh I got it. In case anyone else is wondering, you can define a div in the sidebar or page content, and position it with position:absolute; and put it wherever you want. Combine that with a predefined class and it works just fine.

Example:

Wiki Code -

[[div class="randomclass"]]
[[[link-to-somewhere | Somewhere]]] > [[[link-to-somewhere-else | Somewhere Else]]]
[[/div]]

CSS -

.randomclass{
   position:absolute;
   top: 0px;
   left: 0px;
   z-index:150; /*make sure it's visible above everything else*/
   color:#000;
   background-color:#fff;
   border-bottom:1px solid silver;
}

That worked for me.

last edited on 1209416629|%e %b %Y, %H:%M %Z|agohover by AoiMasamune + show more

Re: Might be a simple question.

Stephen Kay 1209490526|%e %b %Y, %H:%M %Z|agohover

I see - thanks, but I guess you're not actually including some other external content that way…

Re: Might be a simple question.

AoiMasamune 1209500903|%e %b %Y, %H:%M %Z|agohover

It seems to me the technique could be easily adapted to play an .Swf file or some other type of media using iframe or embed.

last edited on 1209501028|%e %b %Y, %H:%M %Z|agohover by AoiMasamune + show more

Re: Might be a simple question.

Craig Macomber 1209418263|%e %b %Y, %H:%M %Z|agohover

As far as bread crumbs, you can use page parenthood to have them generated automatically. This system is used for the how to pages. Take a look at the top of a random how to page: using-ratings

Just set the page's parent. (It is set through the options button in the lower right)