NatSkin < System

You are here: Foswiki>System Web>NatSkinEditAttach

---+!! [[%TOPIC%][The Natural Skin]]

!NatSkin improves your Foswiki experience by bringing together some of the most useful
features from different plugins in a consistent way. !NatSkin comes with a modern
web design that improves readability of your wiki content as well as easing the way
you interact with it as a wiki author and consumer.

!NatSkin also serves as a foundation for additional web designs. So you won't need to
reinvent the wheel on every project over and over again.

!NatSkin allows you to choose between several kinds of page layouts. All of the
predefined themes come with support for a 1, 2 and 3 columns designs in both a
fluid and a fixed page layout. 

!NatSkin provides a much improved usability when navigating among webs as well as
when interacting with wiki content.

---++ Screenshots

---++ Theme switcher

You can change design and layout aspects of every page as you like with just a few clicks.

Configure the skin by changing:

   * the theme installed on your system,
   * the style part of a theme,
   * the variation added to the theme's style,
   * the sidebar location,
   * the page layout being either a fixed-width, or a fluid design or
   * the navigation elements as displayed at the top of the page.

The underlying templates that generate the pages are arranged in a flexible and
manageable way to facilitate easy "skin mix-in", that is, overriding specific parts of
the templates by using the !NatSkin as a parent skin to create template modifications.

---++ <nop>WebComponents

| *Name* | *Description* | *Default* |
| <nop>Menu | navigation tabs above the topic area | [[%SYSTEMWEB%.SiteMenu]] |
| <nop>SideBar | a configurable navigation bar | [[%SYSTEMWEB%.SiteSideBar]] |
| <nop>RightBar | when using two sidebars, this component holds the right sidebar, while the <nop>SideBar component is displayed on the left. | [[%SYSTEMWEB%.SiteRightBar]] |
| <nop>Links | this is a sub-component of the <nop>SideBar component to plug in navigation links within | [[%SYSTEMWEB%.SiteLinks]], [[%USERSWEB%.WebLinks]], [[%SYSTEMWEB%.WebLinks]] |
| <nop>BottmBar | customize the content at the bottom area of a page | [[%SYSTEMWEB%.SiteBottomBar]] |
| <nop>HtmlHead | additional stuff to be put into the html head, like javascript and/or css | [[%SYSTEMWEB%.SiteHtmlHead]] |
| <nop>HtmlBottom | similar to <nop>WebHtmlHead but putting additional stuff just before the closing &lt;/body> tag of a page; this is useful when adding third party javascript code to a website, like tracking code | |
| <nop>TopicActions | configure the actions used to manipulate topics | [[%SYSTEMWEB%.SiteTopicActions]] |

---++ Documentation
   * NatSkinConfiguration
   * NatSkinFAQ
   * NatSkinGrid
   * NatSkinPlugin
---++ Installation Instructions
You do not need to install anything in the browser to use this extension. The following instructions are for the administrator who installs the extension on the server.

Open configure, and open the "Extensions" section. Use "Find More Extensions" to get a list of available extensions. Select "Install".

If you have any problems, or if the extension isn't available in =configure=, then you can still install manually from the command-line. See http://foswiki.org/Support/ManuallyInstallingExtensions for more help.


   * Test if installed: [[%SCRIPTURLPATH{"view"}%/%WEB%/%TOPIC%?skin=nat][click here]]

---++ Dependencies
<table class="foswikiTable" border="1"><tr><th>Name</th><th>Version</th><th>Description</th></tr><tr><td align="left">Foswiki::Contrib::FamFamFamContrib</td><td align="left">&gt;=2075</td><td align="left">Required.</td></tr><tr><td align="left">Foswiki::Plugins::AutoTemplatePlugin</td><td align="left">&gt;=2.01</td><td align="left">Required</td></tr><tr><td align="left">Foswiki::Plugins::BreadCrumbsPlugin</td><td align="left">&gt;=4318</td><td align="left">Required</td></tr><tr><td align="left">Foswiki::Plugins::DBCachePlugin</td><td align="left">&gt;=1</td><td align="left">Optional</td></tr><tr><td align="left">Foswiki::Plugins::MimeIconPlugin</td><td align="left">&gt;=1</td><td align="left">Required</td></tr><tr><td align="left">Foswiki::Plugins::FilterPlugin</td><td align="left">&gt;=3491</td><td align="left">Required</td></tr><tr><td align="left">Foswiki::Plugins::FlexWebListPlugin</td><td align="left">&gt;=3493</td><td align="left">Required</td></tr><tr><td align="left">Foswiki::Plugins::ImagePlugin</td><td align="left">&gt;=6307</td><td align="left">Optional</td></tr><tr><td align="left">Foswiki::Plugins::JQueryPlugin</td><td align="left">&gt;=4.70</td><td align="left">Required</td></tr><tr><td align="left">Foswiki::Plugins::NatEditPlugin</td><td align="left">&gt;=1993</td><td align="left">Required</td></tr><tr><td align="left">Foswiki::Plugins::NatSkinPlugin</td><td align="left">&gt;=3.99_004</td><td align="left">Required</td></tr><tr><td align="left">Foswiki::Plugins::RenderPlugin</td><td align="left">&gt;=3644</td><td align="left">Required</td></tr><tr><td align="left">Foswiki::Plugins::TopicInteractionPlugin</td><td align="left">&gt;=1340</td><td align="left">Required</td></tr><tr><td align="left">Foswiki::Plugins::WebLinkPlugin</td><td align="left">&gt;=1</td><td align="left">Optional</td></tr><tr><td align="left">Foswiki::Plugins::PageOptimizerPlugin</td><td align="left">&gt;=0.10</td><td align="left">Optional</td></tr><tr><td align="left">Foswiki::Plugins::ZonePlugin</td><td align="left">&gt;=3.1</td><td align="left">Required. required for Foswiki < 1.1</td></tr></table>

---++ Skin Info
<!-- 
   * Set SHORTDESCRIPTION = Modern web design for Foswiki
-->
|  Skin Author: | Michael Daum |
|  Copyright &copy;: | 2003-2013, Michael Daum http://michaeldaumconsulting.com |
|  License: | GPL ([[http://www.gnu.org/copyleft/gpl.html][GNU General Public License]]) |
|  Release: | 3.99_016 |
|  Version: | 3.99_016 |
|  Description: | Userfriendly Foswiki skin providing a flexible theming engine for professional webdesigns |
|  Base Name: | nat |
|  Screenshot: | <div style="overflow:hidden;height:200px"><a href="%PUBURLPATH%/%WEB%/NatSkin/BlueNoteStyle.jpeg"><img src="%PUBURLPATH%/%WEB%/NatSkin/BlueNoteStyle.jpeg" title="JazzyNoteTheme"/></a></div> |
|  Change&nbsp;History: | <!-- specify latest version first -->&nbsp; |
|  14 Mar 2013: | first beta of new release |
|  25 Jun 2003: | Initial version |
|  Home: | Foswiki:Extensions/NatSkin |
|  Support: | Foswiki:Support/NatSkin |

Topic attachments
I	Attachment	Action	Size	Date	Who
css	BaseStyle.css	manage	42.8 K	19 Jun 2013 - 13:46	AdminUser
gz	BaseStyle.css.gz	manage	9.2 K	19 Jun 2013 - 13:46	AdminUser
css	BaseStyle.uncompressed.css	manage	53.3 K	19 Jun 2013 - 13:46	AdminUser
jpeg	BlueNoteStyle.jpeg	manage	41.1 K	19 Jun 2013 - 13:46	AdminUser
EXT	Makefile	manage	0.2 K	19 Jun 2013 - 13:46	AdminUser
include	Makefile.include	manage	0.1 K	19 Jun 2013 - 13:46	AdminUser
js	attach.js	manage	0.5 K	19 Jun 2013 - 13:46	AdminUser
gz	attach.js.gz	manage	0.3 K	19 Jun 2013 - 13:46	AdminUser
js	attach.uncompressed.js	manage	1.3 K	19 Jun 2013 - 13:46	AdminUser
gif	blank.gif	manage	0.1 K	19 Jun 2013 - 13:46	AdminUser
gif	bullet-toc.gif	manage	0.1 K	19 Jun 2013 - 13:46	AdminUser
png	external.png	manage	0.2 K	19 Jun 2013 - 13:46	AdminUser
ico	favicon.ico	manage	1.1 K	19 Jun 2013 - 13:46	AdminUser
png	foswiki-logo.png	manage	5.0 K	19 Jun 2013 - 13:46	AdminUser
png	grid-40x18.png	manage	0.1 K	19 Jun 2013 - 13:46	AdminUser
gif	hamburger.gif	manage	1.2 K	19 Jun 2013 - 13:46	AdminUser
js	history.js	manage	1.2 K	19 Jun 2013 - 13:46	AdminUser
gz	history.js.gz	manage	0.6 K	19 Jun 2013 - 13:46	AdminUser
js	history.uncompressed.js	manage	2.3 K	19 Jun 2013 - 13:46	AdminUser
htc	iepngfix.htc	manage	3.2 K	19 Jun 2013 - 13:46	AdminUser
png	input-bg.png	manage	4.5 K	19 Jun 2013 - 13:46	AdminUser
js	login.js	manage	0.2 K	19 Jun 2013 - 13:46	AdminUser
gz	login.js.gz	manage	0.2 K	19 Jun 2013 - 13:46	AdminUser
js	login.uncompressed.js	manage	0.4 K	19 Jun 2013 - 13:46	AdminUser
png	login_keys.png	manage	14.8 K	19 Jun 2013 - 13:46	AdminUser
gif	menuarrow.gif	manage	0.8 K	19 Jun 2013 - 13:46	AdminUser
gif	menubg.gif	manage	5.9 K	19 Jun 2013 - 13:46	AdminUser
png	minus.png	manage	0.3 K	19 Jun 2013 - 13:46	AdminUser
js	natskin.js	manage	2.9 K	19 Jun 2013 - 13:46	AdminUser
gz	natskin.js.gz	manage	1.2 K	19 Jun 2013 - 13:46	AdminUser
js	natskin.uncompressed.js	manage	5.4 K	19 Jun 2013 - 13:46	AdminUser
js	obfuscator.js	manage	0.4 K	19 Jun 2013 - 13:46	AdminUser
gz	obfuscator.js.gz	manage	0.3 K	19 Jun 2013 - 13:46	AdminUser
js	obfuscator.uncompressed.js	manage	0.7 K	19 Jun 2013 - 13:46	AdminUser
png	oldrevisionbg.png	manage	7.1 K	19 Jun 2013 - 13:46	AdminUser
gif	oopsmore_diff_debug.gif	manage	3.1 K	19 Jun 2013 - 13:46	AdminUser
gif	oopsmore_diff_sequential.gif	manage	3.4 K	19 Jun 2013 - 13:46	AdminUser
gif	oopsmore_diff_sidebyside.gif	manage	1.9 K	19 Jun 2013 - 13:46	AdminUser
gz	password.js.gz	manage	0.9 K	19 Jun 2013 - 13:46	AdminUser
js	password.uncompressed.js	manage	7.0 K	19 Jun 2013 - 13:46	AdminUser
png	pdf.png	manage	0.7 K	19 Jun 2013 - 13:46	AdminUser
png	plus.png	manage	0.4 K	19 Jun 2013 - 13:46	AdminUser
png	previewbg.png	manage	18.9 K	19 Jun 2013 - 13:46	AdminUser
css	print.css	manage	2.6 K	19 Jun 2013 - 13:46	AdminUser
gz	print.css.gz	manage	1.0 K	19 Jun 2013 - 13:46	AdminUser
css	print.uncompressed.css	manage	3.5 K	19 Jun 2013 - 13:46	AdminUser
gif	q_black.gif	manage	0.1 K	19 Jun 2013 - 13:46	AdminUser
js	rename.js	manage	0.6 K	19 Jun 2013 - 13:46	AdminUser
gz	rename.js.gz	manage	0.3 K	19 Jun 2013 - 13:46	AdminUser
js	rename.uncompressed.js	manage	0.9 K	19 Jun 2013 - 13:46	AdminUser
png	search_button.png	manage	0.6 K	19 Jun 2013 - 13:46	AdminUser
js	subscribe.js	manage	0.7 K	19 Jun 2013 - 13:46	AdminUser
js	subscribe.uncompressed.js	manage	1.2 K	19 Jun 2013 - 13:46	AdminUser

Topic revision: r7 - 19 Nov 2013, AdminUser

System

Copyright © by the contributing authors. All material on this site is the property of the contributing authors.
Ideas, requests, problems regarding Foswiki? Send feedback