# Adding grid to my own theme

**URL:** <https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364>\
**Category:** Developing with Concrete\
**Created:** [October 21, 2023, 6:42am UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364 "2023-10-21T06:42:51Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![eivissa89](https://forums.concretecms.org/user_avatar/forums.concretecms.org/eivissa89/32/5178_2.png) [@eivissa89](https://forums.concretecms.org/u/eivissa89)\
**Post date:** [October 21, 2023, 6:42am UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/1 "2023-10-21T06:42:51Z")

</div>

hi there  
i am building my own theme and tried to add a grid framework to the theme.  
i followed these instructions and added the lines which were described:

> **[Enabling Grid Support Areas and Layouts](https://documentation.concretecms.org/developers/pages-themes/designing-for-concrete5/adding-grid-support-to-your-theme/enabling-grid-support-areas-and-layouts)**

but i still get the error:

```auto
No grid framework found. Grid area methods require a valid grid framework defined in a PageTheme class.

```

can anyone help? my page\_theme.php has really only these lines in it:

```auto
<?php
namespace Application\Theme\MyTheme;

use Concrete\Core\Page\Theme\Theme;

class PageTheme extends Theme
{

}

```

---

<div class="post-metadata">

**Author:** ![mnakalay](https://forums.concretecms.org/user_avatar/forums.concretecms.org/mnakalay/32/6276_2.png) [@mnakalay](https://forums.concretecms.org/u/mnakalay)\
**Post date:** [October 23, 2023, 3:04pm UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/2 "2023-10-23T15:04:04Z")

</div>

The tutorial you followed says, under section “Add Grid Support to the Class File”, that you have to add this line to your file:

```auto
protected $pThemeGridFrameworkHandle = 'bootstrap3';

```

And replace bootstrap3 wit the handle you gave your own framework

---

<div class="post-metadata">

**Author:** ![eivissa89](https://forums.concretecms.org/user_avatar/forums.concretecms.org/eivissa89/32/5178_2.png) [@eivissa89](https://forums.concretecms.org/u/eivissa89)\
**Post date:** [October 23, 2023, 4:18pm UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/3 "2023-10-23T16:18:35Z")

</div>

> [@mnakalay](#):
>
> `protected $pThemeGridFrameworkHandle = 'bootstrap3';`

hi mnakaly  
thank you very much for your feedback!  
i added this line in the page\_theme.php but nothing happened – same error.

---

<div class="post-metadata">

**Author:** ![mnakalay](https://forums.concretecms.org/user_avatar/forums.concretecms.org/mnakalay/32/6276_2.png) [@mnakalay](https://forums.concretecms.org/u/mnakalay)\
**Post date:** [October 23, 2023, 5:14pm UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/4 "2023-10-23T17:14:55Z")

</div>

Could you share your whole code here? not just page\_theme.php, the whole thing.

---

<div class="post-metadata">

**Author:** ![eivissa89](https://forums.concretecms.org/user_avatar/forums.concretecms.org/eivissa89/32/5178_2.png) [@eivissa89](https://forums.concretecms.org/u/eivissa89)\
**Post date:** [October 23, 2023, 7:49pm UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/5 "2023-10-23T19:49:49Z")

</div>

basically i have a theme made bymyself which works fine.  
i just wanted to have the possibility to add containers and custom styles in the wysiwyg editor.

this is my page\_theme.php

```auto
<?php
namespace Application\Theme\Snf2024;
class PageTheme extends \Concrete\Core\Page\Theme\Theme

class PageTheme extends Theme
{
    protected $pThemeGridFrameworkHandle = 'bootstrap5';
}

public function getThemeEditorClasses()
{
    return [
        ['title' => t('Title Thin'), 'menuClass' => 'title-thin', 'spanClass' => 'title-thin', 'forceBlock' => 1],
        ['title' => t('Title Caps Bold'), 'menuClass' => 'title-caps-bold', 'spanClass' => 'title-caps-bold', 'forceBlock' => 1],
        ['title' => t('Title Caps'), 'menuClass' => 'title-caps', 'spanClass' => 'title-caps', 'forceBlock' => 1],
        ['title' => t('Image Caption'), 'menuClass' => 'image-caption', 'spanClass' => 'image-caption', 'forceBlock' => '-1'],
        ['title' => t('Standard Button'), 'menuClass' => '', 'spanClass' => 'btn btn-default', 'forceBlock' => '-1'],
        ['title' => t('Success Button'), 'menuClass' => '', 'spanClass' => 'btn btn-success', 'forceBlock' => '-1'],
        ['title' => t('Primary Button'), 'menuClass' => '', 'spanClass' => 'btn btn-primary', 'forceBlock' => '-1'],
    ];
}

```

and this is my default.php:

```auto
<?php
defined('C5_EXECUTE') or die("Access Denied.");

$this->inc('elements/header.php');
?>

<main>
    <?php
    $a = new Area('Main');
    $a->enableGridContainer();
    $a->display($c);

    $a = new Area('Page Footer');
    $a->enableGridContainer();
    $a->display($c);
    ?>
</main>

<?php
$this->inc('elements/footer.php');

```

---

<div class="post-metadata">

**Author:** ![mnakalay](https://forums.concretecms.org/user_avatar/forums.concretecms.org/mnakalay/32/6276_2.png) [@mnakalay](https://forums.concretecms.org/u/mnakalay)\
**Post date:** [October 23, 2023, 9:17pm UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/6 "2023-10-23T21:17:59Z")

</div>

There’s an error in your code.  
The closing bracket } you have after $pThemeGridFrameworkHandle shouldn’t be there. Remove it and put it at the end after the last closing bracket.

---

<div class="post-metadata">

**Author:** ![eivissa89](https://forums.concretecms.org/user_avatar/forums.concretecms.org/eivissa89/32/5178_2.png) [@eivissa89](https://forums.concretecms.org/u/eivissa89)\
**Post date:** [October 24, 2023, 4:36am UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/7 "2023-10-24T04:36:46Z")

</div>

thank you very much for your feeback!

I still get this error… 😪

```auto

No grid framework found. Grid area methods require a valid grid framework defined in a PageTheme class.

```

```auto
<?php
namespace Application\Theme\Snf2024;
class PageTheme extends \Concrete\Core\Page\Theme\Theme

class PageTheme extends Theme
{
    protected $pThemeGridFrameworkHandle = 'bootstrap5';

    public function getThemeName()
    {
        return t('SNF 2024');
    }

    public function getThemeDescription()
    {
        return t('Theme description comes here');
    }

public function getThemeEditorClasses()
{
    return [
        ['title' => t('Title Thin'), 'menuClass' => 'title-thin', 'spanClass' => 'title-thin', 'forceBlock' => 1],
        ['title' => t('Title Caps Bold'), 'menuClass' => 'title-caps-bold', 'spanClass' => 'title-caps-bold', 'forceBlock' => 1],
        ['title' => t('Title Caps'), 'menuClass' => 'title-caps', 'spanClass' => 'title-caps', 'forceBlock' => 1],
        ['title' => t('Image Caption'), 'menuClass' => 'image-caption', 'spanClass' => 'image-caption', 'forceBlock' => '-1'],
        ['title' => t('Standard Button'), 'menuClass' => '', 'spanClass' => 'btn btn-default', 'forceBlock' => '-1'],
        ['title' => t('Success Button'), 'menuClass' => '', 'spanClass' => 'btn btn-success', 'forceBlock' => '-1'],
        ['title' => t('Primary Button'), 'menuClass' => '', 'spanClass' => 'btn btn-primary', 'forceBlock' => '-1'],
    ];
}
}

```

---

<div class="post-metadata">

**Author:** ![mnakalay](https://forums.concretecms.org/user_avatar/forums.concretecms.org/mnakalay/32/6276_2.png) [@mnakalay](https://forums.concretecms.org/u/mnakalay)\
**Post date:** [October 24, 2023, 5:34am UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/8 "2023-10-24T05:34:36Z")

</div>

You still have errors in your code. Here it is corrected:

```auto
<?php
namespace Application\Theme\Snf2024;

use Concrete\Core\Page\Theme\Theme;
use Concrete\Core\Area\Layout\Preset\Provider\ThemeProviderInterface;

class PageTheme extends Theme implements ThemeProviderInterface
{
    protected $pThemeGridFrameworkHandle = 'bootstrap5';

    public function getThemeName()
    {
        return t('SNF 2024');
    }

    public function getThemeDescription()
    {
        return t('Theme description comes here');
    }

    public function getThemeEditorClasses()
    {
        return [
            ['title' => t('Title Thin'), 'menuClass' => 'title-thin', 'spanClass' => 'title-thin', 'forceBlock' => 1],
            ['title' => t('Title Caps Bold'), 'menuClass' => 'title-caps-bold', 'spanClass' => 'title-caps-bold', 'forceBlock' => 1],
            ['title' => t('Title Caps'), 'menuClass' => 'title-caps', 'spanClass' => 'title-caps', 'forceBlock' => 1],
            ['title' => t('Image Caption'), 'menuClass' => 'image-caption', 'spanClass' => 'image-caption', 'forceBlock' => '-1'],
            ['title' => t('Standard Button'), 'menuClass' => '', 'spanClass' => 'btn btn-default', 'forceBlock' => '-1'],
            ['title' => t('Success Button'), 'menuClass' => '', 'spanClass' => 'btn btn-success', 'forceBlock' => '-1'],
            ['title' => t('Primary Button'), 'menuClass' => '', 'spanClass' => 'btn btn-primary', 'forceBlock' => '-1'],
        ];
    }
}

```

---

<div class="post-metadata">

**Author:** ![eivissa89](https://forums.concretecms.org/user_avatar/forums.concretecms.org/eivissa89/32/5178_2.png) [@eivissa89](https://forums.concretecms.org/u/eivissa89)\
**Post date:** [October 24, 2023, 5:57am UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/9 "2023-10-24T05:57:59Z")

</div>

at least another error 😀

> Class Application\Theme\Snf2024\PageTheme contains 1 abstract method and must therefore be declared abstract or implement the remaining methods (Concrete\Core\Area\Layout\Preset\Provider\ThemeProviderInterface::getThemeAreaLayoutPresets)

---

<div class="post-metadata">

**Author:** ![mnakalay](https://forums.concretecms.org/user_avatar/forums.concretecms.org/mnakalay/32/6276_2.png) [@mnakalay](https://forums.concretecms.org/u/mnakalay)\
**Post date:** [October 24, 2023, 4:45pm UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/10 "2023-10-24T16:45:53Z")

</div>

There is one more function that is required even if you’re not going to use it. I didn’t include it hence the error.

It the last one I added, named getThemeAreaLayoutPresets.

I left stuff in it so you can see what it does and how it works.

```auto
<?php
namespace Application\Theme\Snf2024;

use Concrete\Core\Page\Theme\Theme;
use Concrete\Core\Area\Layout\Preset\Provider\ThemeProviderInterface;

class PageTheme extends Theme implements ThemeProviderInterface
{
    protected $pThemeGridFrameworkHandle = 'bootstrap5';

    public function getThemeName()
    {
        return t('SNF 2024');
    }

    public function getThemeDescription()
    {
        return t('Theme description comes here');
    }

    public function getThemeEditorClasses()
    {
        return [
            ['title' => t('Title Thin'), 'menuClass' => 'title-thin', 'spanClass' => 'title-thin', 'forceBlock' => 1],
            ['title' => t('Title Caps Bold'), 'menuClass' => 'title-caps-bold', 'spanClass' => 'title-caps-bold', 'forceBlock' => 1],
            ['title' => t('Title Caps'), 'menuClass' => 'title-caps', 'spanClass' => 'title-caps', 'forceBlock' => 1],
            ['title' => t('Image Caption'), 'menuClass' => 'image-caption', 'spanClass' => 'image-caption', 'forceBlock' => '-1'],
            ['title' => t('Standard Button'), 'menuClass' => '', 'spanClass' => 'btn btn-default', 'forceBlock' => '-1'],
            ['title' => t('Success Button'), 'menuClass' => '', 'spanClass' => 'btn btn-success', 'forceBlock' => '-1'],
            ['title' => t('Primary Button'), 'menuClass' => '', 'spanClass' => 'btn btn-primary', 'forceBlock' => '-1'],
        ];
    }

    /**
     * @return array
     */
    public function getThemeAreaLayoutPresets()
    {
        $presets = [
            [
                'handle' => 'left_sidebar',
                'name' => 'Left Sidebar',
                'container' => '<div class="row"></div>',
                'columns' => [
                    '<div class="col-sm-4"></div>',
                    '<div class="col-sm-8"></div>',
                ],
            ],
            [
                'handle' => 'right_sidebar',
                'name' => 'Right Sidebar',
                'container' => '<div class="row"></div>',
                'columns' => [
                    '<div class="col-sm-8"></div>',
                    '<div class="col-sm-4"></div>',
                ],
            ],
        ];

        return $presets;
    }
}

```

---

<div class="post-metadata">

**Author:** ![eivissa89](https://forums.concretecms.org/user_avatar/forums.concretecms.org/eivissa89/32/5178_2.png) [@eivissa89](https://forums.concretecms.org/u/eivissa89)\
**Post date:** [October 25, 2023, 6:54am UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/11 "2023-10-25T06:54:59Z")

</div>

i thank you so much!  
it works! 🙂

much appreciated!

---

<div class="post-metadata">

**Author:** ![mnakalay](https://forums.concretecms.org/user_avatar/forums.concretecms.org/mnakalay/32/6276_2.png) [@mnakalay](https://forums.concretecms.org/u/mnakalay)\
**Post date:** [October 25, 2023, 3:58pm UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/12 "2023-10-25T15:58:32Z")

</div>

Good luck with your project 🙂

---

<div class="post-metadata">

**Author:** ![eivissa89](https://forums.concretecms.org/user_avatar/forums.concretecms.org/eivissa89/32/5178_2.png) [@eivissa89](https://forums.concretecms.org/u/eivissa89)\
**Post date:** [October 25, 2023, 7:45pm UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/13 "2023-10-25T19:45:06Z")

</div>

thanks very much! 🙂  
I am not sure if this is ironic 😉

---

<div class="post-metadata">

**Author:** ![mnakalay](https://forums.concretecms.org/user_avatar/forums.concretecms.org/mnakalay/32/6276_2.png) [@mnakalay](https://forums.concretecms.org/u/mnakalay)\
**Post date:** [October 25, 2023, 8:32pm UTC](https://forums.concretecms.org/t/adding-grid-to-my-own-theme/6364/14 "2023-10-25T20:32:31Z")

</div>

No not ironic. I’m not a native English speaker so I know I give the wrong impression sometimes.

It’s a curse 😅
