Add custom layout presets to your theme
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.