Get started with Grid Shortcodes

How does it work?

To use this plugin in your Posts/Pages and custom types you will need to create rows and add columns to them using the below shortcodes. The following example shows you how to have three columns side by side.

Creating a row using GDC_row

[GDC_row][/GDC_row]

Adding columns using GDC_column

[GDC_row]
[GDC_column size="third"]
Your content here
[/GDC_column]
[GDC_column size="third"]
Your content here
[/GDC_column]
[GDC_column size="third"]
Your content here
[/GDC_column]
[/GDC_row]

Available sizes

  • half
  • third
  • two-thirds
  • quarter
  • three-quarters

Examples

Two halves

[GDC_row]
[GDC_column size="half"]
Your content here
[/GDC_column]
[GDC_column size="half"]
Your content here
[/GDC_column]
[/GDC_row]

Three thirds

[GDC_row]
[GDC_column size="third"]
Your content here
[/GDC_column]
[GDC_column size="third"]
Your content here
[/GDC_column]
[GDC_column size="third"]
Your content here
[/GDC_column]
[/GDC_row]

One third & two thirds

[GDC_row]
[GDC_column size="third"]
Your content here
[/GDC_column]
[GDC_column size="two-thirds"]
Your content here
[/GDC_column]
[/GDC_row]

Two thirds & one third

[GDC_row]
[GDC_column size="two-thirds"]
Your content here
[/GDC_column]
[GDC_column size="third"]
Your content here
[/GDC_column]
[/GDC_row]

Four quarters

[GDC_row]
[GDC_column size="quarter"]
Your content here
[/GDC_column]
[GDC_column size="quarter"]
Your content here
[/GDC_column]
[GDC_column size="quarter"]
Your content here
[/GDC_column]
[GDC_column size="quarter"]
Your content here
[/GDC_column]
[/GDC_row]

One half & two quarters

[GDC_row]
[GDC_column size="half"]
Your content here
[/GDC_column]
[GDC_column size="quarter"]
Your content here
[/GDC_column]
[GDC_column size="quarter"]
Your content here
[/GDC_column]
[/GDC_row]

Two quarters & one half

[GDC_row]
[GDC_column size="quarter"]
Your content here
[/GDC_column]
[GDC_column size="quarter"]
Your content here
[/GDC_column]
[GDC_column size="half"]
Your content here
[/GDC_column]
[/GDC_row]

Three quarters & one quarter

[GDC_row]
[GDC_column size="three-quarters"]
Your content here
[/GDC_column]
[GDC_column size="quarter"]
Your content here
[/GDC_column]
[/GDC_row]

I have empty paragraphs/spaces inside my columns

The easiest way to solve this issue is to add the shortcodes in HTML mode (in both the Classic editor and Gutenberg).

Need more help?

For additional help, please contact us.