Custom Theming with Conrete5 CMS

I discovered a great new CMS called Concrete5. This is a resource for me, that walks through the steps required to implement custom themes and templates.

Make HTML template

Download and install concrete5 without sample content

Turn off caching for working on own assets for sanity

Make new folder in application/themes/[new_directory]

Add a description.txt file to name and describe the theme (first line is title and second line is description)

Add thumbnail.png with a screenshot of the design (120x90)

Go to the themes section of concrete5 and install new theme

Now create page templates

Page template names refer to the themes section on concrete5 E.g. Full = full.php

Look for images, CSS and JS in template source and prepend href/src with

$view->getThemePath();

to get relative path to themes directory

Concrete5 includes HTML5 shim by default

To add Concrete5 toolbar to the header of the website

 =Loader::element('header_required');

Remove title, meta keywords and description, characterset from head section of source

To add Concrete5 scripts to footer of the website

=Loader::element('footer_required');

Add div with container class to wrap around everything on the page to make sure the toolbar menus shift the template from side to side when open.

=$c->getPageWrapperClass();

To make an editable block, swap out static HTML for

$a = new Area('Welcome'); $a->display($c);