Posted by akarso on Fri, Jun 22, 2018 - 7:44am --- Updated: Jun 28 '18 - 5:19pm

Ok, a little foreword first: I picked up backdrop after disappointment with D8, two days ago. I'm in the process of creating very basic theme for my page. I can't quite wrap my head around layouts concept, because to me themes and layouts seem to overlap in function.

Another thing is, that I don't like using available templates, I like coding from scratch. This way (either drupal, wordpress, or else) I have least amount of tags in the code, tidy css, and this workflow is also the fastest (I don't have to wonder what the author of template had in mind making 12 x 9 css grid, etc).

So, I've created really simple custom theme (page.tpl.php) hoping that it won't be neccessary to even touch layout system. Just a few divs, header, footer, menu on left. I was able to get menu to render. But I'm unable to render page content, because $page variable is is one big mashup of tags from start to finish - i. e. whole page source.

It's practically the only thing that keeps me from finishing my work for now. Is there a way to just render page content without the hassle of creating layouts and whatnot?

Most helpful answers

Hope you have this fixed. But

Hope you have this fixed. But just to be clear, Backdrop has separated the layout aspects of a theme (page, regions, sidebars, grids etc) from the more display aspects. It takes a bit of getting used to if you're coming from Drupal as a theme builder, but it is really worth it. 

You don not need to put your layout template files in the theme folder. You should create an actual layout template package, with a my_layout.info, my_layout.tpl.php and put them in a folder called my_layout in the folder in the root of your Backdrop installation called layouts.

This is because, again to be clear, Backdrop suggests that you think of your site layout as a separate thing from your theme. Other themes can then use that layout. You can have your site architecture (page, columns, regions, sidebars, grids etc) defined individually for different pages - 3 columns for the "About" page, single column for the front page, grid for your portfolio pages, a slider on the sell page, no header on the confirmation page, etc etc - but allow to change the style (colors, fonts, design elements etc) by switching themes. Hard to come to terms with, but I encourage you to try.

Only if you're overriding a particular existing layout template you could keep this in your theme folder; so if you want a layout template similar to Boxton, you can duplicate boxton.tpl.php in your theme folder and Backdrop will use your copy.

Welcome to Backdrop. The

Welcome to Backdrop. The layout thing often trips up new users. But you're much better of trying to embrace it than trying to bypass it since it is at the core of how Backdrop builds pages. 

In either case youre close already. Just convert your page.tpl.php to a layout - use an existing layout as an example - and then use the UI to place blocks. The layout system essentially gives you the ability to have multiple page.tpl.php's.

Then use your theme just for the theming: color, fonts, etc. 

Comments

Fri, Jun 22, 2018 - 8:35am by docwilmot

Welcome to Backdrop. The layout thing often trips up new users. But you're much better of trying to embrace it than trying to bypass it since it is at the core of how Backdrop builds pages. 

In either case youre close already. Just convert your page.tpl.php to a layout - use an existing layout as an example - and then use the UI to place blocks. The layout system essentially gives you the ability to have multiple page.tpl.php's.

Then use your theme just for the theming: color, fonts, etc. 

Fri, Jun 22, 2018 - 9:36am by akarso

Thank You :)

But I am still clueless...

I've created most basic layout, with one region, and template file like this:

<!--- here comes the layout -->
<?php print $content['content']; ?>
<!-- that's all, folks -->

But I can't tie loose ends. I came to the conclusion, that I must set this layout as default, if I want to use it everywhere. Ok, done it. But how does it go with template? Should I call layout in a template, or what? :|

How and where to set template/layout variables? Ok, templates.php and layout-name.php in respective folders, but I will be creating some modules, in D7 i just set variables in module and use them in template, or use ubiquitous hooks, of course.

I'm kinda stuck.

Fri, Jun 22, 2018 - 11:29am by akarso

Ok, I've partially solved it. It seems that one needs to place layout file in theme folder, and remove template file. I'm not sure what is the point of all that...

Mon, Jun 25, 2018 - 12:35am by docwilmot

Hope you have this fixed. But just to be clear, Backdrop has separated the layout aspects of a theme (page, regions, sidebars, grids etc) from the more display aspects. It takes a bit of getting used to if you're coming from Drupal as a theme builder, but it is really worth it. 

You don not need to put your layout template files in the theme folder. You should create an actual layout template package, with a my_layout.info, my_layout.tpl.php and put them in a folder called my_layout in the folder in the root of your Backdrop installation called layouts.

This is because, again to be clear, Backdrop suggests that you think of your site layout as a separate thing from your theme. Other themes can then use that layout. You can have your site architecture (page, columns, regions, sidebars, grids etc) defined individually for different pages - 3 columns for the "About" page, single column for the front page, grid for your portfolio pages, a slider on the sell page, no header on the confirmation page, etc etc - but allow to change the style (colors, fonts, design elements etc) by switching themes. Hard to come to terms with, but I encourage you to try.

Only if you're overriding a particular existing layout template you could keep this in your theme folder; so if you want a layout template similar to Boxton, you can duplicate boxton.tpl.php in your theme folder and Backdrop will use your copy.

drop's picture

Thu, Jun 28, 2018 - 5:06pm by drop

@akarso, complete documentation on how to create your own layout can be found here: https://api.backdropcms.org/layouts. 

However, I'd second what @docwilmot recommended, and urge you to copy the boxton layout. You can copy the boxton folder from /core/layouts/boxton to /layouts/[whatever] and change it's name to [whatever]. Then change the name of each file within. Then open each file within, and modify those as necessary. You can put your nice clean div-free code in layout--[whatever].tpl.php.

Starting with page.tpl.php won't get you what you need because the file named page.tpl.php in Backdrop is equivalent to the file named html.tpl.php in Drupal. That file can not be used as a layout because - as you have noticed - almost everything you need is missing.