Adding New Widgets To Your Home.php File

There’s 2 ways to add new widget area’s in Genesis.

1. One method is to simply register the new widget and add the custom function with hook in your child themes functions.php file.

2. The other way is to add the widget function directly into your child themes home.php file.

In this tutorial, we’ll use the 2nd method to add a new widget below existing home page widgets.

Register New Widget

The easiest way to register a new widget is to copy the code for an existing widget and change the i.d and description.

Add Custom Home Loop Helper Function

This codes gets added to the home_genesis_meta add actions in the home.php file, around line 15

Add Function To Home.php File

This code gets added in the location you want the new widget to display on your home page.

In this example, the code was added at the end of the home.php file resulting in the widget content displaying below all other home page widgets.

If you want the new widget to output the content in another location, you would add the function in the appropriate order in the file.

Full Home.php File

Below is the entire code for the new home.php file.

I have used the Agency child theme by StudioPress as an example.

Styling Custom Home Page Widget

Styling your new widget is easy.

Simply use the new CSS class generated by the custom function as your selector and add your declarations.

Here’s some Sample CSS code you can use to add styles to your new custom home page widget area.

Here’s another way to add custom home page widgets in Genesis.

You can also duplicate home widgets in Genesis.

And here’s a way to add a custom widget area to your home page for a slider.

What do you think? Pretty cool or not?