Docs

[codexworks]

Awesome. Thanks the border-top works and making the submenu transparent works too.

1. What about making the fonts responsive for the h1-h6 and the body?
2. And making the hamburger Icon like the one in the image.

Thank you very much!

[Rad]

Hi there,

1. How do you like it to be responsive? You can try this http://demo.theme.co/integrity-1/shortcodes/responsive-text/.

Then you can add this code to your child theme’s functions.php with your responsive text shortcode and settings,

add_action('wp_footer', 'responsive_headlines', -999999 );

function responsive_headlines () {

echo do_shortcode('

[responsive_text selector="h1" compression="1.5" min_size="36px" max_size="78px"]
[responsive_text selector="h2" compression="1.5" min_size="36px" max_size="78px"]
[responsive_text selector="h3" compression="1.5" min_size="36px" max_size="78px"]
[responsive_text selector="h4" compression="1.5" min_size="36px" max_size="78px"]
[responsive_text selector="h5" compression="1.5" min_size="36px" max_size="78px"]
[responsive_text selector="h6" compression="1.5" min_size="36px" max_size="78px"]

');

}

Please note that texts aren’t responsive by default. And this shouldn’t be done since it will affect all headlines that shouldn’t be affected. What’s the current issue of your headlines? It may be doable just by @media query.

2. Not possible, your sample is image and the current hamburger menu is just font icon.

Thanks!

[codexworks]

Thanks. I got your point about the responsiveness. I am very satisfied with the support. Big Thanks guys.

[Rue Nel]

You’re welcome!
We’re glad we were able to help you out.

[codexworks]

This reply has been marked as private.

[Jade]

Hi there,

The site has an active under construction page active. Kindly provide us with the admin details so that we can access the site.

Thank you.

[codexworks]

This reply has been marked as private.

[Christopher]

Hi there,

Please change logo and navigation layout to ‘stacked’ under Customize -> Header.

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

<?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_social_global(); ?>
        <?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' ); ?>
        </div>
      </div>
    </div>
  </div>

<?php endif; ?>

Hope it helps.

[codexworks]

This reply has been marked as private.

[Jade]

HI there,

Please add this code:

.x-logobar-inner .x-social-global a:hover i {
    color: #e04b30;
}

Feel free to change the color value to your preference.

Hope this helps.

[codexworks]

This reply has been marked as private.

[codexworks]

Okay it works now! I used this code.

<?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 class=”custom-social”><?php x_social_global(); ?></div>
</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’ ); ?>
<div class=”custom-social”><?php x_social_global(); ?></div>
</div>
</div>
</div>
</div>

<?php endif; ?>

One more thing how can I change the Social Icon to round and change background and icon color when hovered?

Thanks for the Help!

[Jade]

Hi there,

Please use add this code:

.custom-social .x-social-global a {
    background-color: #ccc;
    height: 40px;
    width: 40px;
    border-radius: 50%;
}

.custom-social .x-social-global a i {
    position: relative;
    top: 12px;
}

Please change the background color value on the code to your preference.

Hope this helps.

[codexworks]

Thanks a lot!

[Nico]

You’re most welcome.

Feel free to ask us again.

Thanks.

[Author]

Posts