Background header and navigation questions

Hello,

I’m sorry to bother you but I’m experiencing some problems with developing a new website. I’ve searched for answers on this forum and tried a lot of things but not succesfull.
I use stack renew and X. Here are my questions. I hope so much you can help me.
I will sent you my credentials in a secure note.
Header
Because I wanted a header with a slider I made a custom header. I inserted it on pages with a blank –no container- no header-no footer template. The strange thing is: on the homepage there is a thin grey line under the header which is not the case on this page: http://deambachtsschool.org/de-mensen/ The header-section is exactly the same. How can I resolve this?
Navigation: for mobile users I’ve made a row with navigation dropdown. But the menu is disappearing behind the section that follows. What to do about that? See on this page : http://deambachtsschool.org/de-mensen/

I noticed that generated pages (like the blogpage and the page dedicated to activities) can only use the standard template. Therefore I cannot use my custom header. These pages are getting the standard header. The mobile navigation is transparant and therefore not so clear. How can I configure this? See for instance http://deambachtsschool.org/blog/ on a mobile device.

Kind regards, Marjolijn

Hi there,

First of all, thank you for your message. The header that you have seems to be simple enough to use the Above the Master functionality of the theme to achieve the look you want. I wonder why you used that much of custom code with the flex slider.

I suggest that you read the article below and the section regarding how you can use the slider Above the Masthead:

If you prefer to work on the customization you have, then I will follow up the questions:

  • The Flexslider shortcode which you used is with the container, the container of the slider has a border. You can easily remove that border by adding the CSS code below to X > Launch > Options > CSS:
.x-flexslider-shortcode-container.with-container {
    border: none;
}
  • I am not sure how you added a functionality of the Pro theme to X but we do not support that. This is part of a customization that you have done by yourself and is outside of our support scope, we can not maintain such a code. We can only suggest a temporary CSS fix which may or may not work and we will not be responsible for such a code to work. If you want to have the functionality you are after you need to purchase the Pro theme.
.el13.x-section {
    padding: 85px 0 26px 26px !important;
}
  • The last question is again in the line of the customization you have done which we do not support and recommend. For such cases, you will need to code a separate page Template yourself or use the WordPress template hierarchy to override the behavior of the header yourself. For more information:

https://developer.wordpress.org/themes/template-files-section/page-template-files/

https://developer.wordpress.org/themes/basics/template-hierarchy/

Thank you for your understanding.

Hi @christopher.amirian

Thanks for your answer. I tried your suggestion and made a revolution slider instead. This works better with the navigation. Only one question left:

As you can see on this page http://deambachtsschool.org/blog/ there is a big white space between the slider and the navigation. I don’t know how to configure this. How can I specify the height of the slider? So that the navigation will be shown directly underneath?

Regards Marjolijn

Hello There,

You do not have to specify the height of the slider. You are having this issue because you have set the navbar top link alignment to 300px. Please go to X > Launch > Options > Header > Links - Alignment and set it to just 30 only.

Hope this helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.