Change location of navigation bar - add it above header image

I want to put the navbar on top of the header images. Can someone direct me on how to accomplish this?

I have the same issue. I sure wish someone would answer this question!

Hi There,

I hope you are well today and thank you for your question.

You can try achieving this by using the attached small plugin specially developed for you that contains some custom code.

Best Regards,
Movin

Hello,

regarding to header, I would like to insert an affiliate iframe or javascript just before the nav bar. Can you plaese help me with this.
My site is www.flightfindair.com

Thank you so much

Hi @flightfindair,

To help us keep support thread separates could you please create your own thread for your question here https://colorlibsupport.com/c/travelify-support/ instead of replying on others thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.

Thanks,
Movin

Hi Movin,

I have the same need to make header page goes under the main top manu. But I have theme Sparkling. Can I use the same plugin?

Thank you in advance.

Hi @damirakz,

The shared plugin is specially developed for Travelify theme so it won’t work with the Sparkling theme.

To help us keep support thread separates could you please create your own thread for your question here https://colorlibsupport.com/c/sparkling/ instead of replying on others thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.

Thanks,
Movin

Dear Movin,

Sorry for the mess here. I created my own topic about Sparkling theme header image: https://colorlibsupport.com/t/header-image-under-the-main-top-menu/

I would be very happy if you can see it.

I look forward to your answer.

Thank you in advance.

@damirakz Sure i will reply on your created topic ASAP.

Hello Movin:
I’m still trying to put navigation bar about the header image. I tried downloading the zip plug-in that you suggested above, but it won’t take it. Please explain how I get that extra code in, starting with where in the dashboard area. Thanks! Please help soon!

Jennifer

Hi Jennifer,

I have tested the shared plugin on my test site using latest version of Travelify theme and it’s working fine for me.

What do you mean by “it won’t take it”?

Please make sure that you have activated the shared plugin on your site.

Could you please share me your site URL where it’s happening so that i can troubleshoot it?

Regards,
Movin

Hello again Movin:

I’m still trying to put the navigation bar about the header image on my site! I tried again. When I try to install the plug-in you suggested in my admin panel it says:

The package could not be installed. PCLZIP_ERR_BAD_FORMAT (-10) : Unable to find End of Central Dir Record signature

I cannot activate the plug-in on my site!

My URL is http://sunsetcanyonpetcare.com.

Thanks if you can help. Possibly send me the plug-in again? I also feel that there is too much white space on the top of the site!

Jennifer

@jschap6 I have shared it again here and if it still doesn’t work for you then please create a file colorlib-plugin.php in your WordPress install in the directory wp-content/plugins/ and add the following code in that file, after this please activate the plugin.


<?php 
/*
Plugin Name: Colorlib Plugin
Description: Quick Custom Solution Plugin for Implementing Custom Solution.
Version: 1.0.0
Author: Movin
Author URI: http://freewptp.com/
License: GNU General Public License (Version 2 - GPLv2)
*/

function modify_travelify_headerdetails() {
    
    remove_action( 'travelify_header', 'travelify_headerdetails' );
    add_action( 'travelify_header', 'custom_travelify_headerdetails', 99 );

}
add_action( 'init', 'modify_travelify_headerdetails');

/**
 * Shows Header Part Content
 *
 * Shows the site logo, title, description, searchbar, social icons etc.
 */
function custom_travelify_headerdetails() {
?>
	<?php
		global $travelify_theme_options_settings;
   	$options = $travelify_theme_options_settings;

   	$elements = array();
		$elements = array(
			$options[ 'social_facebook' ],
			$options[ 'social_twitter' ],
			$options[ 'social_googleplus' ],
			$options[ 'social_linkedin' ],
			$options[ 'social_pinterest' ],
			$options[ 'social_youtube' ],
			$options[ 'social_vimeo' ],
			$options[ 'social_flickr' ],
			$options[ 'social_tumblr' ],
			$options[ 'social_instagram' ],
			$options[ 'social_rss' ],
			$options[ 'social_github' ]
		);

		$flag = 0;
		if( !empty( $elements ) ) {
			foreach( $elements as $option) {
				if( !empty( $option ) ) {
					$flag = 1;
				}
				else {
					$flag = 0;
				}
				if( 1 == $flag ) {
					break;
				}
			}
		}
	?>

	<div class="container clearfix">
		<div class="hgroup-wrap clearfix">
					<section class="hgroup-right">
						<?php travelify_socialnetworks( $flag ); ?>
					</section><!-- .hgroup-right -->
				<hgroup id="site-logo" class="clearfix">
					<?php
						if( $options[ 'header_show' ] != 'disable-both' && $options[ 'header_show' ] == 'header-text' ) {
						?>
							<h1 id="site-title">
								<a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
									<?php bloginfo( 'name' ); ?>
								</a>
							</h1>
							<h2 id="site-description"><?php bloginfo( 'description' ); ?></h2>
						<?php
						}
						elseif( $options[ 'header_show' ] != 'disable-both' && $options[ 'header_show' ] == 'header-logo' ) {
						?>
							<h1 id="site-title">
								<a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
									<img src="<?php echo $options[ 'header_logo' ]; ?>" alt="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>">
								</a>
							</h1>
						<?php
						}
						?>

				</hgroup><!-- #site-logo -->

		</div><!-- .hgroup-wrap -->
	</div><!-- .container -->

	<?php
		if ( has_nav_menu( 'primary' ) ) {
			$args = array(
				'theme_location'    => 'primary',
				'container'         => '',
				'items_wrap'        => '<ul class="root">%3$s</ul>'
			);
			echo '<nav id="main-nav" class="clearfix">
					<div class="container clearfix">';
				wp_nav_menu( $args );
			echo '</div><!-- .container -->
					</nav><!-- #main-nav -->';
		}
		else {
			echo '<nav id="main-nav" class="clearfix">
					<div class="container clearfix">';
				wp_page_menu( array( 'menu_class'  => 'root' ) );
			echo '</div><!-- .container -->
					</nav><!-- #main-nav -->';
		}
	?>
        	<?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; ?>

		<?php
		if( is_home() || is_front_page() ) {
			if( "0" == $options[ 'disable_slider' ] ) {
				if( function_exists( 'travelify_pass_cycle_parameters' ) )
   				travelify_pass_cycle_parameters();
   			if( function_exists( 'travelify_featured_post_slider' ) )
   				travelify_featured_post_slider();
   		}
   		}

		else {
			if( ( '' != travelify_header_title() ) || function_exists( 'bcn_display_list' ) ) {
		?>
			<div class="page-title-wrap">
	    		<div class="container clearfix">
	    			<?php
		    		if( function_exists( 'travelify_breadcrumb' ) )
						travelify_breadcrumb();
					?>
				   <h3 class="page-title"><?php echo travelify_header_title(); ?></h3><!-- .page-title -->
				</div>
	    	</div>
	   <?php
	   	}
		}
}


Thank-you Movin - This issue has been resolved!

Jennifer

You are most welcome here :slight_smile: