Docs

[Right Angle S]

Hello,

We’ve put a custom text band below the menu bar on a new website we’re building however we can’t seem to adjust the depth of the band. We would like the bottom padding below the text to sit closer to it and be smaller in depth.

http://retailreimagined.co.uk/home/

the code we’ve added to the wp-header.php file is the following:

<?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 x_get_view( 'global', '_slider-below' ); ?>
  <?php x_get_view( 'integrity', '_landmark-header' ); ?>
<?php echo do_shortcode('[vc_row padding_top="0px" padding_bottom="2px" border="none" bg_color=“#000000” class="man"][vc_column width="1/1"][visibility type="hidden-phone"][vc_row_inner inner_container="true" no_margin="true" padding_top="0px" padding_bottom="0px" border="none"][vc_column_inner width="3/4"][text_output]
<p style="margin: 0px; font-size: 16px;"><span style="color: #F37021; letter-spacing: 2px;">delivering success through collaborative consulting</span></p>
[/text_output][/vc_column_inner][vc_column_inner width="1/4"][text_output]
<p style="font-size: 16px; text-align: right;"><span style="color: #FFFFFF; letter-spacing: 2px;"><a href=mailto:cathy@retailreimagined.co.uk>cathy@retailreimagined.co.uk</a></span></p>
[/text_output][/vc_column_inner][/vc_row_inner][/visibility][visibility type="visible-phone"][vc_row_inner inner_container="true" no_margin="true" padding_top="0px" padding_bottom="0px" border="none" class="mbn" style="padding-bottom: 0px; margin-bottom: 0px"][vc_column_inner width="1/1"][text_output]
<p style="margin: 0px; font-size: 16px; text-align: center;"><span style="color: #F37021; letter-spacing: 2px;">delivering success through collaborative consulting</span></p>
[/text_output][text_output]
<p style="font-size: 16px; text-align: center;"><span style="color: #FFFFFF; letter-spacing: 2px;"><a href=mailto:cathy@retailreimagined.co.uk>cathy@retailreimagined.co.uk</a></span></p>
[/text_output][/vc_column_inner][/vc_row_inner][/visibility][/vc_column][/vc_row]'); ?>
  <?php x_get_view( 'global', '_slider-revolution-below' ); ?>
  
  <?php x_get_view( 'renew', '_landmark-header' ); ?>

Thank you for your help.

Nick

[Paul R]

Hi Nick,

Please change your code to this.

<?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 x_get_view( 'global', '_slider-below' ); ?>
  <?php x_get_view( 'integrity', '_landmark-header' ); ?>
<?php echo do_shortcode('[vc_row padding_top="0px" padding_bottom="2px" border="none" bg_color=“#000000” class="man"][vc_column width="1/1"][visibility type="hidden-phone"][vc_row_inner inner_container="true" no_margin="true" padding_top="0px" padding_bottom="0px" border="none"][vc_column_inner width="3/4"][text_output]
<p style="margin: 0px; font-size: 16px;"><span style="color: #F37021; letter-spacing: 2px;">delivering success through collaborative consulting</span></p>
[/text_output][/vc_column_inner][vc_column_inner width="1/4"][text_output]
<p style="margin: 0px;font-size: 16px; text-align: right;"><span style="color: #FFFFFF; letter-spacing: 2px;"><a href=mailto:cathy@retailreimagined.co.uk>cathy@retailreimagined.co.uk</a></span></p>
[/text_output][/vc_column_inner][/vc_row_inner][/visibility][visibility type="visible-phone"][vc_row_inner inner_container="true" no_margin="true" padding_top="0px" padding_bottom="0px" border="none" class="mbn" style="padding-bottom: 0px; margin-bottom: 0px"][vc_column_inner width="1/1"][text_output]
<p style="margin: 0px; font-size: 16px; text-align: center;"><span style="color: #F37021; letter-spacing: 2px;">delivering success through collaborative consulting</span></p>
[/text_output][text_output]
<p style="margin: 0px;font-size: 16px; text-align: center;"><span style="color: #FFFFFF; letter-spacing: 2px;"><a href=mailto:cathy@retailreimagined.co.uk>cathy@retailreimagined.co.uk</a></span></p>
[/text_output][/vc_column_inner][/vc_row_inner][/visibility][/vc_column][/vc_row]'); ?>
  <?php x_get_view( 'global', '_slider-revolution-below' ); ?>
  
  <?php x_get_view( 'renew', '_landmark-header' ); ?>

Hope that helps.

[Right Angle S]

That’s worked a treat!

Thank’s very much for your continued support.

Nick

[Rupok]

You are welcome Nick!

Glad that it helped. Feel free to let us know if you face any other issue. We’ll be happy to assist you.

Thanks for using X.

Cheers!

[Right Angle S]

Hi Rupok, there is another issue that’s arisen that i’m hoping you can help with.
The email address on the right hand side does not align right with the menu in desktop view (the search icon/magnifying glass.)

As you resize the browser we would like it to stay aligned right in line with the right hand side with the menu.

http://retailreimagined.co.uk/home/

<?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 x_get_view( 'global', '_slider-below' ); ?>
  <?php x_get_view( 'integrity', '_landmark-header' ); ?>
<?php echo do_shortcode('[vc_row padding_top="0px" padding_bottom="2px" border="none" bg_color=“#000000” class="man"][vc_column width="1/1"][visibility type="hidden-phone"][vc_row_inner inner_container="true" no_margin="true" padding_top="0px" padding_bottom="0px" border="none"][vc_column_inner width="3/4"][text_output]
<p style="margin: 0px; font-size: 16px;"><span style="color: #F37021; letter-spacing: 2px;">delivering success through collaborative consulting</span></p>
[/text_output][/vc_column_inner][vc_column_inner width=“1/4”][text_output]
<p style="margin: 0px;font-size: 12px; line-height: 30px;"><span style="color: #FFFFFF !important; letter-spacing: 1px;"><a href=mailto:info@retailreimagined.co.uk><font color=“#000000">info@retailreimagined.co.uk</font></a></span></p>
[/text_output][/vc_column_inner][/vc_row_inner][/visibility][visibility type="visible-phone"][vc_row_inner inner_container="true" no_margin="true" padding_top=“10px" padding_bottom=“10px" border="none" class="mbn" style="padding-bottom: 10px; padding-top: 10px; margin-bottom: 0px"][vc_column_inner width="1/1"][text_output]
<p style="margin: 0px; font-size: 16px; line-height: 20px;"><span style="color: #F37021; letter-spacing: 2px;">delivering success through collaborative consulting</span></p>
[/text_output][/vc_column_inner][/vc_row_inner][/visibility][/vc_column][/vc_row]'); ?>
  <?php x_get_view( 'global', '_slider-revolution-below' ); ?>
  
  <?php x_get_view( 'renew', '_landmark-header' ); ?>

Thanks again for your help.

Nick

[Nabeel A]

Hi again,

Please add the following code in your Customizer via Appearance > Customize > Custom > Edit Global CSS:

#x-content-band-2 .x-column:last-of-type {
    float: right !important;
}

Let us know how this goes!

[Right Angle S]

Hi Nabeel,

Thank you for your help.
I have added your code to the Global CSS, unfortunately this hasn’t made any difference.
Is there anything else we could try?

Thanks,

Nick

[Thai]

Hi Nick,

You forgot to close the curly bracket(}) in your custom CSS.

Please find this CSS:

.x-content-band {
    margin: 0 0 1.313em;
    padding: 0px 0;
#x-content-band-2 .x-column:last-of-type {
    float: right !important;
}

And change to this:

.x-content-band {
    margin: 0 0 1.313em;
    padding: 0px 0;
}
#x-content-band-2 .x-column:last-of-type {
    float: right !important;
}

Hope it helps 🙂

[Right Angle S]

Doh! Can’t believe i missed that, but then again it is Monday morning…

That’s worked great thanks for your help!

The only problem we have now is on tablet (portrait view) where the email address is dropping down on to a second line.
Is there way to keep it on the same line as there looks to be some space to the right after “consulting.”

Many thanks!

Nick

[Lely]

Hello Nick,

Can you give us your admin credentials so we can check your settings? There seems to be a Container columns issue.
See attached screenshot.

[Paul R]

Hi Nick,

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

.site > #x-content-band-1 .x-column.x-3-4 {
   max-width: 470px;
}

Hope that helps.

[Right Angle S]

That worked perfectly, thanks again for the incredible support!

[Thai]

You’re most welcome 🙂

[Author]

Posts