• Skip to fullPage navigation
  • Skip to primary navigation
  • Skip to main content
Krolyn Studios

Krolyn Studios

Precoded Clips for WP Clips

  • Precoded Clips
  • Demos
    • Full-Window Genesis Responsive Slider
    • Genesis Responsive Slider Custom Classes
    • Genesis Responsive Slider V-Middle Excerpt
    • Genesis Simple Mega Menu
    • Genesis Alvaro Trigo fullPage
    • Genesis Bgrd Featured Image Effects
    • Genesis Isotope Filters
  • WP Clips

Full-Window Genesis Responsive Slider

v3.0 / Demo
Dwnlds1538

This Clip adds full-window functionality to the Genesis Responsive Slider for most Genesis child themes with a 100% full-width site-container.

Category: Free Clips
  • Download
  • Setup
  • Comments
Requirements
WP Clips - download and install latest version

Genesis v2.2+ (by StudioPress) + child theme (100% width site-container)
Genesis Responsive Slider v0.9.5+ (plugin by StudioPress)


Installation / Updates
  1. Download the Precoded Clip zip file.
  2. clip-full-window-genesis-slider.3.0.zip

    Download Clip
  3. Go to Settings > Clips in WordPress admin and install via 'WP Clips Manager'; OR unzip and upload via FTP (or file manager) to the /wp-content/clips/precoded/ directory.

Credits / Sponsors
Clip authored by Jon Barratt / Krolyn

Description

Using Full-Window Genesis Responsive Slider
  1. Go to Appearance > Widgets.
  2. Activate the full-window Genesis Responsive Slider by adding the ‘Genesis – Responsive Slider’ widget to the ‘Home Full-Window Slider’ widget area.

Featured Image Size Requirements
For best results, featured images to be used in the full-window slider should be uploaded at a minimum size of 1600px wide x 1050px high.

Genesis Responsive Slider Settings
Go to Genesis > Slider Settings. Click on ‘Reset Settings’ to initialise or reset the minimum default requirements. You can also change manually –

Display Settings > Maximum Slider Width (in pixels) = 1600
Display Settings > Maximum Slider Height (in pixels) = 1050

In addition to the Genesis Responsive Slider settings and options, adjustments can be made to the image positioning, text alignment and excerpt offset as follows:

Image Positioning
Adjust the position of the image (top, bottom, left, right, center) by adding the following code to your custom Clip’s ‘custom-style.css’ file, and setting an alternative value for ‘background-position’.

.home-full-slider #genesis-responsive-slider .slide-image {
    background-position: center;
}

Text Alignment
Adjust the alignment of the excerpt text (left, center, right) by adding the following code to your custom Clip’s ‘custom-style.css’ file, and setting an alternative value for ‘text-align’.

.home-full-slider #genesis-responsive-slider .slide-excerpt {
    text-align: left;
}

Excerpt Offset
Adjust the offset of the excerpt (from top, from bottom) by adding the following code to your custom Clip’s ‘custom-style.css’ file, and setting alternative values for ‘bottom’ and ‘top’ (note: one value must always be ‘auto’).

.home-full-slider #genesis-responsive-slider .slide-excerpt {
    bottom: 0;
    top: auto;
}
Notes

Full-Window Slider Position
By default, the full-window slider is positioned ‘after’ the header in the page’s normal flow (using the ‘genesis_after_header’). Hooks and/or priorities may require adjustment if the navigation is uniquely positioned or additional widget areas have been added using the same hook.

Fixed Position (or Sticky) Header/Navigation
A fixed (or sticky) header/navigation will result in the full-window slider aligning with the top of the page. Setting an alpha of 60-80% on header/navigation backgrounds is often useful in such cases.

Conditions
By default, the Clip adds the slider to the front page only. However, conditions can be altered by adding the following filter code to your custom Clip’s custom-functions.php file –

add_filter( 'clip_full_window_genesis_slider_active', 'your_custom_filter' );
function your_custom_filter( $active ) {
    if( /* Add conditions here */ ) {
        return true;
    }
    return false; /* Or return $active for default */
}

Reviews

There are no reviews yet.

Cancel reply

Your email address will not be published. Required fields are marked *

  • WP Clips
  • WP Clips Multisite
  • Krolyn’s ClipBank

© Copyright 2015 Krolyn Studios · Privacy Policy · Contact