Community Forums › Forums › Archived Forums › Design Tips and Tricks › Executive Pro Widget to Right of Slider
- This topic has 4 replies, 2 voices, and was last updated 10 years, 3 months ago by Brad Dalton.
-
AuthorPosts
-
December 15, 2013 at 7:55 am #79232mountashMember
I can get the widget to show up, and it works correctly. My issue is it is always below the slider. I want the slider to be 60% and the CTA widget to be 40%. How do I get them to be inline?
Thank you,
Janet
Janet Morrow | Mountain Ash Website Design | http://www.mountainash.org
Visit Our Site for more information and pricing.December 15, 2013 at 8:40 am #79235Brad DaltonParticipantYou need to re-code your front-page.php file like this:
<?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-cta' ) || is_active_sidebar( 'home-top' ) || is_active_sidebar( 'home-middle' ) ) { remove_action( 'genesis_loop', 'genesis_do_loop' ); add_action( 'genesis_loop', 'executive_home_sections' ); add_filter( 'genesis_pre_get_option_site_layout', '__genesis_return_full_width_content' ); add_filter( 'body_class', 'executive_add_home_body_class' ); } } function executive_home_sections() { genesis_widget_area( 'home-slider', array( 'before' => '<div class="home-slider widget-area">', 'after' => '</div>', ) ); genesis_widget_area( 'home-cta', array( 'before' => '<div class="home-cta widget-area">', 'after' => '</div>', ) ); genesis_widget_area( 'home-top', array( 'before' => '<div class="home-top widget-area">', 'after' => '</div>', ) ); genesis_widget_area( 'home-middle', array( 'before' => '<div class="home-middle widget-area">', 'after' => '</div>', ) ); } //* Add body class to home page function executive_add_home_body_class( $classes ) { $classes[] = 'executive-pro-home'; return $classes; } genesis();
And then add some CSS
.executive-pro-home .home-cta { float: right; width: 40% } .executive-pro-home .home-slider { float: left; width: 60%; }
December 15, 2013 at 11:18 am #79257mountashMemberI have to make some changes to your code, but it got me a good start. However, as everyone will notice the CTA Top is still below the slider. What is missing? I need to get it up. Here is the code I added:
function.php
genesis_register_sidebar( array( 'id' => 'home-cta-top', 'name' => __( 'Home - Call To Action - Top', 'executive' ), 'description' => __( 'This is the top call to action section on the home page.', 'executive' ), ) );
We still want the middle cta, so this one it top.
front-page.php genesis_widget_area( 'home-cta-top', array( 'before' => '<div class="home-cta-top widget-area">', 'after' => '</div>', ) );
style.css
.executive-pro-home .home-cta .widget-title { font-size: 24px; font-size: 2.4rem; font-weight: 500; margin: 0px; padding: 0px; text-transform: none; width: 60% !important; } .executive-pro-home .home-cta-top { float: right; width: 40% !important; }
60% would be 684px, so I set the largest photo to 675px.
What I am missing?
Janet Morrow | Mountain Ash Website Design | http://www.mountainash.org
Visit Our Site for more information and pricing.December 15, 2013 at 1:54 pm #79271mountashMemberHi Brad,
I got it. I had not added
.executive-pro-home .home-cta .widget-title {
font-size: 24px;
font-size: 2.4rem;
font-weight: 500;
margin: 0px;
padding: 0px;
text-transform: none;
width: 60% !important;
}
to the css. I just changed the slider info that was there...Thank you,
Janet
Janet Morrow | Mountain Ash Website Design | http://www.mountainash.org
Visit Our Site for more information and pricing.December 16, 2013 at 3:11 am #79426Brad DaltonParticipantHello Janet
I wrote a post which may help but seems you got it worked out. http://wpsites.net/web-design/move-call-to-action-next-to-slider-in-executive-pro-theme/
The CSS could be improved as i didn't spend much time on that part of the solution.
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.