Proposal: Stylesheet Overrides for Weblogs

Abstract

This is a proposal to define a standard way to integrate stylesheet customizations for weblogs, particularly weblogs using a non-custom theme.

This issue has been discussed before and there was a proposal a while back to accomplish this same task by supporting theme properties. There was a reasonable amount of discussion about theme properies approach and ultimately the idea was not agreed upon. While this proposal does not offer all of the same features of theme properties it does offer a significant portion of them, namely the ability to do custom css styling without having to hack the original template files.

The basic idea here is to be more simplistic in our approach to weblog styling overrides than the theme properties and simply define a standard way for weblogs to plug in a custom stylesheet. This approach would be very similar to the way WordPress allows users to do stylesheet customizations to change the way their blogs are formatted.

Requirements

• provide a way for custom weblog stylesheets to be defined that allow for the manipulation of weblog styling without forcing users to "customize" their theme and edit its templates.

Issues

Issues to be considered

Design

First we would need to add a way to track the custom stylesheet at the weblog level and define a custom stylesheet via theme metadata. So we start by adding one new column to the website table for "customstylesheet" which simply maintains the path under the weblog's custom pages to use as the custom stylesheet. Upgrading installations would have this property set to NULL meaning that there is no custom stylesheet defined. Then in the theme xml metadata file we would add support for one new element ...

<custom-stylesheet path="mytheme-custom.css" />

These would be the only changes required to the data model to support the custom stylesheets.

In the application business logic we would be adding a new method to the WebsiteData pojo to access the custom stylesheet path, getCustomStylesheet(). This provides an easy and consistent way for all templates to access the custom stylesheet for a weblog, simply via $model.weblog.customStylesheet in velocity. Since this method needs to be theme sensitive it would be designed such that if a weblog is using a shared theme then the value would come from the Theme, meaning what's defined in the metadata file, and if the weblog is using a custom theme then the value comes from the database. The value for the database property only changes when a weblog owner changes their theme selection.

• For example, a weblog starts with the basic theme and we'll say that the custom stylesheet defined for that theme is basic-custom.css. The weblog owner then decides to customize that theme and at that point the property is copied into the database since that weblog no longer references the theme anymore. This can happen as many times as necessary and ensures that the property in the database is always either NULL, meaning no custom stylesheet option was chosen, or it is the value of the custom stylesheet path from the last theme the weblog customized.

To plug the custom stylesheet into theme templates only requires that the template author add this one line into the appropriate location of the html head section ...

<link rel="stylesheet" href="$url.page($model.weblog.customStylesheet)" type="text/css" />

When a user decides to create a custom stylesheet override for their weblog all they are really doing is creating a custom page, so the editing process is the same as editing any other template. The custom stylesheet operates just like all other custom pages and would be accessible via <weblog>/page/<custom-stylesheet> and it is this url which is being inserted into the weblog templates as detailed above. When a user decides to customize the styling of their theme we would simply automate the process of creating the custom stylesheet template and then allow them to edit it however they wish. Links to guide the user in doing the stylesheet customization will be provided on the theme selection page.

Comments

Comments ...