It’s simple to add hero images to WordPress for your Genesis themes. Hero images are a great way to make any WordPress site more visual and make the theme really stand out. As a WordPress Development Company, Trinity Web Media is always looking for ways to make our client’s sites stand out when using a pre-developed WordPress theme.
This process relies on three key items:
1) WordPress Genesis Themes
2) Adding the code to functions.php and style.css files
3) Using the Widget Logic plugin to control where the image renders
Adding Hero Images to WordPress
Step ONE
To have the image display as shown in the above image copy and place the below code to your functions.php file:
[NOTE: Change the noted lines changes where the the images displays
Line 8 includes the Genesis hook. To change the hero image placement, you may use a different hook. Refer to this page for a Complete list of Genesis Hooks. Also, you may want to change the theme name in line 5.]
Step TWO
To take care of any styling issues add the below code to the theme’s style.css file:
[NOTE: Not all themes are the same. This is the baseline CSS we use. You may need to alter the CSS as dictated by your Genesis theme.]
Step THREE
Install the Widget Logic plugin and use the conditional statements from the WordPress CODEX. This will control what pages, posts, archives and taxonomies where the image will show.
That’s it! This is are our little trick to Add Hero Images to WordPress site. As you peruse the Trinity Web Media site you will see we used this technique to add the images to our own site, so why not do it for yours?
For more discussion on WordPress Development and Digital Marketing check out The New Marketing Show on iTunes.
