Site Styles

Typography
Shortcodes

This is an H1 Header

Collaboratively administrate empowered markets via plug-and-play networks. Dynamically procrastinate B2C users after installed base benefits. Dramatically visualize customer directed convergence without revolutionary ROI.

This is an H2 Header

Efficiently unleash cross-media information without cross-media value. Quickly maximize timely deliverables for real-time schemas. Dramatically maintain clicks-and-mortar solutions without functional solutions.

This is an H3 Header

Completely synergize resource sucking relationships via premier niche markets. Professionally cultivate one-to-one customer service with robust ideas. Dynamically innovate resource-leveling customer service for state of the art customer service.

This is an H4 Header

Objectively innovate empowered manufactured products whereas parallel platforms. Holisticly predominate extensible testing procedures for reliable supply chains. Dramatically engage top-line web services vis-a-vis cutting-edge deliverables.

This is an H5 Header

Proactively envisioned multimedia based expertise and cross-media growth strategies. Seamlessly visualize quality intellectual capital without superior collaboration and idea-sharing. Holistically pontificate installed base portals after maintainable products.

This is an H6 Header

Phosfluorescently engage worldwide methodologies with web-enabled technology. Interactively coordinate proactive e-commerce via process-centric “outside the box” thinking. Completely pursue scalable customer service through sustainable potentialities.

Block quote: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut orci tortor, gravida id risus in, ultrices commodo libero. Donec et consequat velit. Integer suscipit ultrices placerat. Aenean consectetur molestie lobortis. Fusce vestibulum nunc ligula, in vulputate velit aliquet vehicula. Donec et felis felis. Ut rutrum commodo risus nec semper. Integer pharetra suscipit felis sit amet faucibus. Nulla non dapibus mauris. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Regular Link

Unordered List Item
Unordered List Item
- Unordered List Item
  - Unordered List Item
Unordered List Item

Ordered List Item
Ordered List Item
1. Ordered List Item
  1. Ordered List Item
Ordered List Item

Preformatted text. You can use
line breaks and every-
thing in here and it should keep it. Even <html> tags.

There are several shortcodes available in this theme that we will document below. When we describe how to use them, we will use the following terms (lets use the above example for reference).

tag name – button It will always follow the opening bracket.
attribute – type=”primary” There can be multiple attributes in a shortcode (separated by spaces). Each consists of 3 parts, the name (style), the equals sign, and the value which is contained in double quotes (“primary”). When referring to the attribute in this example, we may say “the ‘type’ attribute has a value of ‘primary'”.
content – Button Text This is the content that is between the opening and closing tags.

The third row of the editor contains some shortcuts for writing some of these shortcodes.

We will provide as many examples as we can below, but, the best example is just hitting the “Edit Page” button above. This whole page is just one big example.

HTML Nerd Alert:
Most of these shortcodes will apply any undocumented attributes directly to the containing element, so you can add your own class, id and any other appropriate html attributes.

Columns

The theme is built with 12 column grid system. You can create layouts based on this grid by using the row and col shortcodes. Here is an example below:

This is one fourth (or span=”3″)

This is one half (or span=”6″)
and it has a nested row:

Edit this page to see how this is accomplished

A nested span=”6″

This is one fourth (or span=”3″)

Please note that the total of the “span” attributes for each column should add up to 12.

WordPress Nerd Alert:
You don’t need to worry about extra line breaks or spaces between the shortcodes! We hate unreadable content and having all the shortcodes on one line, so we designed our shortcodes to be wicked smart and ignore any extra space between them. Your welcome 😉

Tabs

Tabs are nice way to display a lot of information in a small amount of space. Please see the source for this page to see some examples.

Top Tabs

Tooltips

This a sentence with a tooltip.

This is another sentence, but the tooltip is an icon .

Popovers

This a sentence with a popover.

This is a popover triggered by an icon

Alerts

Basic Alert Message

Error Alert Message

Success Alert Message

Did you know that you can include a Button within an alert?

Accordion

Accordion Heading 1

You see? It’s curious. Ted did figure it out – time travel. And when we get back, we gonna tell everyone. How it’s possible, how it’s done, what the dangers are. But then why fifty years in the future when the spacecraft encounters a black hole does the computer call it an ‘unknown entry event’? Why don’t they know? If they don’t know, that means we never told anyone. And if we never told anyone it means we never made it back. Hence we die down here. Just as a matter of deductive logic.
Accordion Heading 2

Now that we know who you are, I know who I am. I’m not a mistake! It all makes sense! In a comic, you know how you can tell who the arch-villain’s going to be? He’s the exact opposite of the hero. And most times they’re friends, like you and me! I should’ve known way back when… You know why, David? Because of the kids. They called me Mr Glass.
Accordion Heading 3

Like you, I used to think the world was this great place where everybody lived by the same standards I did, then some kid with a nail showed me I was living in his world, a world where chaos rules not order, a world where righteousness is not rewarded. That’s Cesar’s world, and if you’re not willing to play by his rules, then you’re gonna have to pay the price

Buttons

There are several “type” options for buttons:

primary info warning success danger

You can also use the “size” attribute:

mini small default large

Even a full width button:

class=”btn-block”

Make it a link by adding an “href” attribute:

Go to Google

Radiac Abrasives