Below, you’ll find a detailed guide on how to add the Genesis Easy Columns Shortcodes to your WordPress website, including their parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Genesis Easy Columns Plugin shortcodes not to show or not to work correctly.
Before starting, here is an overview of the Genesis Easy Columns Plugin and the shortcodes it provides:
"Genesis Easy Columns is a WordPress plugin that simplifies the creation and management of column layouts in the Genesis Framework, enhancing your site's design."
- [one-half-first]
- [one-half]
- [one-third-first]
- [one-third]
- [one-fourth-first]
- [one-fourth]
- [one-fifth-first]
- [one-fifth]
- [one-sixth-first]
- [one-sixth]
- [clear]
- [clear-line]
Genesis Easy Columns [one-half-first] Shortcode
The Genesis Easy Columns plugin shortcode, “one-half-first”, is designed to create a responsive column layout. This shortcode creates a half-width column that always appears first in its row. The content within this column is defined by the user. It’s particularly useful for structuring content on a webpage.
Shortcode: [one-half-first]
Examples and Usage
Basic Example – The basic usage of the “one-half-first” shortcode is to divide the content into two equal halves. The content enclosed within the shortcode will be displayed in the first half of the container.
[one-half-first]Your content goes here...[/one-half-first]
Advanced Examples – The advanced usage of the “one-half-first” shortcode can be to display multiple sections of content in the first half of the container. Each section can be separated by a different shortcode or HTML tag.
[one-half-first]
[section]First section of content...[/section]
[section]Second section of content...[/section]
[/one-half-first]
Another advanced usage can be to use the “one-half-first” shortcode within another shortcode to create nested layouts. The content within the “one-half-first” shortcode will be displayed in the first half of the parent shortcode’s container.
[parent-shortcode]
[one-half-first]Your content goes here...[/one-half-first]
[/parent-shortcode]
Remember, the content enclosed within the “one-half-first” shortcode will be displayed in the first half of the container, and the remaining space will be left empty. To fill the other half, you can use the “one-half” shortcode after the “one-half-first” shortcode.
[one-half-first]Your content goes here...[/one-half-first]
[one-half]Your other content goes here...[/one-half]
PHP Function Code
In case you have difficulties debugging what causing issues with [one-half-first]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode("one-half-first","gc_one_half_first");
Shortcode PHP function:
function gc_one_half_first($atts, $content = null ) {
return '<div class="one-half first">'.gc_strip_autop($content).'</div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Genesis Easy Columns [one-half] Shortcode
The Genesis Easy Columns ‘one-half’ shortcode is used to divide content into two equal halves. Upon execution, it wraps the content within a div class called “one-half”, effectively splitting the page or post content into two equal columns. This shortcode is useful for creating a visually appealing and organized layout.
Shortcode: [one-half]
Examples and Usage
Basic example – A simple implementation of the ‘one-half’ shortcode. This will create a div with the class ‘one-half’, allowing you to style it accordingly in your CSS.
[one-half]Your content goes here[/one-half]
Advanced examples
Implementing the ‘one-half’ shortcode with additional HTML elements. In this example, we’ve added a heading and paragraph within the ‘one-half’ div.
[one-half]Your Title Here
Your paragraph text here.
[/one-half]
Using two ‘one-half’ shortcodes side by side. This will create two divs with the class ‘one-half’ next to each other, effectively creating a two-column layout.
[one-half]Your content for the first column goes here[/one-half][one-half]Your content for the second column goes here[/one-half]
PHP Function Code
In case you have difficulties debugging what causing issues with [one-half]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('one-half','gc_one_half');
Shortcode PHP function:
function gc_one_half($atts, $content = null) {
return '<div class="one-half">'.gc_strip_autop($content).'</div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Genesis Easy Columns [one-third-first] Shortcode
The Genesis Easy Columns plugin shortcode “one-third-first” is used to divide your content into columns. Upon execution, this shortcode wraps your content in a div with classes “one-third” and “first”. This structure signifies the beginning of a three-column layout. The “first” class indicates the first column in the set.
Shortcode: [one-third-first]
Examples and Usage
Basic example – The following shortcode will create a one-third width column at the first position. The content inside the shortcode will be wrapped within a div with the classes ‘one-third’ and ‘first’.
[one-third-first]Your content here[/one-third-first]
Advanced examples
Using the shortcode to display a custom message with HTML markup. The message will be wrapped within a div with the classes ‘one-third’ and ‘first’. This allows for more complex layouts and styles to be applied to the content.
[one-third-first]Welcome to our website
We offer a range of services to help you achieve the results you’re after.
[/one-third-first]
Using the shortcode to display an image. The image will be wrapped within a div with the classes ‘one-third’ and ‘first’. This can be useful for creating a layout with images and text side by side.
[one-third-first][/one-third-first]
PHP Function Code
In case you have difficulties debugging what causing issues with [one-third-first]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode("one-third-first","gc_one_third_first");
Shortcode PHP function:
function gc_one_third_first($atts, $content = null) {
return '<div class="one-third first">' .gc_strip_autop($content). '</div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Genesis Easy Columns [one-third] Shortcode
The Genesis Easy Columns plugin shortcode, ‘one-third’, creates a one-third width column in your content. This shortcode wraps the content within a div with a class of ‘one-third’, effectively styling the content to occupy one-third of the available width.
Shortcode: [one-third]
Examples and Usage
Basic example – A simple use of the shortcode to create a one-third column on your page or post.
[one-third]
Advanced examples
Utilizing the shortcode to insert a one-third column with additional content. The content will be contained within the one-third column on your page or post.
[one-third]Your content goes here[/one-third]
Using the shortcode to create multiple one-third columns on your page or post. Each column will contain the specified content.
[one-third]First column content[/one-third]
[one-third]Second column content[/one-third]
[one-third]Third column content[/one-third]
Applying the shortcode to create a one-third column with nested shortcodes. The nested shortcodes will be processed within the one-third column.
[one-third][another-shortcode][/one-third]
PHP Function Code
In case you have difficulties debugging what causing issues with [one-third]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('one-third','gc_one_third');
Shortcode PHP function:
function gc_one_third($atts, $content = null) {
return '<div class="one-third">' .gc_strip_autop($content). '</div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Genesis Easy Columns [one-fourth-first] Shortcode
The Genesis-Easy-Columns plugin shortcode “one-fourth-first” is designed to create a column that takes up one-fourth of the available width. This shortcode wraps the content within a div element, assigning it the classes “one-fourth” and “first”. This facilitates easy, flexible column formatting.
Shortcode: [one-fourth-first]
Examples and Usage
Basic example – A simple usage of the “one-fourth-first” shortcode to display content in a one-fourth column at the beginning of a row.
[one-fourth-first]Your content here[/one-fourth-first]
Advanced examples
Using the “one-fourth-first” shortcode to display a list of items in a one-fourth column at the beginning of a row. The shortcode content accepts HTML, so you can include an unordered list within the shortcode tags.
[one-fourth-first]- Item 1
- Item 2
- Item 3
[/one-fourth-first]
Using the “one-fourth-first” shortcode to display an image in a one-fourth column at the beginning of a row. The shortcode content accepts HTML, so you can include an image tag within the shortcode tags.
[one-fourth-first][/one-fourth-first]
Remember that the “one-fourth-first” shortcode should be used in conjunction with other column shortcodes provided by the genesis-easy-columns plugin to create a complete row of columns.
PHP Function Code
In case you have difficulties debugging what causing issues with [one-fourth-first]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode("one-fourth-first","gc_one_fourth_first");
Shortcode PHP function:
function gc_one_fourth_first($atts, $content = null) {
return '<div class="one-fourth first">' .gc_strip_autop($content). '</div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Genesis Easy Columns [one-fourth] Shortcode
The Genesis Easy Columns ‘one-fourth’ shortcode is a tool that divides a webpage into four equal parts. When implemented, it wraps the content within a ‘div’ tag, assigning it a class ‘one-fourth’. This class is styled to occupy 25% of the total width, creating a column that takes up one-fourth of the page.
Shortcode: [one-fourth]
Examples and Usage
Basic Example – A simple usage of the ‘one-fourth’ shortcode. This example will create a div with the class ‘one-fourth’, and the content inside the div will be determined by the content parameter.
[one-fourth]Your content goes here[/one-fourth]
Advanced Examples
Creating nested columns within a ‘one-fourth’ column. This example demonstrates the flexibility of the ‘one-fourth’ shortcode by creating nested columns within a ‘one-fourth’ column. The nested columns will be half the width of the ‘one-fourth’ column, effectively making them ‘one-eighth’ columns.
[one-fourth]
[one-half]Your content goes here[/one-half]
[one-half]Your content goes here[/one-half]
[/one-fourth]
Using the ‘one-fourth’ shortcode with other shortcodes. This example shows how you can use the ‘one-fourth’ shortcode in combination with other shortcodes. Here, the ‘contact-form’ shortcode is used within the ‘one-fourth’ shortcode, allowing you to display a contact form within a ‘one-fourth’ column.
[one-fourth]
[contact-form id="1"]
[/one-fourth]
PHP Function Code
In case you have difficulties debugging what causing issues with [one-fourth]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('one-fourth','gc_one_fourth');
Shortcode PHP function:
function gc_one_fourth($atts, $content = null) {
return '<div class="one-fourth">' .gc_strip_autop($content). '</div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Genesis Easy Columns [one-fifth-first] Shortcode
The Genesis Easy Columns plugin shortcode “one-fifth-first” creates a responsive column that takes up one-fifth of the available width. It’s the first column in a row. This shortcode wraps the content within a div element, applying the “one-fifth” and “first” classes. The “first” class indicates the start of a new row.
Shortcode: [one-fifth-first]
Examples and Usage
Basic example – A simple usage of the “one-fifth-first” shortcode. This will create a div with “one-fifth first” classes and the content placed inside.
[one-fifth-first]Your content goes here[/one-fifth-first]
Advanced examples
In this example, we are using the shortcode to display different contents in the same div. The contents will be placed inside the div with “one-fifth first” classes.
[one-fifth-first]First content[/one-fifth-first]
[one-fifth-first]Second content[/one-fifth-first]
Another advanced usage could be to nest shortcodes. Here, we are using the “one-fifth-first” shortcode and nesting the “contact-form” shortcode inside it. The contact form will be displayed inside the div with “one-fifth first” classes.
[one-fifth-first][contact-form id="1"][/one-fifth-first]
Please remember that these examples are based on the provided PHP function and may vary depending on the actual implementation and parameters supported by the “one-fifth-first” shortcode.
PHP Function Code
In case you have difficulties debugging what causing issues with [one-fifth-first]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode("one-fifth-first","gc_one_fifth_first");
Shortcode PHP function:
function gc_one_fifth_first($atts, $content = null) {
return '<div class="one-fifth first">' .gc_strip_autop($content). '</div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Genesis Easy Columns [one-fifth] Shortcode
The Genesis Easy Columns ‘one-fifth’ shortcode creates a responsive column that occupies one-fifth of the page width. It wraps content within a div class for easy CSS styling.
Shortcode: [one-fifth]
Examples and Usage
Basic Example – A simple usage of the ‘one-fifth’ shortcode to divide content into 5 columns.
[one-fifth]Your content here[/one-fifth]
Advanced Examples
Example 1 – Using multiple ‘one-fifth’ shortcodes to create a 5-column layout. Each column will hold different content.
[one-fifth]Your content for column 1 here[/one-fifth]
[one-fifth]Your content for column 2 here[/one-fifth]
[one-fifth]Your content for column 3 here[/one-fifth]
[one-fifth]Your content for column 4 here[/one-fifth]
[one-fifth]Your content for column 5 here[/one-fifth]
Example 2 – Using ‘one-fifth’ shortcode with other shortcodes. This example demonstrates how to use the ‘one-fifth’ shortcode in conjunction with the ‘contact-form’ shortcode. The contact form will be displayed in one fifth of the page width.
[one-fifth][contact-form id="123"][/one-fifth]
Please note that you need to replace ‘Your content here’ and ‘contact-form id=”123″‘ with your actual content and contact form ID respectively.
PHP Function Code
In case you have difficulties debugging what causing issues with [one-fifth]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('one-fifth','gc_one_fifth');
Shortcode PHP function:
function gc_one_fifth($atts, $content = null) {
return '<div class="one-fifth">' .gc_strip_autop($content). '</div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Genesis Easy Columns [one-sixth-first] Shortcode
The Genesis Easy Columns plugin shortcode, “one-sixth-first”, is designed to create a column layout on your webpage. This shortcode allows you to insert a single column that takes up one-sixth of the total page width. It’s particularly useful for creating multi-column layouts.
Shortcode: [one-sixth-first]
Examples and Usage
Basic example – A simple usage of the “one-sixth-first” shortcode to display a section of the content in a one-sixth column layout. This example does not use any additional attributes.
[one-sixth-first]Your content here...[/one-sixth-first]
Advanced examples
Example 1: Using the shortcode to display a section of the content with additional HTML elements. In this case, we are adding a heading and a paragraph within the one-sixth column layout.
[one-sixth-first]Your Heading
Your paragraph here...
[/one-sixth-first]
Example 2: Using the shortcode to display a section of the content with nested shortcodes. This is a more advanced usage where we are adding another shortcode within the one-sixth column layout.
[one-sixth-first][another-shortcode][/one-sixth-first]
Please note that the actual effect of the shortcode and its attributes can vary based on the theme and other plugins you are using on your WordPress site. Always test your shortcodes thoroughly to ensure they work as expected.
PHP Function Code
In case you have difficulties debugging what causing issues with [one-sixth-first]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode("one-sixth-first","gc_one_sixth_first");
Shortcode PHP function:
function gc_one_sixth_first($atts, $content = null) {
return '<div class="one-sixth first">' .gc_strip_autop($content). '</div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Genesis Easy Columns [one-sixth] Shortcode
The Genesis Easy Columns plugin shortcode, ‘one-sixth’, creates a column that occupies one-sixth of the page width. It wraps the content within a div with class ‘one-sixth’, allowing for responsive column layouts.
Shortcode: [one-sixth]
Examples and Usage
Basic Example – The following example demonstrates the basic usage of the ‘one-sixth’ shortcode. In this case, the shortcode is used to wrap the content within a div with a class of ‘one-sixth’, which can be styled accordingly using CSS.
[one-sixth]Your content goes here[/one-sixth]
Advanced Examples
1. The shortcode can be used to wrap multiple elements, enabling the creation of complex layouts. Here, we use the shortcode to create a layout with two ‘one-sixth’ columns side by side.
[one-sixth]First column content[/one-sixth]
[one-sixth]Second column content[/one-sixth]
2. Shortcodes can also be nested within each other. In this example, we nest a ‘one-sixth’ shortcode within another ‘one-sixth’ shortcode to create a nested layout.
[one-sixth]Outer column content[one-sixth]Nested column content[/one-sixth][/one-sixth]
Remember, the ‘one-sixth’ shortcode can be styled using the ‘one-sixth’ class in your stylesheet. This allows you to create a variety of unique and responsive layouts for your WordPress site.
PHP Function Code
In case you have difficulties debugging what causing issues with [one-sixth]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('one-sixth','gc_one_sixth');
Shortcode PHP function:
function gc_one_sixth($atts, $content = null) {
return '<div class="one-sixth">' .gc_strip_autop($content). '</div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Genesis Easy Columns [clear] Shortcode
The Genesis Easy Columns plugin shortcode, ‘clear’, is designed to insert a clear div into your content. This helps in creating a clean break and preventing float elements from wrapping around each other. The PHP function ‘gc_clear’ returns a div with the class ‘clear’. This effectively clears the float on elements, ensuring a smooth layout.
Shortcode: [clear]
Examples and Usage
Basic example – The ‘clear’ shortcode is utilized to create a ‘clear’ div element, which is often used to clear floats and prevent container collapse caused by floated elements within it.
[clear]
Advanced examples
Although the ‘clear’ shortcode does not accept any parameters, it can be used in conjunction with other shortcodes for advanced usage. For instance, it can be used to clear floats after a series of columns created with the ‘genesis-easy-columns’ plugin.
[one_half]Your content here[/one_half]
[one_half_last]Your content here[/one_half_last]
[clear]
In this example, the ‘clear’ shortcode is used after two half-width columns. This ensures that any content following these columns will start on a new line, rather than being floated next to the columns.
PHP Function Code
In case you have difficulties debugging what causing issues with [clear]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('clear','gc_clear');
Shortcode PHP function:
function gc_clear($atts) {
return '<div class="clear"></div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Genesis Easy Columns [clear-line] Shortcode
The Genesis Easy Columns plugin shortcode, ‘clear-line’, is designed to insert a visual break in the content. It creates a clear line, offering a neat separation between different sections of your webpage.
Shortcode: [clear-line]
Examples and Usage
Basic example – A simple usage of the ‘clear-line’ shortcode to create a line break in your content.
[clear-line /]
Advanced examples
Even though the ‘clear-line’ shortcode doesn’t accept any parameters inherently, you can extend its functionality by adding your own attributes. Let’s assume you’ve modified the ‘gc_clear_line’ function to accept a ‘color’ attribute. Here’s how you can use it:
[clear-line color="red" /]
This will generate a line break with the specified color. Remember, this example assumes you’ve modified the ‘gc_clear_line’ function to accept a ‘color’ parameter.
Another advanced usage could be extending the shortcode to accept a ‘thickness’ parameter. Here’s how you can use it:
[clear-line color="red" thickness="2px" /]
This will generate a line break with the specified color and thickness. Again, this example assumes you’ve modified the ‘gc_clear_line’ function to accept ‘color’ and ‘thickness’ parameters.
PHP Function Code
In case you have difficulties debugging what causing issues with [clear-line]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('clear-line','gc_clear_line');
Shortcode PHP function:
function gc_clear_line($atts) {
return '<div class="clear-line"></div>';
}
Code file location:
genesis-easy-columns/genesis-easy-columns/includes/shortcodes.php
Conclusion
Now that you’ve learned how to embed the Genesis Easy Columns Plugin shortcodes, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.
Leave a Reply