Most of us need widgets below navigation on the homepage, followed by regular blog posts. That thing is semi-static. We need semi-static homepage which is customizable, SEO Friendly has manual control with automatic functions. Here is PHP snippets, HTML, CSS to create WordPress Genesis Homepage. What I saw for HTML old version to HTML5 upgrade, if we use manual codes more than PHP snippets, it is better because of various reasons including adding microformats. Genesis has latest posts, featured posts widgets and that is why peoples search for multiple widgets. But I am offering you one PHP widget with really multiple widget functions. With plugins, snippets you can fetch hyperlinks of recent posts from your category of choice plus add own hyperlinks. Additionally, you’ll load homepage CSS only on homepage. It is a demo with markings :
Although it is written for StudioPress Genesis, it is usable with other themes.
WordPress Genesis Homepage : Semi-Static, Customizable
You need the Genesis Simple Hooks Plugin. There is a plugin to fetch recent posts from the desired category with shortcode:
---
|
1 |
https://wordpress.org/plugins/recent-posts-widget-extended/ |
There is Samuel Otto’s PHP text widget plugin :
|
1 |
https://wordpress.org/plugins/php-code-widget/ |
In Genesis you’ll need to target genesis_before_content_sidebar_wrap to get widget below navigation on homepage, followed by regular blog posts. This code on child theme’s functions.php :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
// Adds home widget area genesis_register_sidebar( array( 'id' => 'thecustomizewindows-widget', 'name' => __( 'Home Widget', 'thecustomizewindows' ), 'description' => __( 'Adds a Widget on Home Page Below Navigation', 'thecustomizewindows' ), ) ); add_action( 'genesis_before_content_sidebar_wrap', 'thecustomizewindows_home_widget', 10 ); function thecustomizewindows_home_widget() { if ( is_home() && is_active_sidebar( 'thecustomizewindows-widget' ) ) { echo '<div class="thecustomizewindows-widget">'; dynamic_sidebar( 'thecustomizewindows-widget' ); echo '</div><!-- end .thecustomizewindows-widget -->'; } } |
That line add_action( 'genesis_before_content_sidebar_wrap' is important.
If somehow, regular blog posts do not show, you can add this snippet on child theme’s functions.php :
|
1 2 3 4 5 6 7 8 |
add_action( 'genesis_entry_content', 'tcw_show_posts' ); function tcw_show_posts() { if ( is_front_page() ) { printf( '<div %s>', genesis_attr( 'home-below-content' ) ); genesis_widget_area( 'home-below-content' ); echo '</div>'; } } |
Go to Widgets and test with test text. You can change the phrase thecustomizewindows with your site name. Now, here is my demo of 3 columns responsive design (total four areas) here :
|
1 |
https://codepen.io/AbhishekGhosh/pen/Nvvbez/ |
See the Pen 3 column homepage by Abhishek Ghosh (@AbhishekGhosh) on CodePen.
That CSS is obviously sized for my need but you can adjust for your size. Obviously, you’ll inject the CSS via Genesis Simple Hooks Plugin’s genesis_before_content_sidebar_wrap field with style CSS wrap within this PHP conditional :
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<?php if(is_front_page()) : ?> <style> #pagewrap-tcw { ... ... ... } } </style> <?php endif; ?> |
That HTML will go via a Text-PHP widget to that newly added location to add widgets on the homepage.
Tagged With genesis home
About Abhishek Ghosh
Here’s what we’ve got for you which might like :
Additionally, performing a search on this website can help you. Also, we have YouTube Videos.
Take The Conversation Further ...
We'd love to know your thoughts on this article.
Meet the Author over on Twitter to join the conversation right now!
If you want to Advertise on our Article or want a Sponsored Article, you are invited to Contact us.
Contact Us