Slider in header for Travelify WordPress theme

Hi there,

I tried to put the sp responsive slider on the header of my site (verboomhuisje-overijssel.nl) but I can’t get it working. I need to put this code <div class=“headerslider”> <?php echo do_shortcode(’[sp_responsiveslider limit="-1"]’); ?></div> somewhere and I thought that it has to be on the header-extensions file but it isn’t going on the right position. It has to be between the menu and title of the site (where the picture of that house is now). Sorry for my bad english btw I’m Dutch :stuck_out_tongue:

You are on the right track! :slight_smile:

Add your code right above or below this code snippet inside your previously mentioned header-extensions.php file.

<?php $header_image = get_header_image();
if( !empty( $header_image ) ) :?>
	<img src="<?php echo esc_url( $header_image ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>">
<?php endif; ?>		

Let me know if this helps.

The code looks like below now but when I reload the page a blanc page is showing up until I remove the piece of code.

	<div class=”headerslider”> <?php echo do_shortcode(‘[sp_responsiveslider limit=”-1?]’); ?></div>
	<?php $header_image = get_header_image();
			if( !empty( $header_image ) ) :?>
				<img src="<?php echo esc_url( $header_image ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>">
			<?php endif; ?>

You are running into encoding issues because you are using wrong quotes for the task. A tiny little thing but they make a huge difference. Here is more accurate code:

<div class="headerslider"> <?php echo do_shortcode('[sp_responsiveslider limit="-1?]'); ?></div>
	<?php $header_image = get_header_image();
			if( !empty( $header_image ) ) :?>
				<img src="<?php echo esc_url( $header_image ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>">
			<?php endif; ?>

However, I doubt that this part of code is written like this: limit="-1?] If you still run into problems, then this is the thing you should look into.

Hi,

It works :slight_smile: Only it looks like the site is reserving space for the old header (as you can see on the site) Any idea how to remove this empty space?

EDIT: Nevermind found it, it was done by the slider itself, I set uped it to quickly. Thanks for all your help :slight_smile:

EDIT2: It looks like the slider is now in the header but it is also in the navigation menu :S Did I something wrong?

I see that you have already figured what was going on as slider is finally working fine.

Let me know if there is anything else.