Docs

[patmendezstrength]

URL: http://www.thecuttingedgebarberacademy.com

X version: 4.6.4

I’d like to replicate the topbar/navigation bar at http://www.empire.edu/. I will be using the Renew Stack.

I’d like to have a topbar with the logo to the left, contact information in the middle, and a menu button (similar to the mobile menu button) to the right. Once you click on the menu button, I’d like to use the Superfly menu plugin for the menu. I’d also like a navigation menu directly under this with about 3 or 4 links, centered.

Again, for an example please see http://www.empire.edu/ or the attached screenshot.

Do you think I can do this will X theme’s topbar and navigation bar?

Thanks for your help.

[Rupok]

Hi there,

Thanks for writing in! It seems your website is under construction. Please take it off or provide us the credentials in private reply so that we can check and assist you on this.

Thanks

[patmendezstrength]

This reply has been marked as private.

[Christopher]

Hi there,

Because this requires a template change, I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

Copy _topbar.php from framework/views/global and put it in the same path inside child theme, replace existing code with following :

<?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; ?>
<div class="x-column x-1-3 x-sm"><a href="#"><img src="Add logo URL here"></a></div>
<div class="x-column x-1-3 x-sm"><div class="phone">
					<span class="top"><i class="x-icon-phone" data-x-icon=""></i></i>Call Empire Today</span>
					<span class="bottom">1 (800) 964-1328</span>
				</div></div>
<div class="x-column x-1-3 x-sm"><?php

        wp_nav_menu( array(
            'menu'           => 'topbar-menu',
            'container'      => false,
            'menu_class'     => 'x-nav sf-menu',
            'container'       => 'div',
            'container_class' => 'top-menu',
        ) );
      ?></div>
       
      <?php x_social_global(); ?>
    </div>
  </div>

<?php endif; ?>

Please create a new menu and call it ‘topbar-menu’.

Hope it helps.

[Author]

Posts