GoVegan 04 Feb 2012 08:18
Something that's slightly annoying about Wikidot is that when it comes to creating new pages that previously didn't exist, the Live Template isn't taken into account. That is, if you use the CSS module in the Live Template, then that isn't applied to the page until after you save the page. All proceeding edits work fine, but the initial edit doesn't look how it's supposed to.
But of course, they don't call me a Wikidot Super-Guru for nothing! Read on to see how it's done properly.
There are two useful tools that appear when we create new pages: the top and sidebar navigators. Whatever code you place in these two pages, it will appear on every page that utilises those particular navigators. Generally speaking, these navigators are usually global for the site on most wikis (however they can be customised on a per-category basis).
For our exercise today, we are going to focus on the sidebar navigator (usually located on the /nav:side page).
Step 1: Create your per-category CSS pages
Let's assume the category "survey". We are going to create a hidden page called /survey:_css for us to store our CSS module on. Place your CSS module on this page like so:
[[module CSS]]
a {color: #FFF !important;}
[[/module]]This line of CSS code will ensure all links appear in the colour "white".
Step 2: Inject James' Brilliant Code
Navigate to your sidebar navigator page and place the following code at the bottom:
[[include :snippets:category-css]]This Wikidot code will extract the source from the :_css page on a per-category basis. If no such page exists, nothing happens!
If you happen to have no sidebar navigator on your Wikidot site, I suggest that you:
- Re-enable the sidebar from your /admin:manage page;
- Go to the sidebar page (usually it's the /nav:side page);
- Paste the following code at the top of the sidebar's source code to "remove" the sidebar:
[[module CSS show="true"]]
#side-bar {display: none;}
[[/module]]Step 3: You're done! Check it out!
That's right, there is no Step 3! You can now create new pages with per-category customised CSS now!!!
No more messing around with the site's global CSS!
λ James Kanjo
Source
As taken from my blog post Wikidot: CSS Per Category
Cool stuff. This reminds me one of ideas we had back in Wikidot: to delete lots of configuration from the admin panel in favour of some magic pages in categories, like category:_css (or category:_style) for custom category styles (category:_side, category:_top for nav bars, stuff like category:_permissions for permissions and so on).
Piotr Gabryjeluk
visit my blog