how to change the stylesheets

You can easy customise PyLucid if you change the stylesheets. Every Plugin output has CSS "anchor" you can use.

Every plugin output would be surounded with a html div tag. This div tag looks like this:

1

<div class="PyLucidPlugins pluginname" id="pluginname_methodname">

• CSS class items:
  • "PyLucidPlugins" - This string is always the same for every plugin output
  • pluginname - The name of the plugin how inserted the html output code
• CSS id item:
  • pluginname_methodname - Combination of plugin name and current method name.

Note: The CSS id item has a appended number, if the same plugin method inserted html output more than one time!

Here two examples how CSS can change a output:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

.PyLucidPlugins.search {
  /* change the input field of the search plugin /*
  border: 1px solid grey;
}
.PyLucidPlugins.SiteMap p.deep_1 {
  /* change the first entry in the generated sitemap */
  border-bottom: 2px solid #red;
}
#admin_menu_lucidTag {
  /* change the admin menu via the id, but not every admin menu output (e.g. sub_menu) */
  border: 1px solid grey;
  text-align:center;
}

Look into the generated html code and find the plugin output. Firebug / IE dev toolbar can help you ;)

permalink