General Guidelines for themes coded by tallacman

General Guidelines

My themes are designed to cleanly install over a standard “Elemental” full content install. This is the base install from concrete5, version 5.7.

My themes are constructed with a flexbox framework that is lightweight and has no javascript dependancies. I use slicknav for the mobile menu where applicable. Not all my themes are designed to use a specific mobile menu and therefore will not have a slicknav template. In this case use “None” for the custom template.

To activate the mobile menu simply put any page in edit mode and choose the “Slicknav” custom template then save the page.

Some other themes also contain custom templates for other blocks. These will be listed under their respective detail pages.

All my themes contain the named areas defined by Portland Labs in their base theme “Elemental”. Although my themes may not use all of their named areas. Generally the common areas are:

  • Header Site Title - a global area
  • Header Navigation - a global area
  • Main
  • Sidebar

This way any content you have added on an Elemental theme will display automatically when you switch themes.

I do not enable layout grids on my themes. These are clunky and generic at best. They are not suited to the flexbox model which is different from floats and clear fix hacks.

Editing my themes

Because the flexbox model allows areas that only take up their content width editing certain global areas is easiest carried out in the Stacks > Global Areas section of the dashboard. Typically I will use these auto shrinking containers in the site header area and the footer area and then only on global areas.

When using the core Feature block be aware that my themes do not support the hover description custom template. Choose “None” for any hover description templates you have activated. The base install of Elemental contains 4 of these on the Services page.

Other custom templates are available on a theme to theme basis where needed.

Notes

As a general rule where there is an area that stretches the full width of the page, any image placed will be stretched to 100% of the available width.