Skellie
Theming wordpress while staying sane
Problem #1 - Picking a theme
-
Tons of ready-to-use themes
Building a custom theme based on a working one offers no control over the project.
-
Skeleton/blank themes
Most have 10+ functions that are used within their templates heavily. Some even print html.
Others require theme configuration in the database. Eventually they fall into the previous category.
-
We keep experimenting with technologies.
Amonst things we've tried: boilerplate with custom css, grid 960, scss, compass...
We keep learning and experimenting with new shinies.
-
Requirements vary per project.
Content changes, order of elements change, wrappers are required in order to style them to our needs.
-
Practically nothing stays the same accross projects
Problem #2 - get_template_part
The wordpress way of reusing code within a theme.
Example
Will look for the following files and include the first one:
wp-content/themes/theme-folder/{$slug}-{$name}.php
wp-content/themes/theme-folder/{$slug}.php
Code included with get_template_part
lives within its own scope with most wordpress
globals preloaded.
The "cleanest" way of communicating information to a template part is...
GLOBALS
Problem #3 - Structure
GOOD: Wordpress custom post types are very useful for building custom themes.
BAD: Wordpress forces you to put all templates and template_parts in the theme's root directory.
Problem #4 - WP Templates
Meant for differentiating the way a specific page looks like.
Example: A page (post_type = 'page') is rendered by page.php unless a different template is set.
Also end up in the theme's root directory.
WP template ~ ZF layout [with extra headers/footers/sidebars]
Lots of duplicate wrapping code
headers/footers/sidebars are also template parts [theme's root directory...]
Skellie as a skeleton
- PHP 5.3 because we can
- No css or js attached. Enqueue action in place but empty.
- No menus, sidebars or thumbnails. Action with sample code in comments.
- No functions in
functions.php
- 1 closure to take over rendering from wordpress
- No wrapping code in place for the default WP templates
Skellie view objects
- Skellie templates are like wordpress templates except that...
- Every template has a layout [configurable with a comment or default]
- The layout wraps around the template and prints the template within it.
- Layouts, templates and partials are all objects with some default vars
- Layouts, templates and partials can all use partials
- Partials are like template parts but smarter
Example
Will look for the following files and include the first one:
theme-dir/partials/{$slug}/{$name}.php
theme-dir/partials/{$slug}.php
theme-dir/partials/{$slug}/default.php
Skellie Layouts and Templates
- Layouts are located in
theme-dir/layouts
- If no layout is chosen it picks the default layout
Example template (homepage)
Skellie layout example (homepage)