Hi Ed
This was really simple I just cut the code for the slideshow and pasted it above the header (see below)
<!--// OPEN #container //-->
<?php if ($page_layout == "fullwidth") { ?>
<div id="container">
<?php } else { ?>
<div id="container" class="boxed-layout">
<?php } ?>
<!--// SLIDESHOW - moved above header //-->
<?php if (is_page()) {
global $post;
$show_posts_slider = get_post_meta($post->ID, 'sf_posts_slider', true);
$rev_slider_alias = get_post_meta($post->ID, 'sf_rev_slider_alias', true);
$layerSlider_ID = get_post_meta($post->ID, 'sf_layerslider_id', true);
if ($show_posts_slider) {
sf_swift_slider();
} else if ($rev_slider_alias != "") { ?>
<div class="home-slider-wrap">
<?php putRevSlider($rev_slider_alias); ?>
</div>
<?php } else if ($layerSlider_ID != "") { ?>
<div class="home-slider-wrap">
<?php echo do_shortcode('[layerslider id="'.$layerSlider_ID.'"]'); ?>
</div>
<?php }
}
?>
<!--// HEADER //-->
<div class="header-wrap<?php echo $header_wrap_class; ?>">
<?php if ($enable_top_bar) { ?>
<!--// TOP BAR //-->
<?php echo sf_top_bar(); ?>
<?php } ?>
<div id="header-section" class="<?php echo $header_layout; ?> <?php echo $logo_class; ?>">
<?php echo sf_header($header_layout); ?>
</div>
</div>
<!--// OPEN #main-container //-->
<div id="main-container" class="clearfix">
<!--// SLIDESHOW WAS HERE //-->
<!--// OPEN .container //-->
<div class="container">
<!--// OPEN #page-wrap //-->
<div id="page-wrap">
The only problem I had with this is the sticky header. The padding above the logo and navigation reduces from 15px to 10px when you start to scroll, because if the header was at the top of the page it would change to the sticky header, however I need the padding to stay at 15px until you scroll past the slideshow & header.
I have attached 3 screenshots below, the header before scroll, the header after scroll and then when it gets to the sticky header.
As you can see on the 2nd screenshot the padding above the menu and logo has been reduced.
– Kyle
.