Difference: NatSkinConfiguration (r3 vs. r2)

NatSkinConfiguration

Theme configuration

The different NatSkinstyles (themes) are controlled using preference variables and can be set

Use the NatSkinStyleBrowserto preview the known styles and settings. Note, Note that the selection made there will only last for the current session. You need to add the respective preference variables to your home topic or the WebPreferences or the SitePreferences to make the selection persistent.

This is the list of variables to configure the skin style:

Name
(url param)
ValuesDescriptionDefault
SKINSTYLE NATSKIN_STYLE (style) %KNOWNSTYLES% select a predefined style Clean jazzynote
STYLEVARIATION (stylevariation) NATSKIN_VARIATION (skinvariation) %KNOWNVARIATIONS% select a style variation none
STYLEBORDER (styleborder) NATSKIN_LAYOUT (skinlayout) on, off, thin fixed, fluid, bordered change select the border decoration; thin enables a blog-like page layout off fixed
STYLEBUTTONS (stylebuttons) NATSKIN_MENU (skinmenu) on, off switch on/of the tab buttons horizontal menu above the topic area off on
STYLESIDEBAR (stylesidebar) NATSKIN_SIDEBAR (skinsidebar) left, right, both, off configure where to display the sidebar is to be displayed left right

There are a couple of special url parameters:

  • togglesidebar: disable the sidebar for this request only.
  • style=off: switch off any styles (simulating a non-css browser)
  • style=reset: switch back to the user and server settings by reverting any session preferences
  • switchstyle=next/prev: switch to the next/previous known style
  • switchvariation=next/prev: switch to the next/previous known style variation

Example: To emulate the Kubrick style on the old BinaryBonsai (not the new K2 style) use

* Set SKINSTYLE NATSKIN_STYLE = Kubrick jazzynote * Set STYLEBORDER NATSKIN_LAYOUT = thin fixed * Set STYLEBUTTONS NATSKIN_MENU = on * Set STYLESIDEBAR NATSKIN_SIDEBAR = right * Set STYLEVARIATION NATSKIN_VARIATAION = none red * Set STYLESEARCHBOX = pos1 

There are some constraints build into the NatSkin templates that try guarantee a pleasant appearance when combining the different skin states:

Preference variables

  • If the styleborder is "thin" the sidebar will be disabled for the edit, manage, rdiff, natsearch, changes and search topic actions.
  • The web buttons will alternate with the sidebar so that they will not be displayed on the same side.
  • If the web buttons are enabled the default SiteSideBar will disable the redundant navigation to other webs.

Defining new Themes

The NatSkin can be themed using cascading styles attached to the System.NatSkin or any other topic defined in the STYLEPATH preference variable. This variable is a list of topics that are consulted for css attachments. The default value is

  * Set STYLEPATH = %SYSTEMWEB%.NatSkin

Styles are collected in the order specified. This allows to insert style contributions that are not part of the NatSkin. For example given you uploaded NatSkin css definitions to a topic Main.NatSkinThemesContrib you can activate them by setting the STYLEPATH to

  * Set STYLEPATH = Main.NatSkinThemesContrib, %SYSTEMWEB%.NatSkin

Css files must obey the following naming scheme to be recognized

  • Style.css: basic style definitions for style
  • Buttons.css: WebButton definitions for style
  • Border.css: definitions for style displayed using STYLEBORDER = on
  • Thin.css: definitions for style displayed using STYLEBORDER = thin
  • Thin.css: definitions for style displayed using STYLEBORDER = thin
  • Variation.css: style variations that can be applied to any base style; this can be used to vary a base style, e.g. to add header art or change some fonts and colours

Email Obfuscation

The standard Foswiki engine tries to obfuscate email addresses by adding a phrase to the email url (like NOSPAM) to fool collecting web crawlers. But that is not adequate enough today as crawlers are aware of that. The solution to that is to remove every trace of a pattern that could be an email address from the html source code and regenerate them using javascript. Most likely, web crawlers will only parse the html and don't run a javascript interpreter beforehand. Nevertheless the obfuscation feature can be switched on and off by adding the OBFUSCATEEMAIL variable to your DefaultPreferences or SitePreferences like

  * Set OBFUSCATEEMAIL = on

Misc preference variables

There is a set of variables that can be used influence how NatSkin behaves or renders pages.

NameDescription
HTMLTITLE CONTENT_LANGUAGE the ...</span> <span class="craCompareChange2">language</span> of the <span class="craCompareChange1">html page; if</span> <span class="craCompareChange2">current topic; this</span> <span class="craCompareDelete">no HTMLTITLE</span> is <span class="craCompareChange1">defined</span> <span class="craCompareChange2">used</span> <span class="craCompareAdd">by search engines like SolrPlugin to run different stemming procedures while indexing</span> the <span class="craCompareAdd">topic (defaults to auto-detect)</span> <a class="craCompareDelete" href="/foswiki/bin/view/System/NatSkin">NatSkin</a><span class="craCompareDelete"> will check for some formfields (Headlines, TopicDescription) to be used as a html page title and back off to the topic name </span></td></tr><tr class="craCompareAdd"><td class="craCompareAdd"><code class="craCompareAdd">HTMLTITLE</code></td><td class="craCompareAdd"> the <title>... of the html page; if no HTMLTITLE is defined the <a class="craCompareAdd" href="/foswiki/bin/view/System/NatSkin">NatSkin</a> will check for some formfields (Headlines, TopicDescription) to be used as a html page title and back off to the topic name </td></tr><tr class="craCompareAdd"><td class="craCompareAdd"><code class="craCompareAdd">HTMLTITLESEP</code></td><td class="craCompareAdd"> the separator of items in the HTMLTITLE (defaults to a dash ('-')) </td></tr><tr class="foswikiTableOdd foswikiTableRowdataBgSorted1 foswikiTableRowdataBg1"><td class="foswikiTableCol0 foswikiFirstCol"><code>METAAUTHOR</code></td><td class="foswikiTableCol1 foswikiLastCol"> the value of this variable will be used to construct <meta name="author" ... /> in the html head </td></tr><tr class="foswikiTableEven foswikiTableRowdataBgSorted0 foswikiTableRowdataBg0"><td class="foswikiTableCol0 foswikiFirstCol"><code>METADESCRIPTION</code></td><td class="foswikiTableCol1 foswikiLastCol"> the value of this variable will be used to construct <meta name="description" ... /> in the html head </td></tr><tr class="foswikiTableOdd foswikiTableRowdataBgSorted1 foswikiTableRowdataBg1"><td class="foswikiTableCol0 foswikiFirstCol"><code>METAKEYWORDS</code></td><td class="foswikiTableCol1 foswikiLastCol"> the value of this variable will be used to construct <meta name="keywords" ... /> in the html head </td></tr><tr class="foswikiTableEven foswikiTableRowdataBgSorted0 foswikiTableRowdataBg0"><td class="foswikiTableCol0 foswikiFirstCol foswikiLast"><code><span class="craCompareChange1">WHITEBOARD</span> <span class="craCompareChange2">TOPICTITLE</span> </code></td><td class="foswikiTableCol1 foswikiLastCol foswikiLast"><span class="craCompareDelete">possible values: on, off; if WHITEBOARD is set to only</span> the <span class="craCompareChange1">topic form</span> <span class="craCompareChange2">title to</span> <span class="craCompareDelete">will</span> be <span class="craCompareChange1">edited when clicking on "Edit"; note,</span> <span class="craCompareChange2">used displaying a WikiWord link to</span> <span class="craCompareDelete">that</span> the <span class="craCompareChange1">textarea is</span> <span class="craCompareChange2">current page;</span> <span class="craCompareDelete">still accessible and not hidden completely;</span> this is <span class="craCompareChange1">flag is only there</span> <span class="craCompareChange2">set automatically using NatEditPlugin</span> <span class="craCompareDelete">for convenience</span> </td></tr></tbody></table></div> <p> Hint: Assign default meta data <em>per web</em> by adding </p> <pre> * Set DEFAULT_METAKEYWORDS = keyword1, keyword2, keyword3 * Set METAKEYWORDS = %DEFAULT_METAKEYWORDS% </pre> <p> to the <a href="/foswiki/bin/view/System/WebPreferences">WebPreferences</a> and add extra keyword data <em>per topic</em> like this </p> <pre> * Set METAKEYWORDS = %DEFAULT_METAKEYWORDS%, keyword4, keyword5, keyword6 </pre> <p> Caution: don't add meta data to your <a href="/foswiki/bin/view/Main/WikiGuest">home topic</a> because it will override all other meta data preferences. </p> <div class="craInterweaveDiff"><p class="craCompareDelete"> -- <a class="craCompareDelete" href="http://foswiki.org/Main.MichaelDaum" title="'Main.MichaelDaum' on foswiki.org">Foswiki:Main.MichaelDaum</a> - 25 Aug 2006 </p></div> </div> <p /> <div class="foswikiFormSteps"><a name="topic-actions"></a><div class="patternTopicActions foswikiFormStep"><span class="patternActionButtons"><span><a href='https://nkwiki.de/foswiki/bin/view/System/NatSkinConfiguration' rel='nofollow' title='View topic' accesskey='v'><span class='foswikiAccessKey'>V</span>iew topic</a></span><span class='foswikiSeparator'> | </span>View difference <span><a href='/foswiki/bin/compare/System/NatSkinConfiguration?rev1=2&rev2=3&render=sidebyside&context=&skin=' rel='nofollow' title='Side by side' accesskey='s'><span class='foswikiAccessKey'>s</span>ide by side</a></span><span class='foswikiSeparator'> | </span><span><span class="foswikiRequiresChangePermission"><a href='/foswiki/bin/oops/System/NatSkinConfiguration?template=oopshistory' rel='nofollow' title='View total topic history' accesskey='h'><span class='foswikiAccessKey'>H</span>istory</a></span>: <a href="/foswiki/bin/view/System/NatSkinConfiguration?rev=4">r4</a> <a href="/foswiki/bin/compare/System/NatSkinConfiguration?rev1=4&rev2=3&render=interweave"><</a> <a href="/foswiki/bin/view/System/NatSkinConfiguration?rev=3">r3</a> < <a href="/foswiki/bin/view/System/NatSkinConfiguration?rev=2">r2</a> <a href="/foswiki/bin/compare/System/NatSkinConfiguration?rev1=2&rev2=1&render=interweave"><</a> <a href="/foswiki/bin/view/System/NatSkinConfiguration?rev=1">r1</a></span><span class='foswikiSeparator'> | </span><span><a href='/foswiki/bin/view/System/NatSkinConfiguration?template=more&maxrev=4&currrev=2' rel='nofollow' title='Delete or rename this topic; set parent topic; view and compare revisions' accesskey='m'><span class='foswikiAccessKey'>M</span>ore topic actions</a></span></span></div></div></div> </div> </div> </div> <div class="clear"> </div> </div><div id="patternBottomBar"><div id="patternBottomBarContents"><div id="patternWebBottomBar"><span class="foswikiRight"> <a href="http://foswiki.org/"><img src="/foswiki/pub/System/ProjectLogos/foswiki-badge.gif" alt="This site is powered by Foswiki" title="This site is powered by Foswiki" border="0" /></a></span>Copyright © by the contributing authors. All material on this site is the property of the contributing authors. <br /> Ideas, requests, problems regarding Foswiki? <a href='mailto:wiki@historische-projekte.de?subject=Foswiki%20Feedback%20on%20System.NatSkinConfiguration'>Send feedback</a> </div></div></div> </div> </div> </div> </div></body></html>