DokuWiki

It's better when it's simple

User Tools

Site Tools


plugin:cssperpage

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Next revision
Previous revision
plugin:cssperpage [2018-09-17 16:41]
turnermm created
plugin:cssperpage [2018-11-12 06:32] (current)
turnermm [cssperpage Plugin]
Line 2: Line 2:
  
 ---- plugin ---- ---- plugin ----
-description:​ Enables setting of CSS on a per page basis.+description:​ Enables setting of CSS on a per page, per section ​basis
 author ​    : Myron Turner ​ author ​    : Myron Turner ​
-email      : turnermm03@shaw.ca  +email      : turnermm02@shaw.ca 
-type       :  +type       : ​syntax 
-lastupdate : 2018-09-17 +lastupdate : 2018-09-15 
-compatible : +compatible : Elenor of Tsort,​Frusterick Manners,​Greebo
 depends ​   :  depends ​   : 
 conflicts ​ :  conflicts ​ : 
 similar ​   :  similar ​   : 
-tags       : ​+tags       : ​css,​style,​html
  
 downloadurl:​ https://​github.com/​turnermm/​cssperpage/​archive/​master.zip downloadurl:​ https://​github.com/​turnermm/​cssperpage/​archive/​master.zip
-bugtracker : # eg. http://​github.com/​turnermm/​dokuwiki-plugin-cssperpage/​issues +bugtracker : https://​github.com/​turnermm/​cssperpage/​issues 
-sourcerepo : # eg. http://​github.com/​turnermm/​dokuwiki-plugin-cssperpage/+sourcerepo : https://​github.com/​turnermm/​cssperpage
 donationurl: ​ donationurl: ​
  
Line 27: Line 27:
 ===== Examples/​Usage ===== ===== Examples/​Usage =====
  
-''​Cssperpage''​ enables setting of CSS styles for an entire page or for sections of a page by placing HTML divs around either the entire page or sections. The CSS must be placed in the style.css file of the plugin directory.+''​Cssperpage''​ enables setting of CSS styles for an entire page or for sections of a page by placing HTML divs around either the entire page or sections. The CSS references these divs and/or their classes. The CSS must be placed in the style.css file of the plugin directory.
  
 This is a screen shot of a page which uses ''​cssperpage''​ to create styles. The demo folder of the ''​cssperpage''​ plugin has a sample dokuwiki page that will produce these styles in combination with the style.css file bundled with the plugin. This is a screen shot of a page which uses ''​cssperpage''​ to create styles. The demo folder of the ''​cssperpage''​ plugin has a sample dokuwiki page that will produce these styles in combination with the style.css file bundled with the plugin.
Line 40: Line 40:
 <​code>​ <​code>​
     ~~cssp_openDIV~~     ~~cssp_openDIV~~
-    ~~cssp_user_defined_name_openDIV~~+    ~~cssp_user-defined-name_openDIV~~
     ~~cssp_closeDIV~~     ~~cssp_closeDIV~~
 </​code>​ </​code>​
  
-Each ''​openDIV''​ form will create an open HTML div tag with a class name.  In the case of %%~~cssp_openDIV~~%% the class name will be ''​opencss''​. ​ In the case of a user defined name, the class name will be the user defined name.  Each openDIV ​mu have a closing ​%%~~cssp_closeDIV~~%%.+Each ''​openDIV''​ form will create an open HTML div tag with a class name.  In the case of ''​%%~~cssp_openDIV~~%%'' ​the class name will be ''​opencss''​. ​ In the case of a user defined name, the class name will be the user defined name.  Each ''​openDIV''​ must have a closing ​''​closeDIV''​ The id for these DIVs is ''#​css_per_page''​. The default class is ''​opencss'',​ and the user defined class is the \\ ''​user-defined-name''​. ​ The HTML will look like this:
  
 +<​code>​
 +<div id="#​css_per_page"​ class="​opencss">​
 +  --your page data
 +</​div>​
 +
 +<div id="#​css_per_page"​ class="​user_defined_name">​
 +  --your page data
 +</​div>​
 +</​code>​
 +
 +You can enclose either an entire page between an openDIV and a closeDIV or a part of the page.  But if you are enclosing a part of the page, the open and close DIVs cannot cross over edit section boundaries. ​ An edit section ​ boundary is marked by DokuWiki'​s in-page edit buttons (as opposed to the edit button or link found outside the page, in the tool bars, top of the page, etc).  ​
 +
 +=== The CSS ===
 +The CSS for these DIVs will look something like this:
 +<file css style.css>​
 +/*user defined class */
 +#​css_per_page.user-defined-name {
 +  font-size:​14pt;​
 +}
  
 +/* css_per_page default class: opencss */
 +#​css_per_page.opencss{
 +    ul {
 +        list-style-image:​ url(images/​image.gif);​
 +    }
 +    font-size: 12pt;
 +}
  
-=== Change Log ===+</​file>​ 
 +==== Change Log ===
 +{{rss>​https://​github.com/​turnermm/​cssperpage/​commits/​master.atom date}}
  
  
plugin/cssperpage.1537195303.txt.gz · Last modified: 2018-09-17 16:41 by turnermm