Call link button in header

[petzen]

Hi support.
I have a client who who insist on having his phone number and a call button for mobiles in the header area.
Is this in any way possible? if not directly in X, maybe with a plugin or something like that?

its a deal breaker for the client so i have to find a solution.
Really hope you can help!!

Thanks

here is a image of what the client wants, marked with the red cirkle:

[jade]

Hi Jakob,

Thanks for writing in.

This is easily achievable using the Pro Header Builder but as for X, there is no out of the box option that will allow you to place additional content in the header area above the navigation bar.

However, this is possible by adding some customization through the child theme which will require you to override the default theme code through the child theme.

Please install and activate the child theme. If you do not have the child theme installed yet, you can download it from here. Once you have it installed and activated, please login through FTP then go to wp-content/themes/x-child then go to wp-content/themes/x/framework/legacy/cranium/headers/views/global/ then copy the file _nav-primary.php.

Next, go to wp-content/themes/x-child then complete the directory path framework/legacy/cranium/headers/views/global/ in case the folders are not created yet, kindly create then and make sure that you create the correct heirarchy of directories.

Once you are in the global directory, please the _nav-primary.php file that you copied earlier inside it.

Edit the file and replace the file content with:

<?php

// =============================================================================
// VIEWS/GLOBAL/_NAV-PRIMARY.PHP
// -----------------------------------------------------------------------------
// Outputs the primary nav.
// =============================================================================

if( function_exists( 'ubermenu' ) && $config_id = ubermenu_get_menu_instance_by_theme_location( 'primary' ) ):
	ubermenu( $config_id, array( 'theme_location' => 'primary') );
 else: ?>

<a href="#" id="x-btn-navbar" class="x-btn-navbar collapsed" data-x-toggle="collapse-b" data-x-toggleable="x-nav-wrap-mobile" aria-expanded="false" aria-controls="x-nav-wrap-mobile" role="button">
  <i class="x-icon-bars" data-x-icon-s="&#xf0c9;"></i>
  <span class="visually-hidden"><?php _e( 'Navigation', '__x__' ); ?></span>
</a>

<!-- Add the addional content here -->

<nav class="x-nav-wrap desktop" role="navigation">
  <?php x_output_primary_navigation(); ?>
</nav>

<div id="x-nav-wrap-mobile" class="x-nav-wrap mobile x-collapsed" data-x-toggleable="x-nav-wrap-mobile" data-x-toggle-collapse="1" aria-hidden="true" aria-labelledby="x-btn-navbar">
  <?php x_output_primary_navigation(); ?>
</div>

<?php endif; ?>

Please note the area <!-- Add the additional content here --> in the code above. You can please the content here which is the telephone numner and the call us button. You may place an HTML code there and further style it with CSS.

Kindly note that since this is a custom code that changes the default behavior/display of the theme, you will be responsible to maintain or update the code in case you require further changes or if the code stops working in future updates. If you are uncertain how to proceed, it would be best to get in touch with a developer.

Hope this helps you get started.