Differences

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

--- plugin:cssperpage [2018-09-17 16:41] – created turnermm
+++ plugin:cssperpage [2020-07-26 15:45] (current) – [CSSPerPage Plugin] turnermm
@@ Line 1: / Line 1: @@
-====== cssperpage Plugin ======
+====== CSSPerPage 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
-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,Hogfather
 depends    :
 conflicts  :
 similar    :
-tags       :
+tags       : css,style,html
 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:
@@ Line 27: / Line 27: @@
 ===== 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.
@@ Line 33: / Line 33: @@
 ----
-{{  https://i.imgur.com/nPoR7gf.png?direct&510  }}
+{{  https://i.imgur.com/nPoR7gf.png?direct&500  }}
 ----
@@ Line 40: / Line 40: @@
 <code>
     ~~cssp_openDIV~~
-    ~~cssp_user_defined_name_openDIV~~
+    ~~cssp_user-defined-name_openDIV~~
     ~~cssp_closeDIV~~
 </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}}