Make sure your site is connected to the concrete5 community. Open the right side panel and click 'Extend concrete5', then click 'Get More Themes'. In the search area type 'charcoal' and click 'Search', click on the theme title or image to view details, then click 'Purchase'. Once downloaded and installed click 'Ok'.
Click 'Pages & Themes' and you should now see the 'Charcoal Theme' in the 'Themes' list. Click 'Activate' to activate the theme, click 'Ok' on next screen, next screen will show all page templates have automatically installed. Click arrow in top left corner to return to your website. You now have the 'Charcoal' theme set up.
Using the 'Add Layout' option:
With page in edit mode click on any area button i.e. main, sidebar, etc (not blocks) and click 'Add Layout'. Click 'Columns' arrows to insert the required number of columns needed. Click 'Add Layout'. Add blocks to the new 'Columns' as normal.
With page in edit mode click on any block and click 'Design & Custom Template'. Click 'Gear' icon, click inside the 'Custom Class' and type in the animation class. Click the underlined class (blue background) to activate and click 'Save'. Animations will fade in and out on page scroll.
Classes are typed in lowercase as below and you can only use one class per block:
Add theme blocks as normal by either dragging or clicking area button and clicking block in side panel.
Flat nav - add the 'Autonav' block as normal then click the block then click 'Design & Custom Template'. Click 'Gear' icon and choose 'Charcoal Flat' from the drop down under 'Custom Template' and 'Save'.
Search - add the 'Search' block as normal and follw the same procedure as above except you need to choose 'Charcoal' from the drop down.