Adding new layouts and new fields to layouts

bhunter - 7 months ago

Hi all,

After checking documentation and briefly videos, I am still a bit confused about how stuff works... My idea is to create 5 different layouts for my needs... I can do that from admin panel but what I actually want is to have them all in one place under new theme... Fresh new theme is created and I have everything in place (by everything I mean "layouts/default.twig" :-) ) How can I add new layouts files and that they are recognized in admin? Whatever I add in here it is not visible from the admin... and one more thing, when I add a new field and assign it to "new layout", how can I pass it to view? What I mean by this is, if I name new field type text as "new_heading" and want to show it in layout like {% block new_heading %} {% endblock %} it doesn't work... What should I change?

Thanks..

ryanthompson - 7 months ago

Heyo!

Yes layouts are automatically picked up and available in the "Theme Layout" field of the page and page type both.

Typically layouts (views in the /views/layouts directory) are unaware of your page until you bring it in. By that I mean you need to access the page within the template super variable like this:

{{ template.page.some_field }}

Because there are multiple ways to do things it kinda depends on what you want to do. But it sounds like you might have page types and theme layouts confused? Check out the pages module documentation here: https://pyrocms.com/documentation/pages-module/latest#usage/types

Types let you add custom fields for different types of pages and organize the field's output whereas the Theme Layout is more structural.

But again to answer your example there more directly if you need the page information in the layouts simply use the {{ template.page.some_field }} super variable. Your example might look like this if the new_heading were a select of maybe partials file names:

{% if template.page.new_heading.value %}
    {% include "theme::partials/headings/" ~ template.page.new_heading %}
{% endif %}

Hope this helps!

ryanthompson - 7 months ago

You should also be able to define more than just a content block from your page type layout too - which get's passed into the extending them layout:

{% block header %}
    ...
{% endblock %}

{% block content %}
    ....
{% endblock %}

^ Using that inside your page type layout should pass those blocks into the theme layout accordingly - that way your theme layout can still be unaware of the page if you desire (since it's used for pages n such as well).

Cheers!

bhunter - 7 months ago

Hello,

What I really want to do is the following:

1) Create several pages (for example, home, about us and contact), which will use different layouts. So "home page" will use "default.twig layout", "about us page" will use "about.twig layout" and "contact page" will use "contact.twig layout"... Both (about.twig and contact.twig) are created manually inside new theme in folder 'new-theme/resources/views/layouts/'... The problem is that I don't see them in admin to actually choose and assign them to the pages.... This is possible, right?

2) This basically comes after the first problem is solved. When I have "contact page" connected with "contact.twig layout" I would like to assign new fields to this layout choosing from the dropdown in admin.... One of these fields would be "new_title" and then I would like to be able to go inside "contact.twig layout" and place it in some div with classes and id...

Thanks.

ryanthompson - 7 months ago

Regarding #1 - do you have your custom theme selected as active in settings?

bhunter - 7 months ago

Yes I have, and it is showing basic bootstrap theme...

ryanthompson - 7 months ago

Can you show me your view directory contents and the dropdown in the theme layout field for the pages / type forms?

bhunter - 7 months ago

I don't know how to upload the image but here is the structure:

---views/

-----------layouts/

----------------------default.twig

----------------------contact.twig

----------------------about.twig

and they are exact same copy of default twig with just added "this is new layout" or similar text just to be sure they are actually used on the page...

ryanthompson - 7 months ago

And so your dropdown like this doesn't have any other pages?

https://s30.postimg.org/5wj2ayp9t/Screen_Shot_2017-03-31_at_8.45.33_AM.png

ryanthompson - 7 months ago

Have you asked about this in the slack channel by chance?