Shortcodes

THETHE

[showshortcode]

Toggles Shortcode Example

[toggles title="Toggle Group Title" active=1 speed=500]

[toggle title="First toggle title"]First toggle text[/toggle]

[toggle title="Second toggle title"]Second toggle text[/toggle]

[/toggles]

 

Tabs Shortcode Example

[tabs title="Tabs Group Title" active=2 event="click"]

[tab title="First tab title"]First tab content[/tab]

[tab title="Second tab title"]Second tab content[/tab]

[/tabs]

 

Accordion Shortcode Example

[accordions title="Accordion Group Title" active=2 event="click" disabled=false autoheight=true]

[accordion title="Accordion 1 Title"]First accordion section content[/accordion]

[accordion title="Accordion 2 Title"]Second accordion section content[/accordion]

[/accordions]

 

Horizontal Accordion Shortcode Example

[haccordions title="Horizontal Accordion Group Title" width=500 height=320 hwidth=28 speed=200 active=1]

[haccordion title="Fist title"]First accordion content[/haccordion]

[haccordion title="Second title"]Second accordion content[/haccordion]

[/haccordions]

 

JSHORTCODES

 

J Buttons

[jbutton]It's easy[/jbutton]

[jbutton color="gray"]to create[/jbutton]

[jbutton color="orange" size="large" rounded="yes"]cute[/jbutton]

[jbutton color="darkgray" size="large"]buttons[/jbutton]

[jbutton size="xsmall" color="red"]of any[/jbutton]

[jbutton size="xxlarge" color="black"]size[/jbutton]

[jbutton color="blue" rounded="yes"]shape[/jbutton]

[jbutton color="green"]or color[/jbutton]

[jbutton color="pink" icon="love"]with standard icon[/jbutton]

[jbutton color="orange" icon="/_IMAGES/bird-l.png" size="large"]or custom icon[/jbutton]

 

J Boxes

[jbox title="Boxes are just great"]...[/jbox]

[jbox color="red" title="Call to action boxes"]...[/jbox]

[jbox color="blue" title="Box with icon" icon="/_IMAGES/gleb_60x.png" border="5" radius="35" shadow="9"]...[/jbox]

[jbox color="green" title="Feature boxes" icon="/_IMAGES/apple_60x.png"]...[/jbox]

[jbox jbox_css="border:6px solid #7c7c7c;padding-left:2em;" vgradient="#dfdfdf|#ffffff" title="Yet another box with custom gradient, border and shade" radius="10" radius="50" shadow="15"] ... [/jbox]

 

J Columns

[jcolumns] column 1 content [jcol/] column 2 content [/jcolumns]

[jcolumns inbordercss="1px dotted gray"] column 1 content [jcol/] column 2 content [jcol/] column 3 content [/jcolumns]

[jcolumns model="1,2,1"]

column 1 content

[jcol/]

column 2 content (double width)

[jcol/]

column 3 content

[/jcolumns]

[jcolumns inbordercss="2px solid gray"] column 1 content [jcol/] column 2 content [jcol/] column 3 content [jcol/] column 4 content [/jcolumns]

[jcolumns model="4,2,1" inbordercss="3px double gray"] column 1 content [jcol/] column 2 content [jcol/] column 3 content [/jcolumns]

[jcolumns model="1,2,3,2,1" inbordercss="1px solid gray" outbordercss="4px solid #666666" topbordercss="4px solid #666666" bottombordercss="4px solid #666666"] column 1 content [jcol/] column 2 content [jcol/] column 3 content [jcol/] column 4 content [jcol/] column 5 content [/jcolumns]

 

AJAX CALENDAR

 

[calendar] and [eventlist] optional parameters

 

categories = "1,2,3" [one or more comma separated category ids]

defaults to all categories when unassigned

Display events from the specified category id(s)

 

excluded = true [true]

defaults to false when unassigned

Exclude categories listed in the categories parameter from being displayed

 

[calendar] only optional parameters

 

filter = 3 [integer | false]

defaults to all when unassigned

Highlight the specified category id in the filter, and display only those events in the calendar - input false to hide the filter

 

view = "basicDay" [basicDay | agendaDay | basicWeek | agendaWeek | month]

defaults to month when unassigned

Display the specified calendar view

 

month = 10 [integer]

defaults to current month when unassigned

Display the specified calendar month on load

 

year = 2001 [four digit integer]

defaults to current year when unassigned

Display the specified calendar year on load

 

views = "agendaDay, basicWeek" [one or more comma separated view labels | false ]

defaults to "month,agendaWeek" when unassigned

Display the specified view options in the calendar header - input false to hide the default view options

 

nav = false [false]

defaults to true when unassigned

Display calendar navigation buttons

 

scroll = true [true]

defaults to false when unassigned

Activate calendar mousewheel navigation

 

height = 200 [integer]

defaults to automatic when unassigned

Assign a minimum pixel height to the calendar

 

mini = true [true]

defaults to false when unassigned

Display the calendar as a minicalendar, displays nicely when applied within a sidebar or footer text widget

 

 

[eventlist] only optional parameters

 

start = "2011-07-10" [date]

defaults to today when unassigned

Display events starting on or after the specified date (yyyy-mm-dd date format required)

 

end = "+2 Weeks" [date | [Day | Week | Month | Year] intervals]

defaults to "+1 Year" when unassigned

Display events ending on or before the specified date or date interval (yyyy-mm-dd date format required)

 

limit = 15 [integer]

defaults to 4 when unassigned

Limit events displayed to the specified quantity

 

whitelabel = true [true]

defaults to false when unassigned

Render events without category colors

 

noresults = "No Results" [text]

defaults to "No Upcoming Events" when unassigned

Display this message when no events are returned

 

 

Examples

[calendar categories="1,2,3" filter=2 month=8 views=false scroll=true]

[eventlist categories="1,2,3" excluded=true start="2011-09-01' end="+3 Weeks" limit=5 noresults="No Events Available"]

 

 

 

jQuery Collapse-O-Matic

 

Basic Shortcode

 

[expand title="Trigger Text"]Target Content[/expand]

[expand title="Open" swaptitle="Close"]Target Content[/expand]

[expand title="On" swaptitle="Off"] [/expand]

[expand title="Open" trigpos="below"]Target Content[/expand]

[expand title="Pocket Calculator" id="kraftwerk"]Target Content[/expand]

[expand title="Vader" expanded="true"]Target Content[/expand]

 

Tag Attribute

 

[expand title="A Long Time Ago" tag="h4"]Target Content[/expand]

[expand title="<img src='falcon_girl.jpg' />" tag="div"]Target Content[/expand]

 

The tag attribute replaces the default span tag that wraps the trigger text.

Alt Attribute

 

[expand title="Imperial Starfleet" alt="Empire Strikes Back"]Target Content[/expand]

[expand title="A New Hope" trigclass="highlight"]Target Content[/expand]

[expand title="Jedi" trigclass="arrowright"]Target Content[/expand]

[expand title="Sith" trigclass="noarrow"]Target Content[/expand]

[expand title="The Empire Strikes Back" targclass="highlight"]Target Content[/expand]

[expand title="Star Wars" rel="fiction"]Target Content[/expand]

[expand title="Star Trek" rel="fiction"]Target Content[/expand]

[expand title="Battlestar Galactica" rel="fiction"]Target Content[/expand]

[expand title="Space Race" rel="history"]Target Content[/expand]

[expand title="Ansari X Prize" rel="history"]Target Content[/expand]

[expand title="Monkeys" rel="animal-highlander"]Target Content[/expand]

[expand title="Donkeys" rel="animal-highlander"]Target Content[/expand]

[expand title="Root Level"]

[expandsub1 title="Nested Level 1"]

[expandsub2 title="Nested Level 2"]

[expandsub3 title="Nested Level 3"]

[expandsub4 title="Nested Level 4"]

[expandsub5 title="Nested Level 5"]

[expandsub6 title="Nested Level 6"]

[expandsub7 title="Nested Level 7"]

[/expandsub7]

[/expandsub6]

[/expandsub5]

[/expandsub4]

[/expandsub3]

[/expandsub2]

[/expandsub1]

[/expand]

Root Level

 

Expand / Collapse All Triggers

 

<span class="expandall">Expand All</span>

<span class="collapseall">Collapse All</span>

 

Expand and collapse all elements with one trigger. The triggers may be any type of HTML tag as long as they have a class of either expandall or collapseall.

Expand / Collapse All Grouped

 

<span rel="fiction">Expand All</span>

<span class="collapseall" rel="fiction">Collapse All</span>

Expand All Fiction

Collapse All Fiction

 

Expand and collapse all elements belonging to the same group with one trigger. The triggers may be any type of HTML tag as long as they have a class of either expandall or collapseall and the same rel attribute of the target group.

Excerpt Attribute

 

[expand title="Laugh It Up, Fuzzball" excerpt="Laugh It Up, Fuzzball: The Family Guy Trilogy"]Target Content[/expand]

Laugh It Up, Fuzzball

Laugh It Up, Fuzzball: The Family Guy Trilogy

 

Use the excerpt attribute to display a teaser, or short nibble of text that hints at the content of the collapsed target text.

Excerptpos Attribute

 

[expand title="Harvest Moon" excerpt="The Family Guy - Blue Harvest" excerptpos="above-trigger"]Target Content[/expand]

The Family Guy - Blue Harvest

Blue Harvest

 

Use the excerptpos attribute to position the expert in one of three locations:

 

above-trigger

below-trigger (default)

below-target

 

Excerptclass Attribute

 

[expand title="Something, Something, Something, Dark Side" excerpt="The Family Guy parody of The Empire Strikes Back" excerptclass="highlight"]Target Content[/expand]

 

Excerpttag Attribute

 

[expand title="It's a Trap!" excerpt="The Family Guy parody of Return of the Jedi" excerpttag="h2"]Target Content[/expand]

 

The excerpttag attribute replaces the default div tag that wraps the excerpt text.

Internal Collapse Trigger

 

[expand title="R2 may have been stolen" id="stolenr2"]Target Content <span class="collapseomatic colomat-close" id="bot-stolenr2">click here to close</span>[/expand]

R2 may have been stolen

 

A second trigger element can be placed anywhere within the expanded content that will trigger a collapse. To accomplish this:

 

The expand tag must have an ID defined

The second internal trigger element must be assigned a class of collapseomatic

To have the arrow point up, rather than down, add the class of colomat-close to the second trigger element

The second trigger element must have and ID that is the same as the trigger pre-appended with “bot-”. For examaple: if the trigger has an ID of “r2d2″ then the second trigger id must look like: id=”bot-r2d2″.

 

 

Roll Your Own Collapse Elements

 

With the plugin installed, any two elements can rolled into a triger/target collapse-o-matic pair. To accomplish this, simply keep the following in mind:

 

The trigger element has to be wrapped in an element with the class of “collapseomatic” and a unique id.

The target element must have an ID that is the same as the trigger pre-appended with “target-”. For examaple: if the trigger has an ID of “kraftwerk” then the matching target ID must look like: id=”target-kraftwerk”.

 

A roll-your-own example that places the trigger below the target:

 

<div id="target-monkey1">You might think you can catch a monkey, but you can't. Monkeys are FAST!</div>

<span class="collapseomatic" title="Fast Monkey" id="monkey1" >Fast Monkey</span>

<span id="swap-monkey1" style="display: none;">Eek Eek</span>

 

A roll-your-own example that uses an image as the trigger:

<img src="falcon_girl.jpg" id="falcongirl" class="collapseomatic noarrow" />

<div id="target-falcongirl">Goin' Solo</div>

 

SITE MAP

 

[simple-sitemap]

 

 

POST UI TABS

 

[tab name="Your tab name 1"]Your tab content[/tab]

[tab name="Your tab name 2"]Your tab content[/tab]

[tab name="Your tab name 3"]Your tab content[/tab]

[end_tabset]

 

 

NG GALLERY

 

For a slideshow :[ slideshow id=x w=width h=height ]

For a album : [ album id=x template=extend] or [ album id=x template=compact ]

For a gallery : [ nggallery id=x ]

[ nggallery id=2 template=carousel images=7 ]

[ nggallery id=1 template=caption ]

[ nggallery id=1 template=sample1 ] to sample6

 

For a single picture : [ singlepic id=x w=width h=height mode=web20|watermark float=left|right ]

For a image browser : [ imagebrowse r id=x ]

To show image sorted by tags :[ nggtags gallery=mytag,wordpress,... ]

To show tag albums : [ nggtags album=mytag,wordpress,... ]

 

[ random max=2 ]

[ recent max=4 ]

 

[ singlepic id=x w=width h=height mode=web20|watermark float=left|right ]

(without the spaces after/before the brakes)

 

» id : this is the image id

» width : max. width (the resize method work propotional)

» height : max. height

» mode (optional) :

» “web20” : added a refelection effect

» “watermark” : added a watermark, defined in the settings

» float (optional) :

» “left” : added CSS style float: left;

» “right” : added CSS style float: right;

Example :

[ singlepic id=x h=height w=weight mode=web20 ]

(without the spaces after/before the brakes)

 

[ singlepic id=1 w=320 h=240 mode=watermark ]

(without the spaces after/before the brakes)

 

 

 

LIST PAGES

 

List pages sorted by title

[list-pages sort_column="post_title"]

 

List pages but exclude certain IDs and set the class of the list to "my-page-list"

[list-pages exclude="17,38"]

 

List the current page's children, but only show the top level

[child-pages depth="1"]

 

List the current page's siblings and their subpages

[sibling-pages depth="2"]

 

 

GET POSTS

 

Provides a [moka-get-posts] shortcode for displaying posts or pages using the get_posts function. The shortcode accepts most parameters that you can pass to the get_posts() function. Additional arguments are: show_fields="post_content,post_excerpt,post_thumbnail" (use post properties; additional fields include post_thumbnail and post_permalink), thumbnail_size="large" (default: "thumbnail" to set post_thumbnail size), and permalink_title (default: "true" to wrap title in permalink). To show posts or pages, add [get-posts category="NN"] in the page or post body. To get pages, use the post_type parameter, e.g., [moka-get-posts post_type="page"]. You can also pass a template using shortcode content. Use the %post_title% format to have fields substituted. Substitution fields most be listed in the "show_fields" argument.

 

The default values are the same as for the get_posts() function (http://codex.wordpress.org/Template_Tags/get_posts) with the following exceptions:

 

Standard Attributes 'numberposts' => -1, 'orderby' => 'post_date', 'order' => 'DESC', 'post_type' => 'post', 'post_parent' => '',

 

Note: 'post_parent' also supports a non-standard "this" value, which will use the current post or page as its argument.

 

Non-Standard Attributes

'show_fields' => 'post_title',

 

Selects fields to include in output. By default, post_title is shown. Other options are: post_excerpt, post_content, post_thumbnail, post_permalink

 

'thumbnail_size' => 'thumbnail',

 

If 'post_thumbnail' is used in 'show_fields', this will determine the size of the thumbnail.

 

'permalink_title' => 'true',

 

If true, wrap post_title with post_permalink.

 

'class_name' => 'get-posts',

 

Can use an alternate classname for the wrapping div. Use if a template is not provided.

 

'numberposts' => 5, 'offset' => 0, 'category' => , 'orderby' => 'post_date', 'order' => 'DESC', 'include' => , 'exclude' => , 'meta_key' => , 'meta_value' => , 'post_type' => 'post', 'post_mime_type' => , 'post_parent' => , 'post_status' => 'publish' );

 

[/showshortcode]

 

 

 

 

 

SHARE THIS