Moving the "page-info" content alongside the sidebar

Summary:

Problem when trying to use a custom theme to put the page-info content (edit buttons, etc.) under the main content, and not under both main and and sidebar

Moving the "page-info" content alongside the sidebar

Kynan 09 Aug 2009 17:41

I have a lot of short pages, but a lot of tags, making the sidebar longer than a screen, generally. So, I thought to make tags and the action buttons go directly under the main content, no matter how short it may be. Having to scroll to get to this is a pain, and it really devalues the information provided by the tags.

For the tags, it was simply changing "clear: none" in the .page-tags class css. However, I couldn't get that to work for #page-info. Looking at the source for a rendered page, I can see why. In between the <div>s for these two, there is an explicit: "<div style="clear:both; height:1px; font-size:1px;"></div>".

I'm not sure why it's done this way, as it gets in the way of what themes can do. At least, if this "break" was done with a class or an id, then it could be overridden by a theme designer.

Re: Moving the "page-info" content alongside the sidebar

pieterh 09 Aug 2009 18:22

Please provide a link to a site that shows the problem.

I'd suggest putting the tag cloud under the content using a template, but without examples it's just a guess.

---

Portfolio

Re: Moving the "page-info" content alongside the sidebar

Kynan 09 Aug 2009 20:57

Unfortunately, the wikis I've tried this on are all private. However, the offending <div> is seen in any one. For example, go to "http://community.wikidot.com/help:start", and then examine the page source. Look for '<div id="page-info"' and two lines above it you will see the <div style="clear:both; height:1px; font-size:1px;"></div>".

And, I don't want the tag cloud under the content, and I don't want to use templates. I like it where it is. I just want the buttons to not go under the sidebar.

Last edited on 09 Aug 2009 20:57 by Kynan + Show more

Re: Moving the "page-info" content alongside the sidebar

pieterh 09 Aug 2009 21:03

Sorry, without an example of the problem you're describing, it's impossible to judge whether there is another workaround except changing the div. I'll log a change request but you won't get help from other people here unless you can point them to a public site. You might want to make one to demonstrate the problem.

---

Portfolio

Re: Moving the "page-info" content alongside the sidebar

Kynan 10 Aug 2009 00:09

OK, here you go.

Re: Moving the "page-info" content alongside the sidebar

meagain 10 Aug 2009 00:50

i have a horrible feeling that what you are trying to do can't be done.
If it can, its eluded me, so far. (but i only know how to butcher)

i have seen a number of wikidot wikis where the bottom buttons have been directly under, or even above the page content, but thjis has always been done using the user placeable buttons.

eg
[[button source]][[button print ]][[button edit-sections]][[button edit-append]][[button files]][[button history]][[button tags]][[button backlinks]]
(these are the only ones (that i know of) that are available to you)

but that would require either a _template to get them on every new page. which you say you don't want to do.

Re: Moving the "page-info" content alongside the sidebar

pieterh 10 Aug 2009 00:52

So, whatever problems you might find in the CSS, learn to use dynamic templates. It really does make your sites a lot more fun. In this case, since you have tiny pages and huge tag clouds, you could use a template like this:

%%content%%
[[module TagCloud ..etc.]]

In many of my sites I use a 2-column layout built with a template, eg.

[[div style="float:left; width:48%"]]
%%content%%
[[/div]]
[[div style="float:right; width:48%"]]
[[module TagCloud ..etc.]]
[[/div]]

You could also just increase the sidebar width.

I suspect any of these will give you more satisfaction than waiting for a CSS change.

---

Portfolio

Re: Moving the "page-info" content alongside the sidebar

James Kanjo 10 Aug 2009 09:30

Pieter, I think you misunderstood the problem here.

This is how EVERY Wikidot page is structured (hover or click to enlarge):

Kynan HAS MANAGED with CSS to prevent the tags from being “pushed” below the side-bar:

Kynan WOULD LIKE to use CSS to make the #page-info behave like so:

Kynan has found in EVERY Wikidot rendered page the following code:

<div class="page-tags">
                            <span>
                                page tags:
                                                                    <a href="/system:page-tags/tag/1111#pages">1111</a>
                                                                    <a href="/system:page-tags/tag/2222#pages">2222</a>
                                                            </span>
                        </div>
 
                    <!-- google_ad_section_end -->
 
                    <!-- google_ad_section_start(weight=ignore) -->
 
                    <div style="clear:both; height:1px; font-size:1px;"></div>
                                                                    <div id="page-info">page_revision:

Kynan HAS NOTICED that the following code forces the #page-info to be pushed below the sidebar: <div style="clear:both; height:1px; font-size:1px;"></div>.

Kynan HAS SUGGESTED that if this code were given a CLASS or ID, one can use custom CSS to stop this automatic page break from occuring: <div id="page-info-break" style="clear:both; height:1px; font-size:1px;"></div>.

#page-info-break {clear: none;}

---

Do you understand now, what the problem is? I agree with him, there should be a class or id to customise this. This is something in the static page-layout of Wikidot pages, and can be changed with ease without affecting any wikis.

---

λ James Kanjo
_{Blog | Wikidot Expert | λ and Proud
Web Developer | HTML | CSS | JavaScript}

Re: Moving the "page-info" content alongside the sidebar

pieterh 10 Aug 2009 09:40

Ah, James, thank you. Words like "tags go directly under main content" don't mean a lot unless one is actually looking at the picture.

Sure… like I said, I'd put up an issue for this. If there's no workaround, Kynan will have to wait.

---

Portfolio

Re: Moving the "page-info" content alongside the sidebar

James Kanjo 10 Aug 2009 10:43

Did you like the image hover thing?

I discovered that trick here, it's really not that hard!

---

λ James Kanjo
_{Blog | Wikidot Expert | λ and Proud
Web Developer | HTML | CSS | JavaScript}

Re: Moving the "page-info" content alongside the sidebar

meagain 10 Aug 2009 08:51

DOH! DOH DOH!
of course this can be done! I've done it!! (only i had forgot)
I got the idea from james, who i think got the idea from squark.

you cant do it whilst the side bar is in the #main content (afaik)
but you can take the side bar OUT of the main content.
or stick it on the other side

Last edited on 13 Oct 2009 15:08 by Phil Chett + Show more

Re: Moving the "page-info" content alongside the sidebar

James Kanjo 10 Aug 2009 10:46

Ahh, that's a clever workaround!

---

λ James Kanjo
_{Blog | Wikidot Expert | λ and Proud
Web Developer | HTML | CSS | JavaScript}

Re: Moving the "page-info" content alongside the sidebar

pieterh 13 Oct 2009 11:59

OK, this issue has finally been fixed.

---

Portfolio