Docs

[Rish]

Hi Talented Team ,

I need to customize my footer in renew stack and needs the below layout structure

1- My logo needs to be above the Social icon.
2-Menu needs to be on left side with vertical align.
3-Need a icon of email on right bottom.

Look like below

———————————————————————————-
About LOGO
Work
Services Social icons
Clients
contact us Copyright statement Email Icon
———————————————————————————–

Regards
Meredith

[Rish]

This reply has been marked as private.

[Friech]

Hi There,

Thanks for writing in! We can change the background color of your menu bar to white on scroll but that will hide your menu items and logo as they are white on a white background. Please clarify what you’re try to achieve.

Regarding the footer, It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities.

Thanks for understanding.

[Rish]

hi ,

I already seen your thread regarding ,So atleast i need to place my logo above the social icons.

But that post solution is applicable to integrity stack whereas i am using renew.

https://community.theme.co/forums/topic/input-logo-in-footer-change-footer-color/

So send me same for renew stack with logo on top of social icons.

Further on mobile devices i need my menu items fonts color to be white on scroll down because my menu background changes to black on scroll and menu items hiding as they have also black color.The same issue is with inner pages because inner pages have fixed-Top black background menu.
I sent you my website link so you can check it on mobile and then click the menu while scroll.

Hope you understand.

[Christopher]

Hi there,

Create file wp-footer.php in x-child/framework/views/renew/ and insert following code :

<?php

// =============================================================================
// VIEWS/RENEW/WP-FOOTER.PHP
// -----------------------------------------------------------------------------
// Footer output for Renew.
// =============================================================================

?>

  <?php x_get_view( 'global', '_header', 'widget-areas' ); ?>
  <?php x_get_view( 'global', '_footer', 'scroll-top' ); ?>
  <?php x_get_view( 'global', '_footer', 'widget-areas' ); ?>

  <?php if ( x_get_option( 'x_footer_bottom_display' ) == '1' ) : ?>

    <footer class="x-colophon bottom" role="contentinfo">
      <div class="x-container max width">
        <div class="footer-logo"><img src="http://www.capitaldgroup.com/test/wp-content/uploads/2016/05/ampm.png"></div>

        <?php if ( x_get_option( 'x_footer_social_display' ) == '1' ) : ?>
          <?php x_social_global(); ?>
        <?php endif; ?>

        <?php if ( x_get_option( 'x_footer_menu_display' ) == '1' ) : ?>
          <?php x_get_view( 'global', '_nav', 'footer' ); ?>
        <?php endif; ?>

        <?php if ( x_get_option( 'x_footer_content_display' ) == '1' ) : ?>
          <div class="x-colophon-content">
            <?php echo do_shortcode( x_get_option( 'x_footer_content' ) ); ?>
          </div>
        <?php endif; ?>

      </div>
    </footer>

  <?php endif; ?>

<?php x_get_view( 'global', '_footer' ); ?>

Please add following code in Customize -> Custom -> CSS :

@media (min-width:979px){
ul#menu-primary-menu-2 {
    text-align: left;
}
.x-colophon .x-social-global {
    width: 50%;
    float: right;
}
}

Find this code :

.home .x-navbar-inner.alt-color .desktop .x-nav > li > a> span, .x-navbar .desktop .x-nav > li.x-active > a > span, .x-navbar .desktop .x-nav > li.current-menu-item > a > span {
    color: #fff;
}

And update it to :

.home .x-navbar-inner.alt-color .desktop .x-nav > li > a> span, .x-navbar .desktop .x-nav > li.x-active > a > span, .x-navbar .desktop .x-nav > li.current-menu-item > a > span, .x-navbar-inner.alt-color .mobile .x-nav > li > a> span {
    color: #fff;
}

Hope it helps.

[Rish]

Hi,

Its working perfect for home page but when you click the work menu item and then click the menu nav bar (in inner page) still the menu items font color are black.

Further i dont need to change the postion of footer menu and social icon.The only thing i need is to place my logo in footer above social icon as currently its below the footer menu.

Please help me and really thanks for home page code correction.

R

[Christopher]

Hi there,

#1 I can’t replicate this issue, please clear cache and check again.

#2 The provided code should display image above social icons, if you’re using cache plugin, please clear cache ans check again otherwise provide us with FTP credentials in private replay.

Thanks.

[Rish]

This reply has been marked as private.

[Christopher]

Hi there,

#1 The logo is black that’s why it’s not displaying.

Update this line in wp-footer.php :

        <div class="footer-logo"><img src="http://www.capitaldgroup.com/test/wp-content/uploads/2016/05/ampm.png"></div>

To :

<div class="footer-logo"><img src="http://www.capitaldgroup.com/test/wp-content/uploads/2016/05/ampm-white-1-e1463565029413.png"></div>

#2 & #3 I would like to check JS code but provided credentials don’t work, please check.

Find this code :

.home .x-navbar-inner {
    background-color: #fff;
    position: fixed;
    width: 100%;
    min-height: 20px;
}
.home .x-navbar-inner {
    transition: 0.02s all linear;
}

And update it to :

.x-navbar-inner {
    background-color: #fff;
    position: fixed;
    width: 100%;
    min-height: 20px;
}
.x-navbar-inner {
    transition: 0.02s all linear;
}

Hope it helps.

[Rish]

This reply has been marked as private.

[Friech]

Hi There,

Currently there are two instances of logo in your footer a black and a white one. The black logo is above the menu and it is centered on the footer, this is not visible because it is blend with the black background. The other one is white which is we’re currently seeing. This was added under Footer Content on the Customizer > Footer.

Please remove the white logo you added on Footer Content and then replace the black logo with a white one.

Hope it helps, Cheers!

[Rish]

Hi,
The only thing left when i go to inner pages like work section in my website on mobile view and then expand the nav bar button the background and menu item font both have black color but i need fonts to be white.

As you see on home page its has scrolling effect and in inner pages its fixed top nav.

I used below code to change nav bar font to white in desktop layout.suggest me change or send new one for mobile view.

.x-navbar.x-navbar-fixed-top .desktop .x-nav > li > a:hover > span, .x-navbar.x-navbar-fixed-top .desktop .x-nav > li.x-active > a > span, .x-navbar.x-navbar-fixed-top .desktop .x-nav > li.current-menu-item > a > span {
box-shadow: 0 2px 0 0 #fff !important;
}

[Christopher]

Hi there,

Please add this code :

.x-navbar .mobile .x-nav li > a:hover, .x-navbar .mobile .x-nav li.x-active > a, .x-navbar .mobile .x-nav li.current-menu-item > a, .x-navbar .mobile .x-nav li a {
    color: #fff;
}

Hope it helps.

[Rish]

Hi ,

It works but affects the nav bar color before scroll on home page in mobile navbar.

So now on mobile view the colors of menu items on home page before scroll become white.

[Christopher]

Hi there,

Add this as well :

.home .x-navbar .x-navbar-inner.alt-color .mobile .x-nav li > a:hover, .home .x-navbar .x-navbar-inner.alt-color .mobile .x-nav li.x-active > a, .home  .x-navbar .x-navbar-inner.alt-color .mobile .x-nav li.current-menu-item > a, .home .x-navbar .x-navbar-inner.alt-color .mobile .x-nav li a {
    color: #fff;
}
.home .x-navbar .mobile .x-nav li > a:hover, .home .x-navbar .mobile .x-nav li.x-active > a, .home .x-navbar .mobile .x-nav li.current-menu-item > a, .home .x-navbar .mobile .x-nav li a {
    color: #000;
}

Hope it helps.

[Author]

Posts