Type a simple [shortcode] into one of your Posts or Pages and WordPress will insert a fancy object, such as an accordion or push-button, fully styled and ready to use without you having to write any HTML or CSS!
For example, to insert a button all you need to do is type out the shortcode [rp_button] in your Page or Post, and when published, a fully styled button appears on your website. We’ve kept our examples very short and simple, but you can, of course, customize these shortcodes further by specifying attributes inside the shortcode brackets [ ].
Featured Tip: Rapid shortcodes are responsive! Resize your browser while viewing this page to see how the Rapid Platform seamlessly adapts it’s layout for smaller screen sizes – all the way down to an iPhone 3GS viewed in portrait orientation.
Button
Basic usage:
[rp_button]
Features:
- Buttons can be linked to other pages or shortcode actions.
- Icons are provided through CSS sprites or Fontello icon packs.
- Pure CSS animations.
- caption, link, width, class
Example 1: [rp_button] yields:
This button doesn’t actually do anything since none of the attributes have been specified.
Example 2: [rp_button caption="Google" link="http://www.google.com" class="icon-gplus"] yields:
This button navigates to Google when clicked because the link attribute has been specified.
Horizontal Bar
Basic usage:
[rp_hbar]
Features:
- The horizontal bar is by far the easiest way to visually divide vertically stacked content.
- class
Example 1: [rp_hbar]
Example 2: [rp_hbar class="rp-hbar-style-crease"]
Example 3: [rp_hbar class="rp-hbar-style-float"]
Example 4: [rp_hbar class="rp-hbar-style-stitch"]
Example 5: [rp_hbar class="rp-hbar-style-crease2"]
Callout
Basic usage:
[rp_callout]
Features:
- Callouts add flare to plain text or HTML, demanding more attention from the reader.
Example 1: [rp_callout][/rp_callout]
Example 2: [rp_callout class="rp-callout-style-wave"][/rp_callout]
Accordion / Toggled Content
Basic usage:
[rp_accordion]
Features:
- Accordions are useful for condensing information that would normally clutter the page, while still allowing that information to be accessed.
- Use text, HTML or even shortcodes inside the Accordion.
- title, width, title_float, icon_float, title_color
Example 1: [rp_accordion /][rp_accordion /] yields:
Two calls to the accordion shortcode create an accordion-like expanding effect. Note the use of a trailing backslash /, required for self-enclosing shortcodes such as this one.
Example 2: [rp_accordion title="This is my custom title" title_float="center" icon_float="none" title_color="blue" class="accordion-button-style-perforated"]This is my custom text.[/rp_accordion] yields:
The inner text is set by wrapping plain text or HTML inside opening and closing shortcodes.
Likert Scale
Basic usage:
[rp_likert]
Features:
- Customizable start/end labels via attributes.
- Reverse or Randomize the Start/End points via attributes.
- Utilizes a hidden <select> element for storing and submitting likert value to the server.
- labels, start_text, end_text, reverse
Example 1: [rp_likert] yields:
Image List
Basic usage:
[rp_list]Custom content.[/rp_list]
Description:
Display a list of items with an image floated to the left.
Features:
- Useful for making fancy bullet lists.
- Uses a single image or a CSS image sprite with coordinates or an image map with coordinates or a Fontello icon pack.
- count, span
Example 1: [rp_list]List content.[/rp_list][rp_list]List content.[/rp_list][rp_list]List content.[/rp_list] yields:
List content.
List content.
List content.
Caption Box
Basic usage:
[rp_caption_box]
Features:
- Useful for displaying a captioned image.
- title, count, link
Select Bar
Basic usage:
[rp_select_bar][/rp_select_bar]
Description:
This shortcode uses CSS3 transparency to create a one-step colorization technique. All that’s required is a single color value.
Features:
- Start/End labels are customizable via shortcode attributes
- Reverse or Randomize the Start/End points via shortcode attribute
- Colors can be specified as HTML Color Names (indianred) or HTML Hex Values (#23fc12).
- Utilizes a hidden <select> element for storing and submitting likert value to the server.
- bgcolor
Example 1: [rp_select_bar] yields:
Example 2: [rp_select_bar bgcolor="darkblue"] yields:
Example 3: [rp_select_bar bgcolor="indianred"] yields:
Grid (Responsive Columns)
Basic usage:
[rp_grid][/rp_grid]
Description:
WordPress doesn’t allow nesting shortcodes of the same type. To work around this, Rapid Platform creates several aliases for the shortcode so the same shortcode can be called using a different shortcode name.
Features:
- Nest columns inside other columns using the included shortcode aliases (rp_grid_nest0, rp_grid_nest1, etc).
- No need to use separate _first or _last shortcodes like some other frameworks out there.
- No need to use separate _half or _third shortcodes like some other frameworks out there. One shortcode handles all column layouts.
- count, span
Example 1: [rp_grid count="2" span="1"][rp_button][/rp_grid][rp_grid count="2" span="1"][rp_button][/rp_grid] yields:
Example 2: [rp_grid_nest2 count="3" span="1"][rp_button][/rp_grid_nest2] yields:
Example 3: Nested Columns
A) Left
B) Left
C) Left
C) Right
B) Right
A) Right