Basic Custom Functions For Displaying Content In Your Theme

Themes which offer a plugin for using hooks like Genesis, Thesis and the rest, make it super easy to display content in any hook location your theme offers.

But you might not want to fill your hook fields in the plugin with PHP code because its not that easy to find and manage.

The solution is to add the code for your content to a custom function.

In this tutorial, we’ll take a look at the most basic custom functions you can use in any theme simply by changing to your theme specific hooks.

Basic Custom Function

This custom function will display an image in any hook location simply by changing the hook which in this case is:

genesis_before_sidebar_widget_area

This hook executes above the primary widget area in your sidebar.

Lets add an image to the code which displays when all pages load at the top of your main sidebar.

We’ll also add a new class so you can style your image using CSS code.

This code includes:

• a basic custom function: wpsites_banner_function
• A new div which generates a new class for styling: widget-logo
• An image url which you can grab once you’ve uploaded your image to your media library: /images/yourimagefilename.png
• And a hook which is a very cool way to display any type of content in a specific location which your theme offers: genesis_before_sidebar_widget_area

Taking Custom Functions Further

But wait! There is much more cooler things you can do with PHP code to display content like images.

What if we want to display the image above the main sidebar on a specific page only?

Like the home page using this tag:

is_home

We add a conditional tag so when the code is processed, it only displays the content based on the tag.

Conditional Tags & Custom Functions

Lets add the above conditional tag, is_home, to the custom function above so the image only displays on the home page in the hook location which in this case is:

genesis_before_sidebar_widget_area

This code snippet includes:

• This code includes a basic custom function

wpsites_home_function

• A new div which generates a new class for styling

sidebar-home

• An image url which you can grab once you’ve uploaded your image to your media library

path/to/your/image.png

• And a hook to display any type of content in a specific location.

genesis_before_sidebar_widget_area

• And a conditional tag to display the content (image) only on the home page.

is_home()

Modifying This Code

You can easily change the theme specific hook and the WordPress conditional tag.

This way the code will work in any theme and display your content in any hook location based on any conditions.

Other Options

You could use CSS code to achieve the same result but its not as powerful because you don’t get to use hooks and conditional tags.