8.1 KiB

Raw Blame History

title

media_order

private

date

taxonomy

cache_enable

visible

creator

external_links

sitemap

shortcode

11.png

true

09:34 20-03-2018

Shortcode-ui

[ui-browser address="https://getgrav.org"][/ui-browser]

Available Shortcodes

This plugin provides a variety of plugins, each with a specific purpose:

Tabs

An example of the Tabs shortcode is as follows:

[ui-tabs position="top-left" active="0" theme="lite"] [ui-tab title="First Tab"] In tempor sed sapien eu porttitor. Aliquam cursus facilisis ante. Etiam neque nunc, blandit vel lacus et, faucibus accumsan lacus. Proin posuere varius purus quis faucibus. Quisque et enim vitae orci [placerat tincidunt](#) id ac eros. Fusce et gravida libero. Phasellus cursus odio ex, in **mattis lorem tincidunt** vel. Donec nibh odio, dapibus non ligula a, semper ornare massa. Nulla consectetur eu nunc sed ultrices. Integer at turpis dolor. [/ui-tab] [ui-tab title="Second Tab"] In tempor sed sapien **eu porttitor**. Aliquam cursus facilisis ante. Etiam neque nunc, blandit vel lacus et, faucibus accumsan lacus. Proin posuere varius purus quis faucibus. [Quisque et enim](#) vitae orci placerat tincidunt id ac eros. Fusce et gravida libero. Phasellus cursus odio ex, in mattis lorem tincidunt vel. [Donec nibh odio](#), dapibus non ligula a, semper ornare massa. Nulla consectetur eu nunc sed ultrices. Integer at turpis dolor. [/ui-tab] [/ui-tabs]

[ui-accordion independent=true open=all] [ui-accordion-item title="Section 1"] Bacon ipsum dolor amet beef burgdoggen shoulder, meatball prosciutto kevin brisket chicken turkey. Kevin rump pancetta short loin capicola brisket landjaeger fatback picanha pork belly ribeye. Strip steak chuck turducken kevin t-bone ribeye cupim capicola alcatra rump. Venison pork chop biltong cupim pig rump meatloaf sausage pork. Strip steak kevin tongue brisket ball tip, venison turducken flank frankfurter corned beef pancetta fatback drumstick ham. Drumstick pastrami leberkas meatball flank tongue turkey ground round pork belly doner frankfurter porchetta jowl. [/ui-accordion-item] [ui-accordion-item title="Section 2"] Short loin swine shankle flank picanha andouille burgdoggen landjaeger hamburger drumstick. Beef ham tail, tri-tip flank ham hock meatball picanha corned beef t-bone shank turkey ball tip shoulder. Flank corned beef chicken, meatloaf venison ball tip ham hock tail salami jowl short ribs pork belly drumstick. Meatball chicken hamburger beef filet mignon doner pork picanha pork chop fatback rump ham tri-tip ball tip landjaeger. Sausage leberkas shoulder tongue short loin shankle. Prosciutto tri-tip frankfurter shoulder drumstick capicola. Pork loin shank strip steak pork belly tongue cow. [/ui-accordion-item] [ui-accordion-item title="Section 3"] Bacon ipsum dolor amet beef burgdoggen shoulder, meatball prosciutto kevin brisket chicken turkey. Kevin rump pancetta short loin capicola brisket landjaeger fatback picanha pork belly ribeye. Strip steak chuck turducken kevin t-bone ribeye cupim capicola alcatra rump. Venison pork chop biltong cupim pig rump meatloaf sausage pork. Strip steak kevin tongue brisket ball tip, venison turducken flank frankfurter corned beef pancetta fatback drumstick ham. Drumstick pastrami leberkas meatball flank tongue turkey ground round pork belly doner frankfurter porchetta jowl. [/ui-accordion-item] [/ui-accordion]

Grav Shortcode Assets Plugin

shortcode-assets is a Grav plugin that provides a convenient way to add CSS and JS assets directly from your pages.

Installation

Installing the Shortcode Assets plugin can be done in one of two ways. Our GPM (Grav Package Manager) installation method enables you to quickly and easily install the plugin with a simple terminal command, while the manual method enables you to do so via a zip file.

GPM Installation (Preferred)

The simplest way to install this plugin is via the Grav Package Manager (GPM) through your system's Terminal (also called the command line). From the root of your Grav install type:

bin/gpm install shortcode-assets

This will install the Shortcode Assets plugin into your /user/plugins directory within Grav. Its files can be found under /your/site/grav/user/plugins/shortcode-assets.

Config Defaults

enabled: true

If you need to change any value, then the best process is to copy the shortcode-assets.yaml file into your users/config/plugins/ folder (create it if it doesn't exist), and then modify there. This will override the default settings.

Usage

Once the plugin is installed you can use the following syntax in your page content to add various asset types [css, inlineCss, js, inlineJs]:

<code>
[assets=css] custom-style.css /blog/some-blog/post/style.css //cdnjs.cloudflare.com/ajax/libs/1140/2.0/1140.css http://somesite.com/js/cookies.min.css [/assets]

[assets=js] custom-script.js /blog/some-blog/post/script.js //cdnjs.cloudflare.com/ajax/libs/1140/2.0/1140.min.js http://somesite.com/js/cookies.min.js [/assets]

[assets=inlineCss] h1 {color: red !important;} [/assets]

[assets=inlineJs] function initialize() { var mapCanvas = document.getElementById('map_canvas'); var mapOptions = { center: new google.maps.LatLng(44.5403, -78.5463), zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP } var map = new google.maps.Map(mapCanvas, mapOptions); } [/assets]

</code>

Advanced

The Shortcode Assets plugin supports all the available options That the Grav Asset Manager supports. You can specify priority, pipeline and media for CSS files, and priority, pipeline, loading, and group for JS files.

For example:

<code>

[assets=css priority=100 pipeline=false]custom-style.css[/assets]
[assets=js loading="async defer" group="bottom"]custom-script.js[/assets]