Skip to content
Grav 2.0 is officially stable. Read the announcement →

Community guidelines

Please keep discussions civil and on-topic. Repeated violations may lead to a temporary ban.

Themes & Styling

List of available template properties?

Started by Chris Lloyd 9 years ago · 5 replies · 1533 views
9 years ago

I can't seem to find a link in the documentation that provides a full list of available properties when creating twig template files. When reviewing antimatter's template files I can see they are using lots of different variables but I don't know which are specific to their theme or what is part of the base cms.

9 years ago

Thank you, I found what I was looking for in the theme variables.

One more quick question if you have a moment. In the modular.html.twig there is a variable that is set using twig called show_onpage_menu, and it is set to true or false based on the modular.md file I believe, and if it does not exist then set to null. It does not exist in my modular.md file but the conditional twig blocks which check this variable are still executing for some reason. Any idea?

modular.html.twig
{% set show_onpage_menu = header.onpage_menu == true or header.onpage_menu is null %}

TWIG
{% if show_onpage_menu %}
    <div class="onpage-working"></div>
    <ul class="navigation">
    {% for module in page.collection() %}
        {% set current_module = (module.active or module.activeChild) ? 'active' : '' %}
        <li class="{{ current_module }}"><a href="#{{ _self.pageLinkName(module.menu) }}">{{ module.menu }}</a></li>
    {% endfor %}
    {% for mitem in site.menu %}
        <li>
            <a {% if mitem.class %}class="{{ mitem.class }}"{% endif %} href="{{ mitem.url }}">
                {% if mitem.icon %}<i class="fa fa-{{ mitem.icon }}"></i>{% endif %}
                {{ mitem.text }}
            </a>
        </li>
    {% endfor %}
    </ul>
{% else %}
    {{  parent() }}
{% endif %}

modular.md

YAML
title: Home
content:
    items: '@self.modular'
    order:
        by: date
        dir: desc
body_classes: modular
9 years ago

Also I don't get where this site.menu exists.

As per the documentation..

site object

An alias to the config.site object. This represents the configuration as set in the site.yaml file.

site.yaml

YAML
title: Site Title
author:
  name: Mystery Man
  email: 'someone@somewhere .com'
metadata:
    description: 'example'

modular.html.twig

TWIG
{% for mitem in site.menu %}
            <li>
                <a {% if mitem.class %}class="{{ mitem.class }}"{% endif %} href="{{ mitem.url }}">
                    {% if mitem.icon %}<i class="fa fa-{{ mitem.icon }}"></i>{% endif %}
                    {{ mitem.text }}
                </a>
            </li>
        {% endfor %}

I check my site site.yaml file and it has no menu property, so where is this template file accessing site.menu from?

9 years ago

i'm not familiar with antimatter, but just test menu it works fine

see doc in Repo

By default, Grav generates the menu from the page structure. However, there are times when you may want to add custom menu items to the end of the menu. This is now supported in Antimatter by creating a menu list in your site.yaml file. An example of this is as follows:

YAML
menu:
    - text: Source
      url: https://github.com/getgrav/grav
    - icon: twitter
      url: http://twitter.com/getgrav
9 years ago

Thank you for your reply.

Despite jumping in with both feet I am beginning to understand everything quite well, and making good progress on this custom theme. I am onto creating some custom fields for different module page templates.

Which.. brings me to another question 🙂.

Question: What is a good way to render custom css set by a user using the admin gui within the page template?

I have created a custom menu using a blueprint for my page template that lets the user select font sizes, colors, and set a background image. I am not what the most graceful method to include these in the page template is. I know liquid lets you create css files with a liquid extension, and twig syntax feels similar. Can I do something like custom.css.twig?

Suggested topics

Topic Participants Replies Views Activity
Themes & Styling · by Pedro M, 2 months ago
4 197 2 months ago
Themes & Styling · by Ian, 2 months ago
3 92 2 months ago
Themes & Styling · by Norbert, 2 years ago
11 454 3 months ago
Themes & Styling · by Lukáš Findeis, 3 months ago
0 47 3 months ago
Themes & Styling · by Sebadamus, 4 months ago
5 127 3 months ago