Site Toolbox Documentation

Learn how to use the plugins in Site Toolbox

Found an issue or a problem that you can't find an answer for? Create an issue in our Premium Issue Tracker.

Before you start

Before you can install a Premium Plugin, you are required to have the License Manager plugin installed. It is a free plugin available in GPM and can be installed like any other through the Plugin section of the admin plugin, or via command line.

$ bin/gpm install license-manager

Installation

First ensure you are running the latest version of Grav 1.6 or Grav 1.7 (-f forces a refresh of the GPM index).

$ bin/gpm selfupgrade -f

These plugins are available via GPM, and you can install them in one go via the CLI:

$ bin/gpm install svg-icons warm-cache zapier-rss

The Warm Cache plugin makes use of the sitemap plugin to function properly, so allow installation when prompted.

You can also install the theme via the Plugins section in the admin plugin.

SVG Icons

This package currently contains 3 primary SVG icon sets:

Configuration

  • Plugin status → Will enable or disable the entire plugin.

Shortcode for Content

When you need to use an SVG icon in your content, you can use the shortcode. Here are some examples:

[svg-icon="alien" /]

This is the quickest most basic approach. This will use the default tabler SVG icon set. Note, no extension is required for the icon name as they are all SVGs.

[svg-icon=award set="tabler" /]

Another example with an explicit set defined and no trailing slash.

[svg-icon icon="atom" /]

The more commonly used approach with icon specifically defined.

[svg-icon icon="battery-4" set="tabler" /]

Icon and set defined, but no trailing slash.

[svg-icon icon="badge-check" class="w-12" set="heroicons|solid" /]

Example from HeroIcons / Solid and a TailwindCSS class of w-12 to specify a width.

[svg-icon icon="shield-check" class="w-12 h-12 text-blue-600" /]
Grav icon Apple icon Ferrari icon SpaceX icon

Example of some popular brands from Simple Icons.

[svg-icon icon="grav" class="w-8" set="brands" /]
[svg-icon icon="apple" class="w-8" set="brands" /]
[svg-icon icon="ferrari" class="w-8" set="brands" /]
[svg-icon icon="spacex" class="w-8" set="brands" /]

More complex example with TailwindCSS classes for width/height and also a color.

[svg-icon icon="shield-check" class="w-24 h-24 text-red-500 stroke-1 transform rotate-90" /]

Just showing off now with vector stroke modified and a custom rotation.

Twig Function for Templates

Using the plugin directly from Twig templates is a little different. There's an svg_icon() twig function available to use but it only takes a path to the SVG icon, plus classes. Some examples include:

{{ svg_icon('tabler/plus.svg', 'h-6 w-6 text-gray-600 stroke-3/2')|raw }}

This is using the tabler/plus.svg icon with various TailwindCS classes for width, height, color and stroke. Note the use of |raw filter at the end. This is important as the output is the raw inline HTML of the SVG.

{{ svg_icon('heroicons/outline/star.svg', 'current-color h-8 w-8')|raw }}

Here we are using the star.svg from HeroIcons in Outline style. The classes use the current color.

Warm Cache

Configuration

  • Plugin status → Will enable or disable the entire plugin. When disabled, no tray icon will display.

  • Sitemap URL → This defaults to the value set in the Sitemap plugin

  • Enable Quicktray → Enables or disables the quicktray icon to trigger an Ajax-powered warm-cache call of your site.

  • Quicktray Icon → Allows you to override the default tachometer icon with a different Fontawesome icon

  • onCacheClear Events → When enabled, Clearing the Cache either via Admin or CLI will then trigger a warm-cache call.

  • Show Count in Results → By default the number of pages that were warmed shows in the results of the call. This can be disabled.

  • Log Results → The results of the cache clear can be logged for debugging errors.

  • User Agent → This is the string set by the crawler that hits each page. You can configure this or use it to filter out these cache-warming calls from your analytics data.

Zapier RSS

Configuration

Before configuring this plugin, you should copy the user/plugins/zapier-rss/zapier-rss.yaml to user/config/plugins/zapier-rss.yaml and only edit that copy.

Here is the default configuration and an explanation of available options:

enabled: true                                                 # plugin enabled
active: false                                                 # default zapier state
template: zapier-feed.zrss.twig                               # TWIG template to use
description: For Zapier RSS integration with other services   # Description
limit: 20                                                     # Number of items to include
length: 1000                                                  # Number of chars per item
order:                                                        # Ordering of items
  by: date
  dir: desc

Note that if you use the Admin Plugin, a file with your configuration named zapier-rss.yaml will be saved in the user/config/plugins/-folder once the configuration is saved in the Admin.

Usage

Simply install the plugin and then the URL you would use to integrate with would be your existing blog page with the new .zrss extension appended to it:

http://yoursite.com/your/blog.zrss

This ensures the feed uses the custom templates/zapier-feed.zrss.twig file to process. To modify this Twig file, simply copy it into your theme or plugin's templates/ folder and modify as you like.

You can override the regular collection properties, or any of the other config options at the blog level, by modifying the frontmatter of the page that contains the collection. For example:

---
title: 'My Blog'
header_image: custom_header.jpg
content:
    items:
        - self@.children
    order:
        by: date
        dir: desc
    limit: 8

zapier-rss:
    active: true
    description: 'My Custom Zapier ZRSS Feed'
    template: 'zapier-custom-feed.rss.twig'
    limit: 20
    length: 500
---

You can also control if a particular item in the collection should not be included in this feed by skipping it:

---
title: 'My Blog Post"

zapier-rss:
    skip: true
---