Full page width Genesis – Responsive Slider in Lifestyle Pro

Community Forums Forums Design Tips and Tricks Full page width Genesis – Responsive Slider in Lifestyle Pro

This topic is: resolved

This topic contains 24 replies, has 3 voices, and was last updated by  Steve@BHQ 2 years ago.

Viewing 10 posts - 16 through 25 (of 25 total)
  • Author
  • #71308


    Because the site is under dev, I had a coming soon plugin activated. I deactivated so you could take a look.




    You’ll need to set the appropriate widths / modify your CSS for .site-container and/or .content because the slider is contained within them and they are 1140px and 800px respective.

    But … that will impact your sidebar, so keep that in mind. It will push it down to below your posts, I suspect.

    It would probably be better for you to use Brad’s link and set soliloquy outside the structural wraps. You’ll have less modifications ahead.

    You can use the Genesis Hooks Plugin or modify functions.php per Brad’s instructions. Carrie Dils has a good primer to get you started on moving things outside the wraps.




    A quick glance at the “lite/free” version of soliloquy, I didn’t see a way to automatically pull the image to be displayed. For myself and my clients, things have to be very easy for them. With the Genesis slider, all the have to to do select a featured image and its done. Even the DCG could be used full width without too much difficulty. http://zakelritefishing.com/

    It seems now with all the latest updates, even just slightly customizing the themes (full width slider) is getting more complicated, less user friendly for non-coders like myself. Maybe not, just better coding,.. I don’t have any idea what structural wraps are,.. Honestly wouldn’t mind learning a better way to do something (soliloquy),.. Just wasn’t planing on learning all of the coding part.

    @coralseait Are you available to help with this?

    Thx, Steve



    Be happy to help you; you are almost there anyway so just a bit more learning and you’ll have it nailed. You can reach me via my website email if you want to take it offline.

    The structural wraps in Genesis, you can think of as walls / containers holding everything nicely in their place so they don’t spill out everywhere. Because of this the responsive slider won’t expand past them – if you make them wider the slider can be wider too.

    Soliloquy is really drag and drop and developer version for unlimited sites gets you everything and is a great investment.



    In your case then i think the Genesis Slider is better because its designed to pull in the featured image from blog posts and does a good job at that. I don’t think Soliloquy does that but may be wrong. You will need to create a widget area for it.

    I’ll leave you in the hands of @coralseait.



    Ok, thanks Brad.
    So, what else can I do to get the Genesis Slider to work? http://californiatournamenttrail.com/

    Thank You,



    Yes, images are big enough. The widget area doesn’t even seem to be displaying. ?? http://californiatournamenttrail.com/

    Here is the functions code:

    //* Start the engine
    include_once( get_template_directory() . ‘/lib/init.php’ );

    //* Set Localization (do not remove)
    load_child_theme_textdomain( ‘lifestyle’, apply_filters( ‘child_theme_textdomain’, get_stylesheet_directory() . ‘/languages’, ‘lifestyle’ ) );

    //* Child theme (do not remove)
    define( ‘CHILD_THEME_NAME’, __( ‘Lifestyle Pro Theme’, ‘lifestyle’ ) );
    define( ‘CHILD_THEME_URL’, ‘http://my.studiopress.com/themes/lifestyle/’ );
    define( ‘CHILD_THEME_VERSION’, ‘3.0.0’ );

    //* Add HTML5 markup structure
    add_theme_support( ‘html5′ );

    //* Add viewport meta tag for mobile browsers
    add_theme_support( ‘genesis-responsive-viewport’ );

    //* Enqueue Droid Sans and Roboto Slab Google fonts
    add_action( ‘wp_enqueue_scripts’, ‘lifestyle_google_fonts’ );
    function lifestyle_google_fonts() {

    wp_enqueue_style( ‘google-fonts’, ‘//fonts.googleapis.com/css?family=Droid+Sans:400,700|Roboto+Slab:400,300,700′, array(), CHILD_THEME_VERSION );


    //* Add new image sizes
    add_image_size( ‘home-large’, 634, 360, TRUE );
    add_image_size( ‘home-small’, 266, 160, TRUE );

    //* Add support for custom background
    add_theme_support( ‘custom-background’, array(
    ‘default-image’ => get_stylesheet_directory_uri() . ‘/images/bg.png’,
    ‘default-color’ => ‘efefe9′,
    ) );

    //* Add support for custom header
    add_theme_support( ‘custom-header’, array(
    ‘header_image’ => ”,
    ‘header-selector’ => ‘.site-title a’,
    ‘header-text’ => false,
    ‘height’ => 118,
    ‘width’ => 1140,
    ) );

    //* Add support for additional color style options
    add_theme_support( ‘genesis-style-selector’, array(
    ‘lifestyle-pro-blue’ => __( ‘Lifestyle Pro Blue’, ‘lifestyle’ ),
    ‘lifestyle-pro-green’ => __( ‘Lifestyle Pro Green’, ‘lifestyle’ ),
    ‘lifestyle-pro-mustard’ => __( ‘Lifestyle Pro Mustard’, ‘lifestyle’ ),
    ‘lifestyle-pro-purple’ => __( ‘Lifestyle Pro Purple’, ‘lifestyle’ ),
    ‘lifestyle-pro-red’ => __( ‘Lifestyle Pro Red’, ‘lifestyle’ ),
    ) );

    //* Add support for 3-column footer widgets
    add_theme_support( ‘genesis-footer-widgets’, 3 );

    //* Reposition the primary navigation
    remove_action( ‘genesis_after_header’, ‘genesis_do_nav’ );
    add_action( ‘genesis_before_header’, ‘genesis_do_nav’ );

    //* Modify the size of the Gravatar in the author box
    add_filter( ‘genesis_author_box_gravatar_size’, ‘lifestyle_author_box_gravatar’ );
    function lifestyle_author_box_gravatar( $size ) {

    return 96;


    //* Modify the size of the Gravatar in the entry comments
    add_filter( ‘genesis_comment_list_args’, ‘lifestyle_comments_gravatar’ );
    function lifestyle_comments_gravatar( $args ) {

    $args[‘avatar_size’] = 60;
    return $args;


    //* Register widget areas
    genesis_register_sidebar( array(
    ‘id’ => ‘full-width’,
    ‘name’ => __( ‘Full Width Widget’, ‘lifestyle’ ),
    ‘description’ => __( ‘Display Content Full Width After Header’, ‘lifestyle’ ),
    ) );
    genesis_register_sidebar( array(
    ‘id’ => ‘home-top’,
    ‘name’ => __( ‘Home – Top’, ‘lifestyle’ ),
    ‘description’ => __( ‘This is the top section of the homepage.’, ‘lifestyle’ ),
    ) );
    genesis_register_sidebar( array(
    ‘id’ => ‘home-middle’,
    ‘name’ => __( ‘Home – Middle’, ‘lifestyle’ ),
    ‘description’ => __( ‘This is the middle section of the homepage.’, ‘lifestyle’ ),
    ) );
    genesis_register_sidebar( array(
    ‘id’ => ‘home-bottom-left’,
    ‘name’ => __( ‘Home – Bottom Left’, ‘lifestyle’ ),
    ‘description’ => __( ‘This is the bottom left section of the homepage.’, ‘lifestyle’ ),
    ) );
    genesis_register_sidebar( array(
    ‘id’ => ‘home-bottom-right’,
    ‘name’ => __( ‘Home – Bottom Right’, ‘lifestyle’ ),
    ‘description’ => __( ‘This is the bottom right section of the homepage.’, ‘lifestyle’ ),
    ) );

    add_action( ‘genesis_after_header’, ‘wpsites_full_content_width_widget’ );

    function wpsites_full_content_width_widget() {

    if ( is_front_page() && is_active_sidebar(‘full-width’) ) {

    genesis_widget_area( ‘full-wdth’, array(
    ‘before’ => ‘<div class=”full-width” class=”widget-area”>’,
    ‘after’ => ‘</div>’,
    ) );





    My apologies gents, I’ve been up in the wilds of Cape Tribulation / Far North Queensland without reliable connection and quite busy. When I catch up on things I should be able to review this more.



    Check the spelling of full-width because its wrong in your code.

    Please check it and fix it so it matches the i.d to register the widget.



    @Brad, That was it!!!! Funny how such a little simple thing could cause problems…
    Once again, thank you so much for the great support from the Studiopress community.

Viewing 10 posts - 16 through 25 (of 25 total)

The topic ‘Full page width Genesis – Responsive Slider in Lifestyle Pro’ is closed to new replies.