Did I make a coding mistake? Any Alternatives?

[jamesparkin]

I was attempting to add three header widgets on the home/front-page of the LifeStyle Pro Theme. They are styled exactly the same as the Footer Widgets. The coding worked exactly as planned, but I was wondering if there was an alternative way to do this?

//* Extra the CTA Header Widget Area
function genesischild_ctawidgetheader() {
	genesis_register_sidebar( array(
	'id' => 'ctawidgetheaderleft',
	'name' => __( 'CTA Widget Header Left', 'genesis' ),
	'description' => __( 'This is for the CTA Widget Left', 'genesis' ),
	) );
	genesis_register_sidebar( array(
	'id' => 'ctawidgetheadermiddle',
	'name' => __( 'CTA Widget Header Middle', 'genesis' ),
	'description' => __( 'This is for the CTA Widget Middle', 'genesis' ),
	) );
	genesis_register_sidebar( array(
	'id' => 'ctawidgetheaderright',
	'name' => __( 'CTA Widget Header Right', 'genesis' ),
	'description' => __( 'This is for the CTA Widget Right', 'genesis' ),
	) );
	
}

add_action ( 'widgets_init','genesischild_ctawidgetheader' );

//* Position CTA Header Widget
function genesischild_ctawidgetheader_position ()  {
if( is_home() ) {
	echo '<div class="ctawidgetheader-container"><div class="wrap"><div class="ctawidgetheaderleft">';
	genesis_widget_area ( 'ctawidgetheaderleft' );
	echo '</div><div class="ctawidgetheadermiddle">';
	genesis_widget_area ( 'ctawidgetheadermiddle' );
	echo '</div><div class="ctawidgetheaderright">';
	genesis_widget_area ( 'ctawidgetheaderright' );
	echo '</div></div>';
}}
//Action set to a higher priority to fire before CTA header widgets

add_action ( 'genesis_before_content','genesischild_ctawidgetheader_position', 5);

[Gary Jones]

I'd restructure it slightly differently:

<?php

// Requires at least PHP 5.4 for the shorthand array syntax.

// Define where our view files are.
// The constant prefix should represent the theme. Here, I've pretended the theme is called 'jamesparkin'.
define( 'JAMESPARKIN_VIEW_DIR', trailingslashit( get_stylesheet_directory() ) . 'views/' );

add_action( 'widgets_init', 'jamesparking_register_header_widgets' );
/**
 * Register custom widget areas.
 * 
 * Note that this function name has a prefix, and an action - registering something. Functions should do something,
 * so try and name them with a verb.
 */
function jamesparking_register_header_widgets() {
	// Keep the data separate from what we do with the data for as long as possible.
	// This array could be extracted into its own function, or a config file, or filtered before using it etc.
	// Note that text domains should match with the theme slug - they should not be 'genesis'.
	$widget_areas = [
		[
			// Nicely align to = characters make it all much easier to read.
			// ID can be hyphenated to make it easier to read too.
			'id'          => 'jamesparkin-header-left',
			'name'        => __( 'CTA Widget Header Left', 'jamesparkin' ),
			// You could be more verbose with these descriptions. Give a clue as to what widgets can work well
			// in each of these widget areas, for instance. Just repeating the widget area title isn't helpful.
			'description' => __( 'This is for the CTA Widget Left', 'jamesparkin' ),
		],
		[
			'id'          => 'jamesparkin-header-middle',
			'name'        => __( 'CTA Widget Header Middle', 'jamesparkin' ),
			'description' => __( 'This is for the CTA Widget Middle', 'jamesparkin' ),
		],
		[
			'id'          => 'jamesparkin-header-right',
			'name'        => __( 'CTA Widget Header Right', 'jamesparkin' ),
			'description' => __( 'This is for the CTA Widget Right', 'jamesparkin' ),
		],
	];

	// Now loop through the data and use it to register sidebars.
	array_walk( $widget_areas, function( $widget_area ) {
		// Use genesis_register_widget_area() - does the same thing as genesis_register_sidebar(), but it helps to
		// think of these as widget areas which may not be displayed as a bar on the side of content.
		genesis_register_widget_area( $widget_area );
	} );
}

add_action( 'genesis_before_content', 'jamesparkin_display_header_widgets', 5 );
/**
 * Display call to action header widgets.
 */
function jamesparkin_display_header_widgets() {
	// Return early, makes code easier to follow.
	if ( ! is_home() ) {
		return;
	}

	// Don't have HTML stuffed into PHP strings. Have syntax-highlightable and front-end-developer-editable
	// HTML in simple files, and just include them where needed.
	include JAMESPARKIN_VIEW_DIR . 'header-widgets.php';
}
?>

<!-- wp-content/themes/jamesparkin/views/header-widgets.php -->
<div class="header-widgets">
	<div class="wrap">
		<!--
		Refer to output classes as -1, -2, -3, not left, middle, right as
		responsive design means they may not be shown in those positions.
		-->
		<div class="header-widget header-widget-1">
			<?php echo genesis_widget_area( 'jamesparkin-header-left' ); ?>
		</div>
		<div class="header-widget header-widget-2">
			<?php echo genesis_widget_area( 'jamesparkin-header-middle' ); ?>
		</div>
		<div class="header-widget header-widget-3">
			<?php echo genesis_widget_area( 'jamesparkin-header-right' ); ?>
		</div>
	</div>
</div> <!-- This final /div was missing from the code you posted. -->

---

WordPress Engineer, and key contributor the Genesis Framework | @GaryJ

[jamesparkin]

Thank you Gary, this is greatly appreciated. The full explanations really does help.

[Author]

Posts