Docs

[Team Traceur]

Hello,

Can I get the Revolution slider above my nav bar, but below my logo bar? I am using a stacked look. My page is under construction at the moment so if you need to see the page I will have to get you into the backend.

Cheers 🙂

[Zeshan]

Hi there,

Thank you for writing in!

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. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

After that, copy the file wp-content/themes/x/framework/views/renew/wp-header.php in your child theme’s folder /framework/views/renew/, open the file in a text editor and replace entire code with following:

<?php

// =============================================================================
// VIEWS/RENEW/WP-HEADER.PHP
// -----------------------------------------------------------------------------
// Header output for Renew.
// =============================================================================

?>

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

  <?php x_get_view( 'global', '_slider-above' ); ?>

  <header class="<?php x_masthead_class(); ?>" role="banner">
    <?php x_get_view( 'global', '_topbar' ); ?>
    <?php x_get_view( 'global', '_navbar' ); ?>
  </header>

  <?php if ( !x_get_logo_navigation_layout() == 'stacked' ): ?>
    <?php x_get_view( 'global', '_slider-below' ); ?>
  <?php endif; ?>
  <?php x_get_view( 'renew', '_landmark-header' ); ?>

Next, copy the file wp-content/themes/x/framework/views/global/_navbar.php in your child theme’s folder /framework/views/global/, open the copied file in a text editor and replace entire 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-fluid max width">
        <?php x_get_view( 'global', '_brand' ); ?>
      </div>
    </div> <!-- end .x-logobar-inner -->
  </div> <!-- end .x-logobar -->

  <?php x_get_view( 'global', '_slider-below' ); ?>

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

<?php else : ?>

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

<?php endif; ?>

Hope this helps. 🙂

Thank you.

[cooper2121]

Will the same code work for integrity? Id like the logobar to be on top, then the slider, then the navbar. while i scroll down, the logobar remains static while the slider and the navbar scroll as normal. Once the navbar reaches the logobar (to appear as the stacked look that i have now) the navbar pushes up the logobar to then have a static top navbar (as I have now). Is this possible? Also, I only want this on my landing page. For the rest of the pages, the normal logobar then navbar stack that comes standard works best. I hope this isnt way to confusing.

[cooper2121]

This reply has been marked as private.

[Nabeel A]

Hi there,

Thanks for writing in! For the integrity theme, you can create a new file and name it wp-header.php and paste the following code inside:

<?php

// =============================================================================
// VIEWS/INTEGRITY/WP-HEADER.PHP
// -----------------------------------------------------------------------------
// Header output for Integrity.
// =============================================================================

?>

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

  <?php x_get_view( 'global', '_slider-above' ); ?>

  <header class="<?php x_masthead_class(); ?>" role="banner">
    <?php x_get_view( 'global', '_topbar' ); ?>
    <?php x_get_view( 'global', '_navbar' ); ?>
    <?php x_get_view( 'integrity', '_breadcrumbs' ); ?>
  </header>
	<?php if ( !x_get_logo_navigation_layout() == 'stacked' ): ?>
		<?php x_get_view( 'global', '_slider-below' ); ?>
	<?php endif; ?>
	<?php x_get_view( 'integrity', '_landmark-header' ); ?>

Upload this file to \x-child\framework\views\integrity\ directory in your Child Theme. Then you can create a new file with the name of _navbar.php and paste the following code inside:

<?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-fluid max width">
        <?php x_get_view( 'global', '_brand' ); ?>
      </div>
    </div> <!-- end .x-logobar-inner -->
  </div> <!-- end .x-logobar -->

  <?php x_get_view( 'global', '_slider-below' ); ?>

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

<?php else : ?>

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

<?php endif; ?>

Upload this file to \x-child\framework\views\global\ directory in your child theme as well.

Let us know how this goes!

[cooper2121]

This reply has been marked as private.

[cooper2121]

This reply has been marked as private.

[cooper2121]

Sorry for the posts, it wont let me upload a full screen snapshot. ill try again.

[Nabeel A]

Hi again,

Thank you for providing the screenshots, I was able to find the mistake you’ve done by replicating it on my localhost. You have not copied the wp-header.php code completely. You’ve missied <?php by mistake in the start of the code. Please make sure you completely copy and paste the code. I’m pasting the code here again so you can copy this again:

<?php

// =============================================================================
// VIEWS/INTEGRITY/WP-HEADER.PHP
// -----------------------------------------------------------------------------
// Header output for Integrity.
// =============================================================================

?>

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

  <?php x_get_view( 'global', '_slider-above' ); ?>

  <header class="<?php x_masthead_class(); ?>" role="banner">
    <?php x_get_view( 'global', '_topbar' ); ?>
    <?php x_get_view( 'global', '_navbar' ); ?>
    <?php x_get_view( 'integrity', '_breadcrumbs' ); ?>
  </header>
	<?php if ( !x_get_logo_navigation_layout() == 'stacked' ): ?>
		<?php x_get_view( 'global', '_slider-below' ); ?>
	<?php endif; ?>
	<?php x_get_view( 'integrity', '_landmark-header' ); ?>

Please make sure you copy this completely and paste it in wp-header.php file of your child theme.

Let us know how this goes!

[cooper2121]

I very much appreciate your assistance. It’s looking great and I think I’m almost there! The last thing would be to make the logobar remain where it is on top while scrolling down, until the navbar replaces it. How would I go about doing this?

[Friech]

Hi There,

Further customizations from here would be getting into custom development, which is outside the scope of support we can offer. If you need more in depth changes, you may wish to consult with a developer. X is quite extensible with child themes, so there are plenty of possibilities.

Thanks for understanding.

[cooper2121]

Thanks for your help! I appreciate your help to this point!

[Nico]

Thank you so much for understanding.

Feel free to ask us again if it is not beyond the scope of our limitation

Thanks. 🙂 Have a great day! 🙂

[uncleshneerson]

Hi, all!
I need help again

i read this https://community.theme.co/forums/topic/trying-to-combine-inline-and-stacked-layouts-with-revolution-slider-behind/ and can combine ‘INLINE’ and ‘STACKED’ layouts with diferent logo.

But i can’t replace Logo bar (with big logo) in “stacked layout” to revolution slider. or simple hide it…
I try paint what i need

my site http://point11.co/realestate/

Can you help me?

Thx

[uncleshneerson]

sorry my file was so big (

[Author]

Posts