[pmwiki-users] CSS for a cookbook recipe?

Petko Yotov 5ko at 5ko.fr
Tue Jul 12 01:54:59 CDT 2016

On 2016-07-12 07:19, Peter Kay wrote:
> So I'm writing a cookbook, and I need to put in some CSS.  ...What's
> best practices in terms of managing it, and making it something an
> admin could change?  (Let me add: while being relatively simple for
> me!)

The thing to keep in mind is that most people will use a different skin 
and color theme than you, and CSS for one theme may or may not work well 
with other themes. I'd probably keep it as simple as practical, and use 
core styles if possible, eg class="frame" should work well in most 
skins, while "border:1px solid #ccc; background-color:#eee;" may not 
work well with light text themes.

(Most of my recipes assume dark text on light/white background, and the 
CSS should look acceptable in the default skin, but not many people use 
the default skin. People need to be able to change or override the CSS 
that comes with a recipe.)

There are at least 3 ways to have CSS for your recipe:

PmWiki automatically loads the file pmwiki/pub/css/local.css if it 
exists. Some recipes with a few lines of CSS simply document what should 
be added into local.css in the "Install" section of the page.

If your recipe has more than one file, eg. CSS+JS+icons, you can have 
your own directory in pmwiki/pub where to place them all. Then in your 
recipe you include your CSS with such a line:

   SDVA($HTMLHeaderFmt, array(
    'your-recipe'=>'<link rel="stylesheet" type="text/css" 
href="$FarmPubDirUrl/recipe/recipe.css" />'

The third way is with $HTMLStylesFmt below.

> The documentation suggests that adding an entry to $HTMLStylesFmt
> would be the way to go...is there some convention for naming an entry?

You should use a key that is unlikely to collide with a key from another 
recipe or from the core. The name of your recipe as the key may work 

   SDVA($HTMLStylesFmt, array('your-recipe'=>'css here'));

>  And it will just magically show up for me?

Yes. Admins will be able to overwrite your CSS by defining the 
$HTMLStylesFmt['your-recipe'] variable, or by adding entries to 
local.css. But this may be inconvenient for wikis implementing Content 
Security Policy, see http://www.pmwiki.org/wiki/PITS/01389 .


More information about the pmwiki-users mailing list