Restore menu in topbar

Support
#1

Hi, on www.tellasia.org i used to have a menu (Topbar Menu) and small search icon in the topbar aligned right, lying just to the left of the social icons. The code for it is still in Customizer but no content appears. Please help. Here’s the customizer code for it as well as for the social icons:

/* TOPBAR */
.x-topbar .x-social-global a {
color: #787878;
font-size: 10px;
font-size: 1rem;
letter-spacing: 0px;
vertical-align: text-bottom;
margin-top: 0;
margin-bottom: 0;
padding: 0; }
.site .x-topbar .p-info {
margin: 5px 5px 10px 50px;
padding: 0, 20px, 0, 20px;
font-size: 10px;
font-size: 1rem; }
body .x-topbar .p-info a {
border: 0;}

/TOPBAR ADD SEARCH icon/
.searchform {
float: right;
margin: 5px 20px 0 10px;
color: #787878 !important;
font-size: 15px; }

/TOPBAR ADD MENU/
.top-menu {
float: right;
margin-top: 11px;
margin-right: 5px;
font-size: 16px;}
.top-menu ul {
margin:0; }
.top-menu li {
display:inline-block; }
.top-menu li a {
color:#787878;
padding: 10px 20px 0 0;
line-height:13px; }
.top-menu li:hover {
color:#DE8D95;}

#2

Hi,

I checked your topbar content and the menu is no longer there.

Do you happen to have a backup or a screenshot of how it looks like?

Thanks

#3

It’s just the menu “Topbar Menu” found in Menus.
Ok i found this code backup:
FOR SEARCH
Top menu get search icon to come in topbar - Search in Customize-Topbar code, and make sure that Enable Legacy Font Classes option under Settings > Cornerstone in your WordPress dashboard (see: http://prntscr.com/8p64bp).

FOR MENU
if ( ! function_exists( ‘x_topbar_search_navigation_item’ ) ) :
function x_navbar_search_navigation_item( $items, $args ) {

  if ( $args->theme_location == 'topbar-menu' ) {
    $items .= '<li class="menu-item x-menu-item x-menu-item-search">'
              . '<a href="#">'
                . '&lt;span&gt;&lt;i class="x-icon x-icon-search"&gt;&lt;/i&gt;&lt;span class="x-hidden-desktop"&gt; ' . __( 'Search', '__x__' ) . '&lt;/span&gt;&lt;/span&gt;'
              . '</a>'
            . '</li>';
  }

return $items;

}
add_filter( ‘wp_nav_menu_items’, ‘x_topbar_search_navigation_item’, 9999, 2 );
endif;

#4

Glad to hear you found a solution.

Thanks for sharing it.

Cheers!

#5

This is not a solution. It did not work. So I would deeply appreciate your assistance.

  1. It turns out both pieces of code are only for the search icon. What I need much more than the search icon is the TOPBAR MENU so there is no code at all for that, only the CSS is there in Custom CSS.I think we need some JS to go with it?
  2. The search icon appears but is left justified and lies next to the logo, whereas it needs to lie to the right, near the social icons. Also the search icon does not function. I added the JS but it still didnt function.
    I truly appreciate your help.
#6

Hi,

To achieve that, create file _topbar.php in wp-content/themes/pro-child/framework/legacy/cranium/headers/views/global

Then add the code below into that file.

<?php

// =============================================================================
// VIEWS/GLOBAL/_TOPBAR.PHP
// -----------------------------------------------------------------------------
// Includes topbar output.
// =============================================================================

?>

<?php if ( x_get_option( 'x_topbar_display' ) == '1' ) : ?>

  <div class="x-topbar">
    <div class="x-topbar-inner x-container max width">
      <?php if ( x_get_option( 'x_topbar_content' ) != '' ) : ?>
      <p class="p-info"><?php echo x_get_option( 'x_topbar_content' ); ?></p>
      <?php endif; ?>
      <?php x_social_global(); 
       wp_nav_menu( array(
        'menu'           => 'Topbar Menu',
        'theme_location' => 'topbar-menu',
        'container'      => false,
        'menu_class'     => 'top-menu',
        'link_before'    => '<span>',
        'link_after'     => '</span>'
      ) );
      ?>
    </div>
  </div>

<?php endif; ?>

Then add this in your child theme’s functions.php file

 function x_topbar_search_navigation_item( $items, $args ) {
 
      if ( $args->theme_location == 'topbar-menu' ) {
        $items .= '<li class="menu-item x-menu-item x-menu-item-search">'
                  . '<a href="#" class="x-btn-navbar-search">'
                    . '<span><i class="x-icon-search" data-x-icon="&#xf002;" aria-hidden="true"></i><span class="x-hidden-desktop"> ' . __( 'Search', '__x__' ) . '</span></span>'
                  . '</a>'
                . '</li>';
      }
   }
    return $items;
  }
  add_filter( 'wp_nav_menu_items', 'x_topbar_search_navigation_item', 9998, 2 );

Hope that helps

#7

Ok I applied the above but as soon as I added the code to Functions.php (I added it at the bottom where it said “additional functions”) the site went down. Please guide me how to do it correctly.

#8

Hi There,

Please update the previous code to this:

unction x_topbar_search_navigation_item( $items, $args ) {
 
	if ( $args->theme_location == 'topbar-menu' ) {
		$items .= '<li class="menu-item x-menu-item x-menu-item-search">'
		. '<a href="#" class="x-btn-navbar-search">'
		. '<span><i class="x-icon-search" data-x-icon="&#xf002;" aria-hidden="true"></i><span class="x-hidden-desktop"> ' . __( 'Search', '__x__' ) . '</span></span>'
		. '</a>'
		. '</li>';
	}
	return $items;
}

Regards!

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.