Gravy

Gravy is a website constructor Frontend for Grav CMS.

It interfaces with the native modular system, to provide a friendlier experience without having to commit into a much heavier and complex framework such as Gantry.

Installation

Gravy is not part of the official Grav repository.

Check our guide for installing Open-Source plugins.

Configuration

The default configuration can be found at user/plugins/gravy/gravy.yaml:

enabled: true

Usage

After installation, Grav should detect the modular template.

Any Modular page is saved by default with a content collection of @self.modules. You may edit this on the Advanced tab.

You can now start adding modules to the page.

Constructor

The constructor consists of a left sidebar with a list of your theme's modules.

And on the right, a preview of the layout of your page, where you'll be able to drag and drop new modules, move them, resize them and deleting them.

Spicing your Modules

You can customize how the modules are viewed on the Constructor by adding extra metadata to your blueprints.

Current configurations available:

• color: Background color.
• icon: Icon to show.
• demo: A set of initial data that is loaded by default on creating the module.

Example:

title: Glide
icon: fa fa-image
color: "#dfa0ef"
'@extends': default

form:
  fields:
        # Stuff...

demo:
  content: "Lorem ipsum dolor sit amet"
  header:
    button_text: "Go to URL"
    button_url: "#"

Integrating with existing theme

You may want to use Gravy with your current theme, to do so you'll need to integrate partials/gravy.html.twig in to the theme's modular.html.twig.

Gravy provides many helpers to make the integration easier.

The majority of themes will just need to use the layout() macro, by passing a page collection to it.

Internally, the layout() macro will set up a flex container, order the collection by using the Gravy twig filter (collection|gravy) and wrap each module with the module() macro.

Example of Ceevee Theme:

Before:

{% extends 'partials/base.html.twig' %}

{% set show_onpage_menu = header.onpage_menu == true or header.onpage_menu is null %}
{% macro pageLinkName(text) %}{{ text|lower|replace({' ':'_'}) }}{% endmacro %}

{% block content %}
    {{ page.content|raw }}
    <div id="content">
        {% for module in page.collection() %}
                {{ module.content|raw }}
        {% endfor %}
    </div>
{% endblock %}

After:

{% extends 'partials/gravy.html.twig' %}
{% import 'partials/gravy.html.twig' as gravy %}

{% set show_onpage_menu = header.onpage_menu == true or header.onpage_menu is null %}
{% macro pageLinkName(text) %}{{ text|lower|replace({' ':'_'}) }}{% endmacro %}

{% block content %}
    {{ page.content|raw }}
    <div id="content">
        {{ gravy.layout(page.collection()) }}
    </div>
{% endblock %}

Support