Community Forums › Forums › Archived Forums › Design Tips and Tricks › Add sidebar widget to home page – Executive Pro
Tagged: executive pro, home page sidebar
- This topic has 13 replies, 4 voices, and was last updated 9 years, 8 months ago by Brad Dalton.
-
AuthorPosts
-
November 24, 2013 at 9:09 pm #75418lwlindquistMember
I'm pretty sure there's an easier way to have done this... so an assist with either doing it the right way, or adjusting what I did do would be so appreciated. 🙂
Wanting to add a sidebar to the home page in Executive Pro, under the slider. What I've done so far: changed the width of the Home Top widget area to 66%, added a Home Sidebar widget area and set the width at 33%.
It's there, so I counted that a success. 🙂 But I am hoping someone can tell me what I would need to do in order to have it aligned with the Home Top widget, rather than sitting below it.
Of course, if there's just a simple way to have the standard sidebar appear on the home page below the slider, I'd be more than thrilled to take my cobbled-together solution back out. 🙂
Site here: http://morguesslawoffice.com/
Thanks much!
http://morguesslawoffice.com/November 24, 2013 at 11:27 pm #75431nutsandboltsMemberIt would probably be easier to do it this way... I would take out the CSS changes for Home Top, though, or it will look crazy.
First, remove this line from front-page.php:
add_filter( 'genesis_pre_get_option_site_layout', '__genesis_return_full_width_content' );
That's the line that forces full width on the homepage when the widget areas are active.
That said, once you remove it, the sidebar will be beside the slider instead of below it. There's a fix for that, too, though!
Also in front-page.php, find this under
function executive_home_sections()
-genesis_widget_area( 'home-slider', array( 'before' => '<div class="home-slider widget-area">', 'after' => '</div>', ) );
Remove it, then scroll down to an empty line between two functions and add this:
// Move the home slider area outside the sidebar-content wrap add_action( 'genesis_before_content_sidebar_wrap', 'nabm_move_home_slider' ); function nabm_move_home_slider() { if ( is_active_sidebar( 'home-slider' ) ) genesis_widget_area( 'home-slider', array( 'before' => '<div class="home-slider widget-area">', 'after' => '</div>', ) ); }
That will make it full width again and the sidebar will display next to home top. You'll probably need to add some padding in various places (like between the other home widget areas and the sidebar, judging by my test site) but that's much more sound from a structural perspective versus adding a new widget area and trying to get it to style correctly.
Hope that helps!
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 25, 2013 at 5:28 pm #75595lwlindquistMemberTerrific, thanks for your help with that.
I've deleted/added the code you suggest, which now gets me the default sidebar widget displaying on the homepage (which ultimately was the goal) but it's still not displaying aligned with the Home Top, rather not until the Home Top is done.
Suggestions on how to bring it up to sit just under the slider like the Home Top widget area?
Thanks!
November 25, 2013 at 5:31 pm #75597nutsandboltsMemberCan you paste in your front-page.php? That might make it easier to see what's going on structurally. Also, I noticed that your home-sidebar widget area is still there, which may be part of the reason the actual sidebar is being pushed down.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 25, 2013 at 5:39 pm #75601lwlindquistMemberHere you go -- I deleted the home-sidebar (thought I'd caught all the references, but missed that one, so thank you) but still sitting at the bottom:
Thanks 🙂
<?php
/**
* This file adds the Home Page to the Executive Pro Theme.
*
* @author StudioPress
* @package Generate
* @subpackage Customizations
*/add_action( 'genesis_meta', 'executive_home_genesis_meta' );
/**
* Add widget support for homepage. If no widgets active, display the default loop.
*
*/
function executive_home_genesis_meta() {if ( is_active_sidebar( 'home-slider' ) || is_active_sidebar( 'home-top' ) || is_active_sidebar( 'home-cta' ) || is_active_sidebar( 'home-middle' ) ) {
remove_action( 'genesis_loop', 'genesis_do_loop' );
add_action( 'genesis_loop', 'executive_home_sections' );
add_filter( 'body_class', 'executive_add_home_body_class' );}
}
function executive_home_sections() {
genesis_widget_area( 'home-top', array(
'before' => '<div class="home-top widget-area">',
'after' => '</div>',
) );genesis_widget_area( 'home-cta', array(
'before' => '<div class="home-cta widget-area">',
'after' => '</div>',
) );genesis_widget_area( 'home-middle', array(
'before' => '<div class="home-middle widget-area">',
'after' => '</div>',
) );}
// Move the home slider area outside the sidebar-content wrap
add_action( 'genesis_before_content_sidebar_wrap', 'nabm_move_home_slider' );
function nabm_move_home_slider() {
if ( is_active_sidebar( 'home-slider' ) )
genesis_widget_area( 'home-slider', array(
'before' => '<div class="home-slider widget-area">',
'after' => '</div>',
) );
}//* Add body class to home page
function executive_add_home_body_class( $classes ) {$classes[] = 'executive-pro-home';
return $classes;}
genesis();
November 25, 2013 at 6:10 pm #75604nutsandboltsMemberI just noticed that you're using a 960px grid for .site-inner instead of the 1140px grid that is standard with Executive Pro. Was that there last night? The sidebar is being pushed to the bottom on all pages because the content is 800px wide. With all the width changes it's hard to tell exactly what's messing up the sidebar on the homepage.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 25, 2013 at 6:52 pm #75606lwlindquistMemberIt was there last night, but not acting up until today. 🙂
I changed the grid back to 1140px and got the sidebar to reappear. so we know where that problem was coming from. Score. 🙂
Unfortunately, now I'm back to a wider grid than I prefer and I can't for the life of me persuade the slider to center on the page. Thoughts?
November 25, 2013 at 6:56 pm #75607nutsandboltsMemberIs that area actually going to use a slider, or is the static image staying there? If you're not going to have slides, you could just replace the responsive slider widget with a text widget:
<center><img src=http://morguesslawoffice.com/wp-content/uploads/2013/11/IEI-header-960x375.png></center>
If you're planning to use the slider, let me know and we'll work on getting it to center.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 25, 2013 at 7:09 pm #75608lwlindquistMemberNow, why have I never thought of that? 🙂
Alright. That works, and now I just need to fiddle with the css to work the rest of it out.
Thanks so much for your help and patience.
July 10, 2014 at 5:09 pm #113829iellisMemberNutsandbolts,
I have a very similar problem, but with a different theme - the Swank theme. I have removed the forced full page width to restore the sidebar, but I can't seem to get the Genesis Responsive Slider to be full width above the sidebar...
What I am trying to do is get the slider full width, then the sidebar and recent posts below, like you can see on the mock-up here: https://www.dropbox.com/s/lctyarfj41xnc0j/OD%20MOCK%20UP.jpg
Help would be greatly appreciated!
Ian
July 12, 2014 at 4:55 am #114008Brad DaltonParticipantgenesis_widget_area( 'home-slider', array( 'before' => '<div class="home-slider widget-area">', 'after' => '</div>', ) ); add_action( 'genesis_before_content_sidebar_wrap', 'nabm_move_home_slider' ); function nabm_move_home_slider() { if ( is_front_page() && is_active_sidebar( 'home-slider' ) ) genesis_widget_area( 'home-slider', array( 'before' => '<div class="home-slider widget-area">', 'after' => '</div>', ) ); }
Here's the code for your functions file.
I added the conditional tag so it only displays on the front page.
July 12, 2014 at 11:24 pm #114113iellisMemberBrad,
Thank you so much for replying. I added that code to my functions file, and while it does appear to add the full width slider back to the homepage above the sidebar/content - now I have two new problems:
1. It still doesn't show latest posts in the content area below the slider, in fact it appears to be showing the slider again...
2. I seem to have gained an extra horizontal line across the top of the site...
thoughts? http://www.owensanddavis.com
Thanks!
Ian
July 12, 2014 at 11:44 pm #114115iellisMemberBrad,
One more thing that is happening when you add that code. I get an error when I make any changes inside the admin panel (activate/deactivate a plugin, change a page, etc...)
I get a blank browser window and the following error:
Warning: Cannot modify header information - headers already sent by (output started at /home/owensdavis/public_html/wp-content/themes/genesis/lib/functions/widgetize.php:264) in /home/owensdavis/public_html/wp-includes/pluggable.php on line 1121
July 13, 2014 at 2:55 am #114121Brad DaltonParticipantThere is nothing wrong with the code.
There is no loop in the front-page.php file as its been replaced with widgets
remove_action( 'genesis_loop', 'genesis_do_loop' ); add_action( 'genesis_loop', 'executive_home_sections' );
The code i pasted is for your functions file however you can add it to your front-page.php file otherwise you will need to remove the code which creates the same widget in that file or you may get errors.
Sounds like you have duplicated code.
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.