Docs

[jsegalphoto]

How can I place my social media links below the left menu using ICON 9 either horizontally on one single line or vertically, as seen here: http://www.trentbell.com/
I’m working on a local install with MAMP so unfortunately can’t give a URL to what I’m working on now. Thanks in advance!

J

[Friech]

Hi There,

Thanks for writing in! You can place a social icon on your menu like a normal item that will link to your social media pages.

Edit your menu and create a custom menu item and use the code below as your menu item Navigation Label

Facebook
<i class="x-icon x-icon-facebook-square" data-x-icon="&#xf082;" ></i>

Google Plus
<i class="x-icon x-icon-google-plus-square" data-x-icon="&#xf0d4;" ></i>

Twitter
<i class="x-icon x-icon-twitter-square" data-x-icon="&#xf081;" ></i>

YouTube
<i class="x-icon x-icon-youtube-square" data-x-icon="&#xf166;" ></i>

Hope it helps, Cheers!

[jsegalphoto]

Thanks a lot! Is there also a way to align the menu items to the right of the column, not centered?

[Friech]

Hi There,

Have you already uploaded your site, can we take a closer look on it.

If not, please export your customizer settings, upload to sharing site and send us the link on private reply so we can replicate your menu on our end.

Thanks.

[jsegalphoto]

Oh wow thanks so much! I’m playing around with some different options so not to sound ungrateful, but I’ll try to figure something out on my end before bothering you with that. I’ll be in touch soon. Thanks again!

[Jade]

You’re most welcome.

[jsegalphoto]

How do I export customiser settings?

[Prasant Rai]

Hello There,

Thanks for writing in!

You can refer to following documentation:

https://community.theme.co/kb/customizer-manager/

Thanks.

[jsegalphoto]

Thank you so much for the links to the social accounts. Is there a way to place them lower down as seen in this image below? Also can you give me the links to instagram so I can add it as a link as well? Thank you in advance!

[Friech]

Hi There,

Sorry but we really need to see your site first, so we can provide a tailored solution.

Here’s the code for Instagram.

<i class="x-icon x-icon-instagram" data-x-icon="&#xf16d;" ></i>

Thanks.

[jsegalphoto]

Please have a look at this link to see what I mean: http://developer.jsegalphoto.com/
Right now there are no social links because they currently need to be placed within menu items as mentioned above. Is there a way to have them not in menu items but embedded within the navbar left as seen in the attached screenshot?
Thank you any information will be invaluable.

[jsegalphoto]

Previous file did not attach correctly please see here

[Friech]

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.

Then navigate on your child theme’s \x-child\framework\views\global\ directory and create a file named _navbar.php and paste the code below on it.

<?php

// =============================================================================
// VIEWS/GLOBAL/_NAVBAR.PHP
// -----------------------------------------------------------------------------
// Outputs the navbar.
// =============================================================================

$navbar_position = x_get_navbar_positioning();
$logo_nav_layout = x_get_logo_navigation_layout();
$is_one_page_nav = x_is_one_page_navigation();

?>

<?php if ( ( $navbar_position == 'static-top' || $navbar_position == 'fixed-top' || $is_one_page_nav ) && $logo_nav_layout == 'stacked' ) : ?>

  <div class="x-logobar">
    <div class="x-logobar-inner">
      <div class="x-container max width">
        <?php x_get_view( 'global', '_brand' ); ?>
      </div>
    </div>
  </div>

  <div class="x-navbar-wrap">

    <div class="<?php x_navbar_class(); ?>">
      <div class="x-navbar-inner">
        <div class="x-container max width">
          <?php x_get_view( 'global', '_nav', 'primary' ); ?>

        </div>
        
      </div>
    </div>
  </div>

<?php else : ?>

  <div class="x-navbar-wrap">
    <div class="<?php x_navbar_class(); ?>">
      <div class="x-navbar-inner">
        <div class="x-container max width">
          <?php x_get_view( 'global', '_brand' ); ?>
          <?php x_get_view( 'global', '_nav', 'primary' ); ?>
          <?php x_social_global(); ?>
        </div>
      </div>
    </div>
  </div>

<?php endif; ?>

Let us know if the icons successfully appeared, so we can apply a custom CSS on it.

Thanks.

[Author]

Posts