Shortcodes
Reactor comes packed with shortcodes. It even has a shortcode generator built into the WordPress Editor. Look for the [R] icon.
Alerts
[alert type="(success/secondary/alert)" shape="(radius/round)" close="(true/false)"][/alert]This is a standard alert (div.alert-box).x
This is a success alert without closing X (div.alert-box.success).
This is an alert (div.alert-box.alert.round).x
This is a secondary alert (div.alert-box.secondary.radius).x
Buttons
[button url="" size="(tiny/small/medium/large)" type="(success/secondary/alert)" shape="(radius/round)" expand="(true/false)" disabled="(true/false)" target=""][/button]Labels
[label type="(success/secondary/alert)" shape="(radius/round)"][/label]Panels
[panel callout="(true/false)" shape="(radius/round)"][/panel]This is a regular panel.
It has an easy to override visual style, and is appropriately subdued.
This is a callout panel.
It’s a little ostentatious, but useful for important content. Oh and it has a border radius.
Pricing Tables
[price_table title="" price="" desc="" button="" url=""]
[pt_item][/pt_item]
[/price_table]- Standard
- $99.99
- An awesome description
- 1 Database
- 5GB Storage
- 20 Users
Progress Bars
[progress_bar type="(success/secondary/alert)" shape="(radius/round)" columns="(the width in columns)" fill="(amount in percent)"][/progress_bar]Grid
[column large="(columns for large screens)" small="(columns for small screens)" first_last="(first or last in row first/last)"][/column]large-4 small-2
large-4 small-4 small-4
large-4 small-6
large-3
large-6
large-3
large-2
large-8 small-6
large-2
small-3
small-9
large-4
large-8
small-6 large-5
small-6 large-7
large-6
large-6
Tooltips
[tooltip position="(top/bottom/right/left)" width="(a number for width)" text="(text for the tooltip)"][/tooltip]The tooltips can be positioned on the “tip-bottom”, which is the default position, “tip-top” (hehe), “tip-left”, or “tip-right” of the target element by adding the appropriate class to them. You can even add your own custom class to style each tip differently. On a small device, the tooltips are full width and bottom aligned.
Reveal Modals
[reveal_modal button="(true/false)" text="(text for link)"][/reveal_modal]Sections
[section_group type="(tabs/accordion/veritcal-nav/horizontal-nav)"]
[section][/section]
[/section_group]Tabs
Section 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Section 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Section 3. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Accordion
Section 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Section 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Section 3. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Vertical Nav
Horizontal Nav
Orbit Slider
[orbit_slider id="(id for surrounding div)" category="(a slide category)" orderby="(default is date)" slides="(number of slides default is all)"][/orbit_slider]
