Under the normal circumstances, it takes some time to change the font attributes (including font family, color, and size of text) of a page by defining all the places where you want the font to occur. Occasionally, you may want special pages different from other pages in that the font is different. This may be useful on personal blogs or themed pages. With this handy dandy CSI, all it takes is a small amount of typing to change the font of a single page!
Include files
Font | By Timothy Foster | 21 Dec 2009 17:43 |
Font Backend | By Timothy Foster | 21 Dec 2009 17:39 |
Instructions
To use this, simply define the following onto the page of interest:
[[include :css-competition:include:font
|font=
|color=
|size=
]]
Now let's say you want the text to have a font of Comic Sans MS, a color of red, and it is slightly larger than usual. Simply, put the "Comic Sans MS" in the font area, put the "red" in the color area, and put a "120%" in the size area. You end up with this:
[[include :css-competition:include:font
|font=Comic Sans MS
|color=red
|size=120%
]]
And suddenly, all of the content of the page uses this styling!
But wait, there is more!
This only defines the main content of the page, but what if you want the side bar, top bar, footer, or headings to have the same styling? Or, what if you don't want the main content to have the styling, but the side bar should? Simply, there are some interesting commands you can tell the application so that this happens.
If you want a specific part to have the styling, simply put the word "TRUE" after the qualifier. The qualifiers include:
Qualifier | Corresponding Part |
---|---|
|side= | Activates the Side bar |
|top= | Activates the Top Bar |
|footer= | Activates the Footer |
|headings= | Activates the headings |
To turn off the main content, use "|main=OFF" to turn it off.
For a page that has the main content, its headings, and the side bar activated with the same styling mentioned above, this code would be used:
[[include :css-competition:include:font
|font=Comic Sans MS
|color=red
|size=120%
|headings=TRUE
|side=TRUE
]]
By the way, you don't have to define all three of the attributes. If you want one of the styling attributes (family, color, and size) to remain default, then leave that part blank.
If you want to add your own extra styling, you can use the |extra= variable to put additional CSS onto the page of interest.
Notes
If you use this CSI on a side bar, then every page with that side bar will contain the specified styling.
It is redundant to use |main=TRUE, and it will act the same as |main=OFF. It is simply better that if you want the main content to be styled to not define the |main variable at all.
Example
This page is using this code:
[[include :css-competition:include:font
|font=Book Antiqua
|headings=TRUE
|size=120%
]]
And this page is yet another example exposing the use of the |extra= variable.
I wanted to rate this page up but it has been disabled. Sorry Timothy.
gerdami - Visit Handbook en Français - Rate this howto:import-simple-excel-tables-into-wikidot up!
Not disabled, just not enabled… I've done that now.
Portfolio
I tested your page in the sandbox… it's a nice idea but I saw that the headers kept their original color… maybe you can give them the same color but to realy make them stick off give them a background in grey = no color so it matches every color. I'll give it a go http://sandbox.wikidot.com/mynewfontmodule2 Or something with transparency http://sandbox.wikidot.com/mynewfontmodule3 -no that did not work- Maybe just add in your attributes a "heading-color=#yourcolor"
A - S I M P L E - P L A N by ARTiZEN a startingpoint for simple wikidot solutions.