Skip to content

Instantly share code, notes, and snippets.

@About2git
Forked from srikat/functions.php
Last active January 21, 2019 07:14
Show Gist options
  • Save About2git/63cc240d3d3ff64131c7 to your computer and use it in GitHub Desktop.
Save About2git/63cc240d3d3ff64131c7 to your computer and use it in GitHub Desktop.
Full width Soliloquy slider with Header floating on the top in Genesis
//* Register Home Slider widget area
genesis_register_sidebar( array(
'id' => 'home-slider',
'name' => __( 'Home Slider', 'mpp' ),
'description' => __( 'This is the home slider widget area.', 'mpp' ),
) );
//* Add custom Slider + Header wrapper's opening div tag
add_action( 'genesis_before_header', 'sk_home_opening_div' );
function sk_home_opening_div() {
if (! is_front_page() )
return;
echo '<div class="slider-header-wrapper">';
genesis_widget_area( 'home-slider', array(
'before' => '<div id="home-slider">',
'after' => '</div>',
) );
}
//* Add custom Slider + Header wrapper's closing div tag
add_action( 'genesis_after_header', 'sk_home_closing_div' );
function sk_home_closing_div() {
if (! is_front_page() )
return;
echo '</div>';
}
<h4 class="slide-title">This is the first slide's title</h4>
<div class="slide-content">This is first slide's description. Vestibulum lobortis bibendum dui, in accumsan nisi sodales id. Vivamus et sapien ullamcorper, placerat eros scelerisque, varius diam.</div>
/*
Full width Soliloquy slider with Header floating on the top
-------------------------------------------------------------- */
.slider-header-wrapper {
position: relative;
}
.home .site-header {
position: absolute;
top: 0;
left: 0;
z-index: 2;
width: 100%;
background-color: transparent;
}
#home-slider .widget {
margin-bottom: 0;
}
#home-slider .soliloquy-container {
max-width: none !important;
}
#home-slider .soliloquy-container .soliloquy .soliloquy-slides img {
width: 100%;
}
#home-slider .soliloquy-container .soliloquy-caption {
background: rgba(0, 0, 0, 0.5);
}
#home-slider .soliloquy-container .soliloquy-caption h4 {
color: #fff;
}
#home-slider .soliloquy-container .soliloquy-caption .soliloquy-caption-inside {
margin: 0 auto;
max-width: 1140px;
background: transparent;
line-height: 1.625;
margin-bottom: 2.4rem !important;
padding: 6rem 0 3.6rem;
}
.slide-content {
font-size: 2rem;
text-align: left;
}
@media only screen and (max-width: 1140px) {
#home-slider .soliloquy-container .soliloquy-caption .soliloquy-caption-inside {
padding-left: 5%;
padding-right: 5%;
}
}
@media only screen and (max-width: 860px) {
#home-slider .soliloquy-container .soliloquy-caption {
position: relative;
background: #3f3f3f;
}
#home-slider .soliloquy-container .soliloquy-caption .soliloquy-caption-inside {
margin-bottom: 0 !important;
padding-top: 4rem;
padding-bottom: 6rem;
}
#home-slider .soliloquy-container .soliloquy {
height: auto !important;
background: #3f3f3f;
}
}
@media only screen and (max-width: 591px) {
#home-slider .soliloquy-container .soliloquy-direction-nav {
display: none;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment