Readme and Decription for the FlexiSkin for PmWiki 2.x: ========================================================== This skin and all accompaning documentation was created by Klonk (Karl Loncarek) and could be used freely. If you want to know more about the history of this skin take a look at the file "history.txt". Here is the description (PmWiki markup): ========================================================== !!About I created this skin with flexibility in mind. Therefore there is no fixed text or edit link within the .tmpl file. Also no tables were used. All elements are built using [=DIVs=]. Design and layout is only done through a (selectable) .CSS file. Therefore everything is possible. You could see it almost as skinable Skin. See http://www.csszengarden.com for examples if you need ideas for your own layout. There you can see what is possible with the same HTML code and just with use of different .CSS files. Due to this flexibility this skin requires some knowledge about .CSS to get the desired results. But there are some good webpages out there describing .CSS and the command. A very good page in german language could be found at [[http://de.selfhtml.org]]. The special thing on this skin is that all the displayed header, footer etc. are created from special wiki pages. The only things that are predefined are the anchors "Topp" and "Bottomm" which are located directly before and after the wikitext (for fast jumping to the beginning or end of the document). Also available is the anchor "[=BodyTopp=]" which allows easy jumping directly to the beginning of the page. If you want to have an e.g. last modified information at the end, well, then just place [@{$LastModified}@] in the file [@FlexiFooter@]. If you want to use menus take a look at [[Cookbook/HorizontalVerticalMenu]] and [[Cookbook/HorizontalMenu]]. As you can see this skin could be perfectly used as starting point for own skins or highly individual pages. Well this is the real reason for this skin. I was asked to create a web site and just didn't want to invent the wheel again. !!Internals All wiki pages that may contain any content are located within [=DIVs=] with the pagename as ID. The whole page is written within an overall DIV with ID [@FlexiAll@] and the current action as CLASS. Available actions are e.g. "browse", "edit", "attr", "diff", "upload", "print" etc. See pmwiki.php for more. With this the current action is handed through to the .CSS file. The wiki pages could be in the Group Site or the actual [=SiteGroup=] or in the actual group. Due to the possibility to select the used .CSS file within the @@config.php@@ even each group/page could have a totally unique layout. For compatibility reasons [@Site.SideBar@] is displayed when no [@FlexLeft@] exists. First is checked whether one of the below files exists for the actual group, then it is displayed. If it does not exist, the file in the defaultgroup is displayed. And if this does not exist also the file in the Main group is displayed. Files used are: *[@FlexiTop@] *[@FlexiBottom@] *[@FlexiLeft@] *[@FlexiRight@] *[@FlexiHeader@] *[@FlexiFooter@] *[@FlexiTitle@] In the .CSS file you can refer to the separate files via e.g. "@@[=#FlexiTop=] {''some properties''}@@". You can access the main area in which the wikitext is displayed with "[@#FlexiMain@]". Every DIV has also the actual action as class which could be accessed and used for e.g. tabs (e.g "[@.edit@]" for special display when editing the actual file) The name of the files show the intended use of the DIV (e.g. [@FlexiLeft@] to be displayed at the left side), but of course you can place it on the screen whereever you want (using appropriate .CSS settings). If you use own graphics with your own .CSS file, you should place them in the subdirectory "@@gfx@@" within the flexi skin directory. !!Download Attach:flexi.zip You can find version information in the file readme.txt which is contained in the ZIP file. Just search for the last history entry... !!Installation Copy the content of the above [=ZIP=]-file to @@/path/to/pmwiki/pub/skins/@@ and add the following code to your local configuration file: [=$Skin = 'flexi';=] If you also want to use the different print layout you also have to add: [=$ActionSkin['print'] = 'flexi';=] !!Available additional markup :[@(:noleft:)@]: hide file [@FlexiLeft@] for the actual page (This markup is provided by PmWiki itself) :[@(:noright:)@]: hide file [@FlexiRight@] for the actual page (This markup is provided by PmWiki itself) :[@(:notop:)@]: hide file [@FlexiTop@] for the actual page :[@(:nobottom:)@]: hide file [@FlexiBottom@] for the actual page of course standard wiki markup like [@(:noheader:)@], [@(:nofooter:)@] and [@(:notitle:)@] do still work. !!Extended functionality Below you find some variables, which could be set in your config.php and allow additional control over this skin: :[@$FlexiSkin['CSS']@]: allows setting an own .CSS file for your wiki/group/page. Default is "[@flexi.css@]". This file is just a small example to show the different areas. :[@$FlexiSkin['Favicon']@]: allows setting an own page icon which is displayed e.g. in your bookmarks. (Place it in the subdirectory "gfx" Defaults to "[@flexi/favicon.ico@]". To disable it just clear the string. :[@$FlexiSkin['FlexiLeft']@]: allows disabling display of the file [@FlexiLeft@]. Defaults to "1" (show file) :[@$FlexiSkin['FlexiRight']@]: allows disabling display of the file [@FlexiRight@]. Defaults to "1" (show file) :[@$FlexiSkin['FlexiHeader']@]: allows disabling display of the file [@FlexiHeader@]. Defaults to "1" (show file) :[@$FlexiSkin['FlexiFooter']@]: allows disabling display of the file [@FlexiFooter@]. Defaults to "1" (show file) :[@$FlexiSkin['FlexiTitle']@]: allows disabling display of the file [@FlexiTitle@]. Defaults to "1" (show file) :[@$FlexiSkin['FlexiTop']@]: allows disabling display of the file [@FlexiTop@]. Defaults to "1" (show file) :[@$FlexiSkin['FlexiBottom']@]: allows disabling display of the file [@FlexiBottom@]. Defaults to "1" (show file) !!Hints Of course to get an identical look in IE and Gecko based browser lies totally in your responsibility. The provided example gives the same display in IE and [=FireFox=]. If you don't want a totally different look than provided by the sample .CSS file it is a good idea to position [@FlexiLeft@] and [@FlexiRight@] absolutely. !!Contributor Karl Loncarek ([[~Klonk]]) !!History *2005-02-12 First version, just .TMPL file and additional functionality provided. No .CSS file yet. *2005-02-14 Added [@flexi.css@] as sample and for showing the available areas. Fixed minor bug in [@flexi.tmpl@] file. This .CSS file could still be improved, but here it works as a showcase. *2005-02-17 Added posibility to set own [@favicon.ico@] with variable [@$FlexiSkin['Favicon']@] *2005-02-24 updated to use new [=SetTmplDisplay=] function in PmWiki 2.0beta22 *2005-03-04 Added anchor "BodyTopp" for easy jumping to the Top of the page *2005-07-11 Changed skin to reflect changes introduced to PmWiki 2.0beat45 *2010-03-05 Fixed some compatibility problems !!Alternative .CSS and graphics If you want to share your own .CSS file and graphics you used for this skin just feel free to add it here. You can also add your [@Flexi...@] files if you like. * ''your own design''