Responsive Grid Shortcode

Description

The plugin utilizes the 12 column responsive grid CSS from http://www.responsivegridsystem.com/ with the default 1.6% margin and 480PX media query.

Major features in Responsive Grid Shortcode include:

  • Responsive grids up to 12 columns
  • Add classes to each column or section for precise control over styles.
  • Simple to use shortcode. All you have to know is how to count to 12!

The shortcode are extremely simply to follow as they follow as you can see below.

[grid_section]

[grid_col size=4]
    First Col Content
[/grid_col]

[grid_col size=4]
    Second Col Content
[/grid_col]

[grid_col size=4]
    Third Col Content
[/grid_col]

[/grid_section]

NOTE: The one thing to keep in mind is that all the column sizes inside a section MUST equal 12.

Some things that you should note. Responsive Grid Shortcode default to size 6 if no size attribute is provided.
An example of this is below:

[grid_section]

[grid_col]
    Left Side
[/grid_col]

[grid_col]
    Right Side
[/grid_col]

[/grid_section]

FYI: The column size can be any number. The each size value represents {size} of 12.

OPTIONS

We kept the options extremely simple to make sure the system is light weight.

[grid_section class=custom-class]

  • class – You can provide a custom class to the section if you choose.

[grid_col size=4 class=custom-class]

  • class (optional) – You can provide a custom class to the column if you choose.
  • size (optional) – number out of 12. (2 = 2 out 12 | 3 = 3 out of 12)

Example

`
[grid_section class=my-grid]

[grid_col size=8]The size of this colum is 8[/grid_col]
[grid_col size=4]The size of this column is 4.[/grid_col]

[/grid_section]
`

Notice that the column sizes when added up equal 12.

Screenshots

  • Easy and simple responsive 3 column layout

Installation

  1. Upload responsive-grid-shortcode to the /wp-content/plugins/ directory
  2. Activate the plugin through the ‘Plugins’ menu in WordPress and you are ready to rock!

FAQ

Where can I go if I have trouble?

You are more than welcome to post here on the WordPress forums under the plugin’s support sub-forum.

Reviews

Great work!!

This plugin is great! Easy to style using siteorigin css plugin. Works flawlessly, just what I needed.

Internal Shortcodes

Likely an easy fix but still a deal breaker. Nested shortcodes inside the grid do not resolve. For example a contact form placed inside the grid.

Easy and nice

I don’t know much of wordpress or coding but I could use the shortcode in a responsive theme template. Thank you!

Super simple and efficient

There is a lot of responsive-column-plugins out there and they all have their flaws…but this one is simple and flawless! Thanks author 🙂

Read all 4 reviews

Contributors & Developers

“Responsive Grid Shortcode” is open source software. The following people have contributed to this plugin.

Contributors

Changelog

1.1

  • Fixed shortcode rendering inside grid.

1.0

  • Initial Release