Docs

[Rue Nel]

Hello There,

Thanks for updating this thread! Your current changes is not possible with the code you have. What you are trying to accomplish requires a template customization, we would like to suggest that you use 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.

Once you have your child theme active and ready, please follow the following steps below:
1] Using Notepad or TextEdit or Sublime Text or any text editor, please create a new file in your local machine.
2] Insert the following code into that new 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">

    	<div class="x-column x-sm x-2-5" style="padding: 0px;">
    		
			<?php if ( x_get_option( 'x_topbar_content' ) != '' ) : ?>
				<p class="p-info"><?php echo x_get_option( 'x_topbar_content' ); ?></p>
			<?php endif; ?>

    	</div>

		<div class="x-column x-sm x-1-5" style="padding: 0px; text-align: center;">
			<img class="alignnone wp-image-397" src="//pauldemocritou.com/wp-content/uploads/2016/07/favicon.png" alt="CONSULTANT in greece3" width="40" height="40" style="PADDING-LEFT: 10px;">
		</div>

		<div class="x-column x-sm x-2-5" style="padding: 0px;">
			<?php x_social_global(); ?>			
		</div>

    </div>
  </div>

<?php endif; ?>

3] Save the file named as _topbar.php
4] Upload this file to your server in the child theme’s folder
wp-content/themes/x-child/framework/views/global/

5] And then please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.x-topbar .p-info {
    float: none;
}

We would loved to know if this has work for you. Thank you.

[Paul Democritou]

Hello,
I still need an answer for the above, but also need a little help on how to get the menu to align to the right perfectly with the social media icons. More specifically, I need the “t” in Contact to be parallel to the last SM icon as shown on the screengrab.
Thanks,
PD

[Paul R]

Hi,

You can add this under Custom > Edit Global CSS in the Customizer.

.x-topbar .x-social-global {
    padding-right: 20px;
}

Hope that helps

[Paul Democritou]

Hello,
Still waiting for an answer for how to add an image to the center of the navbar and topbar.

The image I would like to use is:
http://pauldemocritou.com/wp-content/uploads/2016/07/favicon.png

Thanks,
PD

[Paul R]

Hi PD,

I went ahead and added the image.

Kindly check on your end.

Home

Thanks

[Author]

Posts