Commit d02dea77 authored by metzlerd's avatar metzlerd
Browse files

Adding skin documentation.

parent f3204915
......@@ -29,4 +29,8 @@
<title>Forena Report XML (frx) reference</title>
<name>help.design</name>
</row>
<row>
<title>Reort Skins</title>
<name>help.skins</name>
</row>
</root>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE root [
<!ENTITY nbsp "&#160;">
]>
<html xmlns:frx="urn:FrxReports">
<head>
<title>Report Skins</title>
<frx:category>Help</frx:category>
<frx:options hidden="1" />
<frx:parameters>
</frx:parameters>
<frx:docgen>
</frx:docgen>
<frx:fields>
<frx:field id="title" link="reports/{name}" />
</frx:fields>
</head>
<body>
<ul id="forena-1" frx:block="forena_help/design_topics">
<li id="forena-2" frx:foreach="*"><span>{title}</span></li>
</ul>
<p>
Report skins can be used to manage the look and feel of multiple reports. Skins
are basically a colelction of CSS stylesheets, Javascript librares and
and configuraiton entries.
</p>
<h2>Defining Skins</h2>
<p>
Skins are defined be creating skin configuration files (.skinfo) in the reports directory
(usually sites/default/files/reports). Forena comes with a single example configuration
file which can be used as a template. Skin info (.skinfo) files are in are created
in the same basic sintax as .info files for themes. The following example illustrates the syntax:
</p>
<pre>
; The name indicates the name displayed in the skin select box
; on the Format tab when editing reports.
name = Default Skin
description = Default skin for use with Forena.
; Javascript include example
scripts[] = dataTables/media/js/jquery.dataTables.min.js
; css Include example
stylesheets[all][] = table_padding.css
</pre>
<p>
After creating each new skin infromation file be sure and clear your forena caches using
the clear cache button under the Structure -&gt; Forena Reports menu.
</p>
<h2>Assigning Skins to reports</h2>
<p>
The default skin is configured in the "General" tab of the configuration file. For each report
you can set the skin used in the Format tab of report editor, or you can specify this directly
in the .frx file by specifying the skin="skin_base_file_name" attribute in the frx:options element
in the head section of the .frx file as follows:
</p>
<html frx:renderer="FrxSource">
<head>
<frx:options skin="default_skin"/>
</head>
<body>
...
</body>
</html>
<h2>CSS Libraries</h2>
<p>
Stylesheets can be included using the same syntax for drupal themes. Inlcuding a
stylesheets[all][]=sheet.css line in your .skinfo file, will casue that file to be
loaded for for any media types.
</p>
<p>
If you are using a PDF generator (MPDF or Prince), understand that you an specify stylesheets[pdf][]
entries to include particular stylesheets only in the PDF transformation. Forena looks first in the
reports directory for the stylesheets and then at the site root level, so you can specify theme css files by fully
qualifyting the path to the theme. This can be particularly useful when you want to include
a typography stylesheet in your PDF translations.
</p>
<h2>Javascript Libraries</h2>
<p>
Javascript libraries are included using the same syntax as is used in the theme info file.
in the above example the scripts[]=dataTables/media/js/jquery.dataTables.js is used
to load the JQuery dataTables library. Forena will search for these libararies first in the
report directory and then in the sites/all/libraries folder. This is particularly useful
if you want to laod additional Jquery plugins for a set but not all reports. You can add
additional javascript libraries without needing to write custom module or theme code.
</p>
</body>
</html>
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment