Template "Base"
Table of contents
"Base" is a template packaged with DekiWiki Hayes which is intended to be easy to understand and modify for designers with little-to-no PHP knowledge. Our Template Standardization project led to the development of Base.
Using "Base" as an example, we'll show you how to easily style your DekiWiki installation.
"Base" Files
DekiWiki Hayes comes with 3 separate styles: 91, Company, and Wireframe. 91 is a bare-bones style which only contains styles which format the template into a standard 3-column layout. Wireframe, which uses the same formatting as 91, has added borders and padding to give you a visual guide in mapping our markup with the elements as they're displayed. Company is an example of what things can look like after extending the 91 style.
Quick Start
If you don't access to the actual application, we've grabbed the HTML that is generated and supplied that along with the default stylesheets in a handy zip file. Using this zip file, designers can work on the skinning on their own computers, then apply their changes to DekiWiki through the control panel.
Quick Start ZIP File Contents
- /base.html
This is the markup for a view that is generated in DekiWiki - /base/(*)
Contains a bunch of images and styles relevant to base. For the ZIP file, your only folder of interest is the "company" folder (the other two are alternate skins - /common/(*)
These are styles that are set by DekiWiki - you cannot change the files in here, but you may override the declarations in your own customSkin.css and customContent.css
Quick Start Guidelines:
- Edit only the customSkin.css and customContent.css stylesheets. Because these are loaded last, they will overwrite all the styles that DekiWiki loads by default; this will allow you to override any default styling. You have full control of the look & feel!
- customSkin.css contains any overall design styles
- customContent.css contains styles for the article text. The reason these files are separated is that our editor needs to know what stylesheets to load - we can't go around loading the whole design's css into the editor! Examples of items to modify in customContent.css are <h1>, <p>, and <a> stylings (although there are many more, these will be the big ones).
- You may insert ANY HTML you want between the <div class="custom"></div> tags in base.html - these are custom areas that you will be able to insert in the control panel. Changing the markup anywhere else will not be picked up by DekiWiki when you integrate your skin into the wiki software.
Then, when you're done, go to your DekiWiki instance and update your styles through the control panel.
Quick Start Misc Notes:
base.html shows two items at the bottom:
- The box on the left is the way the menu looks (in the Company style, this displays by the down arrow by the "Edit Page" button
- The item on the right is the way popup dialogs look. Popup dialogs are used very frequently for operation such as tagging, deleting pages, attaching files, moving pages, etc.
You do not need to worry about positioning either of these elements - since base.html isn't a functional file, we've just put those two items at the bottom so you can style them.
- Tag page
-
- What links here
