Add custom layout presets to your theme

This is a community-contributed tutorial. This tutorial is over a year old and may not apply to your version of Concrete CMS.
Mar 24, 2016

Add Area Layout Presets

In order to add and enable custom theme area layout presets to your theme you need to use the getThemeAreaLayoutPresets() function in your page_theme.php file.

Like most functions in page_theme.php these are essentially array maps to provide configuration to your theme.

Define Layouts

The preset layouts essentially generate container markup and column markup. So in order to define what these are, you need to create an array per preset and return it in the getThemeAreaLayoutPresets() method.

/**
 * Add Layout Presets to an Area
 *
 * @return array | array map of areas and a layout structure
 */
public function getThemeAreaLayoutPresets()
{
    return array(
        array(
            'handle' => 'my_custom_layout',
            'name' => 'My Custom Layout',
            'container' => '<div class="container-class eg-row"></div>',
            'columns' => array(
                '<div class="column-class eg-span-8"></div>',
                '<div class="column-class eg-span-4"></div>'
            ),
        ),
    );

}

The number of columns is entirely up to you and this method does not require you to have specified a grid framework either.

Enable getThemeAreaLayoutPresets() in page_theme.php

The key to your theme recognising and implementing this method requires you to apply the use and implement statements to page_theme.php

namespace Application\Theme\Yourtheme;
use Concrete\Core\Area\Layout\Preset\Provider\ThemeProviderInterface;
class PageTheme extends \Concrete\Core\Page\Theme\Theme implements ThemeProviderInterface
{
...
}

You now should be able to add these custom layouts to areas in your theme.

For a fully annotated page_theme.php you can check out this gist.

Recent Tutorials
Edit domains and sitemaps
Apr 4, 2025
By myq.

How to create a sitemap when using an edit domain

Customize the default page title
Mar 12, 2025

Change the default " :: " and/or "site name :: page title" formatting separator to something else.

Configure Composer to work with a Page Type
Feb 20, 2025
By myq.

Fix the "Unable to load block into composer. You must edit this content from within the context of the page." error message

Permissions for editors in a multilingual site
Feb 2, 2025
By myq.

How to set up a multilingual Concrete CMS site for groups of language-specific editors

Restoring deleted pages using advanced search
Jan 16, 2025
By myq.

How to recover deleted pages when there are more than a few to choose from.

How to Automate the Copyright Year
Dec 27, 2024

Learn how to keep your website's copyright year updated automatically in Concrete CMS.

Improvements?

Let us know by posting here.