Outline
Richerlayouts is thought to be a package of tools that enable authors to enhance diversity in the look of their content. The first set of modules currently being developed consists of:
- Richerlayouts Input-Filter: This input-filter defines a set of HTML-Like tags that are processed after saving and get translated in standard-conform markup. I'll provide a documentation- and roadmap-page in the near future to show a set of tags already implemented.
- Color, Background and Typo-Presets: These three submodules enable authors to select from a range of presets for their particular content; enabling variance and compelling design that matches their current content. (useful in blogging-systems)
Color Presets
There will have to be a preset-mode. Not any author should need to come up with own presets, but rather choose from predefined styles that suite her likes. In addition to that, it should be possible for authors to customize the presets in their particular post.
To achieve this, I should have an abstracted mechanism to save presets. The only sustainable solution is to write a module with separate pages for listing and adding/editing presets.
The Intended workflow
To select a preset during node-creation should be just a matter of picking a preset.
For this matter, it would be nice to embed a custom widget. Instead of the autocomplete-textfield, where the author would have to know the exact name (or part of it) for the preset, she’d just have to choose from a preview visually presented to her in a grid of available presets.
After the author selects a preset, all settings of that preset should appear in a separated tab of the node-edit-form and all of the values should be customizable. This way, the author can select a preset that’s close to her likings and customize it to make it perfect for the current post.
If the user intends to use this customized set more often, she should be able to save presets on a user basis. That means, all users can access public presets and on top of that create their own, private presets.
Typo Presets
The same principles as described above apply to typo-presets. Concerning typography there are some restrictions, mainly copyright an licensing issues. I think about enabling users to provide css-markup for the font-embedding on the configuration-window. This way, they can easily use webfont-services like Webink or Fontspring or embed their converted fonts.
Properties for Color- and Backgroundscheme Presets
- Background Color:
Background Color for the blog-post - Background Image:
Background Image for the blog post - BG Repeat X
If the BG-Image should repeat in X-direction - BG Repeat Y:
If the BG-Image should repeat in Y-direction - BG Position Vertical:
Top|Middle|Bottom - BG Position Horizontal:
Left|Middle|Right - BG Image Filter:
Select possible Img-Filters like B/W - BG Item Flash
A flash movie should be used in the background (swf) - BG Item Flash Width:
Width of the flash-movie in pixel or percent - BG Item Flash Height:
Height of the flash-movie in pixel or percent - BG Item Video:
Video-File to use in background (proportionally scaled to use full available screen-size (flv, mp4) - BG Item Video Filter:
Filter-Presets that get applied to the video - BG Item Video Loop:
Whether to loop the video - Default Font Color:
Font Color to use for any text-formats that are not overwritten by more specialised settings - Font Color H1 - H6:
Font Color to use for particular headline-style - Font Color Links:
Font color of anchor-elements
This module should be able to auto-create the necessary css files that get loaded on demand. Using abstracted css-classes this ensures to avoid cluttering (and invalidating) markup with inline-styles.