Resources

Load a section via hook

Overview

Sections can be added to your pages and posts using Platform's Shortcodes generator which can be found on both the Page and Post content editor.

We can take this a step further and use the shortcode in a hook. This is useful, if you're using a third-party theme and wish to insert a section into the header or footer regions for that theme.

Getting Started

In order to add a section to your third-party theme via an action, we first need to have the following:

  • Some understanding of how hooks work. There is a great guide over at WPMU Dev.
  • We need to be using a child theme for the third-party theme, visit your theme provider for child theme information
  • A code editor such as Atom or SubLime Text.

In this article we will be using the Genesis Framework and demonstrating how to load the Boxes section into the Header region. However, the same process can be used for any section.

The Code

The first thing we need to do is open our child themes functions.php file in our code editor. Then find the hook location we want to use, if you're using Genesis Framework you can visit the Genesis Visual Hook guide for reference.

In this this example, we will be using the genesis_header hook and use it in our action hook, see the code below.


add_action('genesis_header', '');

Next, we need to add the function to the hook code i.e. the name of the function you wish to be hooked.


add_action('genesis_header', 'genesis_boxes_section');
	function genesis_boxes_section() {

The final part is to use the do_shortcode function and then add our sections shortcode like so:


add_action('genesis_header', 'genesis_boxes_section');
	function genesis_boxes_section() {
		echo do_shortcode('[pl_section section="boxes" id="Enter_Unique_Id_Here"]');
}

Save the changes to your child theme functions.php file and when we visit our site. We should have the Boxes section loaded into the header region for the Genesis Framework.

Boxes loaded in Genesis Framework via hook

However, as we are using the Genesis Framework hook, the section will not be visible in the builder's Page Layout panel.

Therefore, to edit the section, hover over and you should see the section name appear to the top right. Click the name and the sections configuration options will load in the builder.