Page Monklets

Overview

Monklets are predefined code snippets that allow you to bring in other module content (sermons, events, etc.) into your pages.  There are a few monklets that have been created that are placed in the content area of your pages.

You can use a monklet inside a the content area by placing your cursor in the content area, selecting Insert > Insert Monklet > "Desired Monklet".

Some monklets allow/require inline parameters to be passed to define items from a specific group, category, etc.  http://help.monkcms.com/article/using-monklets/ provides details on using these parameters.

*NOTE - Monklets that are defined with "Page Monklet" in the title can be inserted into the content area of a page.

Page Monklet - Tabs

Using this monklet in the page content area will display additional sections as tabbed content.

Content > Sections

Create the section you would like to use for each tab.  Sections should have unique names and the content will support all normal page styles.

Content > Link Lists

Create a new link list.  Each link in the list will represent a tab.  The link name is the tab name and the description field should contain the slug of the corresponding section.  A slug is the name in lowercase with dashes in place of spaces eg. a section labeled "Tab Example 1" would have the slug format of "tab-example-1".

Inside the Page Content area

You will insert the monklet into the area and you will use the find tag to define which link list to use.  

Style Guide Page Example:

{{page-monklet-tabs|find="tabs-example"}}

Page Monklet - Staff

The monklet will display all members assigned to a specific group.  After you have inserted the monklet into the content area you will use the find_group tag to define which group to display.

Page Monklet - Events (3)

This monklet will display the 3 most recent events published as featured.  You will use the find_category to define which category to display from.  

Monklet Example:

{{page-monklet-events-3|find_category="events"}}

Page Monklet - Serve List

This monklet will displays the 9 most recent events assigned to a specific group.  There are three groups for the serve category "At Church", "In the Community" and "In the World".  The find_group tag should be used with one of these groups.

Monklet Example:

{{page-monklet-serve-list|find_group="in-the-community"}}

Page Monklet - Rotator

This monklet is used to display a rotator within a page area.  The images/slides from the rotator will fill up its container and is primarily used for the New Here template, but can be used on any of your sub pages.  You will use the find tag to define which rotator to use.  The images will need to be as big as the container you are placing the monklet in.   A good rule of thumb would be 1,200px by 630px.

Example Monklet:

{{page-monklet-rotator|find="test-page"}}

Page Monklet - Icon Row

This monklet will display a row of icons and related text from a link list.  This monklet will support between 2 and 6 links.

First you will create the link list.  The custom icons can be created by entering a custom class in the icon class field. A full list of available icons can be found at http://firsteuless.monkpreview2.com/_assets/fonts/icons/ (use http://firsteuless.org/_assets/fonts/icons/ when your site goes live). The icon is followed by the link title, description and a button.  The button text field is used to populate the button label.

After the link list is created you can insert the monklet into your page content area.

Example Monklet:

{{page-monklet-icon-row|find="new-here-icon-row"}}

Page Monklet - Image Row

This monklet will display a row of images with icons and related text from a link list.  This monklet will support between 2 and 6 links.

First you will create the link list.  The custom icons can be created by entering a custom class in the icon class field. A full list of available icons can be found at http://firsteuless.monkpreview2.com/_assets/fonts/icons/ (use http://firsteuless.org/_assets/fonts/icons/ when your site goes live).  The icon is overlaid on top of the image followed by the link title, description and a button.  The button text field is used to populate the button label.  Images are recommended to be 1024px by 576px.  

After the link list is created you can insert the monklet into your page content area.

Example Monklet:

{{page-monklet-image-row|find="new-here-image-row"}}