Top nav bar modification

Hi Vlad,

Using the Moesia child-theme, I would like to modify the top navigation bar in order to get as follows:
logo1 (col-md-2) | site-navigation (col-md-8) | logo2 (col-md-2)

In which php file can I modify it (I suppoose it is not possible via Customizr)? I did not find anything like “site-branding” class in header.php which should class modifying the logo part of the site.

I suppose the top navigation bar is called by <?php tha_header_bottom(); ?> in header.php but I cannot locate the ultimate code for it.

Could you please help me?

My site (still under construction): fajnbyvanie.srobezstarosti.sk.

Thank you!

Hi,

It’s actually in tha_header_before or tha_header_after, depends if you’ve selected to show the menu bar above the image or below.

The function you’re looking for is in functions.php and it’s called moesia_nav_bar(). You can either unhook it with remove_action and add your own or you can simply copy it in your child theme because the function is pluggable.

Hey Vlad,

I managed to modify the function by simly copying it to the child theme function.php.
I tried also remove_action, but unsuccessfully so I let it be as it is…

Now I have a little problem. Everything works fine but the button (when clicking) for small menu doesn’t work.
I tried to revert it back to “only” 1 logo on the page (by commenting all the changes in child theme’s functions.php) and it worked perfectly again, so I should have made a mistake or it could be something in javascript I cannot find…

Do you have an idea what could be wrong?

my site: http://fajnbyvanie.srobezstarosti.sk
I attach child theme’s functions.php moesia_nav_bar section.

if ( ! function_exists( 'moesia_nav_bar' ) ) {
function moesia_nav_bar() {
	echo '<div class="top-bar">
			<div class="container">
				<div class="site-branding col-md-2">';
				if ( get_theme_mod('site_logo') ) :
					echo '<a href="' . esc_url( home_url( '/' ) ) . '" title="';
						bloginfo('name');
					echo '"><img class="site-logo" src="' . esc_url(get_theme_mod('site_logo')) . '" alt="';
						bloginfo('name');
					echo '" /></a>';
				else :
					echo '<h1 class="site-title"><a href="' . esc_url( home_url( '/' ) ) . '" rel="home">';
						bloginfo( 'name' );
					echo '</a></h1>';
					echo '<h2 class="site-description">';
						bloginfo( 'description' );
					echo '</h2>';
				endif;
			echo '</div>';
			echo '<button class="menu-toggle btn"><i class="fa fa-bars"></i></button>
				<nav id="site-navigation" class="main-navigation col-md-8" role="navigation">';
				wp_nav_menu( array( 'theme_location' => 'primary' ) );
			echo '</nav>';
			
			//logo SLSP napravo
			echo '<div class="site-co-branding col-md-2">';
			echo '<a href="http://www.slsp.sk">';
			echo '<img class="site-logo2" src="' . get_bloginfo('stylesheet_directory') . '/img/logo2.png" alt="Slovenská sporiteľňa">';
			echo '</a>';
			echo '</div>';
			
			if ( get_theme_mod('toggle_search', 0) ) :
				echo '<span class="nav-search"><i class="fa fa-search"></i></span>';
				echo '<span class="nav-deco"></span>';
				echo '<div class="nav-search-box">';
					get_search_form();
				echo '</div>';
			endif;
			
			
			
		echo '</div>';
	echo '</div>';
}
}
if (get_theme_mod('moesia_menu_top', 0) == 0) {
	add_action('tha_header_after', 'moesia_nav_bar');
} else {
	add_action('tha_header_before', 'moesia_nav_bar');
}

Thank you!

Post a link please. I’m not seeing anything that could affect it.
Note that you don’t need to check if ( ! function_exists( ‘moesia_nav_bar’ ) )

Hey,

this is the link to the site: http://fajnbyvanie.srobezstarosti.sk

Thank you!

One, more time:
this is the link to the site: http://fajnbyvanie.srobezstarosti.sk/

apologies, I just noticed, that if I don’t use a correct “link” html format in this post, the address/link displayed has the white color on the white background-color, that is why you could not have seen it :slight_smile:

Does not work anyway… trying as “code snippet” :slight_smile:
http://fajnbyvanie.srobezstarosti.sk/

You just have a small overlap there. Haven’t checked much but something like this should do it.


@media only screen and (max-width: 991px) {
  .site-co-branding {
      display: inline-block;
      float: right:
  }
}

Hi Vlad,

I am sorry to relive this again… but I didn’t understand the process to use anchors in the menu bar.

I am using a unmodified Mosia theme.

Thanks a lot in advance.

Will

UP

Can anyone advise how to make to top-bar (navigation) on top of first page?

ADrian