Topic: Text band below menu bar

Tagged: x

Author

Posts

January 12, 2017 at 3:37 am #1326958

Participant

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

January 12, 2017 at 6:46 am #1327102

Paul R

Moderator

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.

January 12, 2017 at 7:58 am #1327176

Right Angle S

Participant

That’s worked a treat!

Thank’s very much for your continued support.

Nick

January 12, 2017 at 9:37 am #1327321

Rupok

Member

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!

January 13, 2017 at 9:27 am #1328818

Right Angle S

Participant

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

January 13, 2017 at 1:11 pm #1329090

Nabeel A

Moderator

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!

January 16, 2017 at 3:32 am #1331730

Right Angle S

Participant

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

January 16, 2017 at 4:06 am #1331765

Thai

Moderator

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 🙂

January 16, 2017 at 4:24 am #1331792

Right Angle S

Participant

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

Attachments:

You must be logged in to view attached files.

January 16, 2017 at 5:07 am #1331843

Lely

Moderator

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.

Attachments:

You must be logged in to view attached files.

January 16, 2017 at 5:08 am #1331846

Paul R

Moderator

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.

January 16, 2017 at 6:17 am #1331918

Right Angle S

Participant

That worked perfectly, thanks again for the incredible support!

January 16, 2017 at 6:21 am #1331921

Thai

Moderator

You’re most welcome 🙂

Author

Posts