Pro header builder: greyish overlay on headers?

Hi,

this is our first time trying out X theme Pro and it’s header builder… searched for quite a time now but doesn’t find a solution: Please see here. The header with the logo and search (and also the content “Nothing to Show Right Now”) is some how greyish… even though we set #ffffff (white) for eversthing we could find.
Can you point us in the right direction? I am sure this is a setting somewhere for boxshadow, overlay, or something similar.

Thanks and looking forward to explore the new power of the Pro version!

Hi Alexander,

Thank you for reaching out to us. Are you referring to the box shadow around the navigation bar?

If that’s the case then Inspect the Bar that contains the Inline Navigation element in Header Builder and remove the Box Shadow of the bar:

Let us know how this goes!

1 Like

Ah yes, that did it! Thanks a lot!

Any help for getting the social icons in footer to appear in line next to each other? Here

Hello Alexander,

Thanks for updating the thread.

I suggest you to move social icon to a separate container. After that please inspect the Bar and under Flexbox > Child Placement select Row.

Thanks.

Thanks, I did this. The icons are now in line but they are not under the Newsletter column now anymore… How to fix this? Sorry we’re learning Pro right now.

Hello Alexander,

Thanks for updating the thread.

Actually in previous thread it was mentioned that you wanted social icons next to Newsletter. Please correct me if I misinterpreted the same. You want icons to be show after the Buttons or next to the Newsletter module?

Please confirm the same and we will be happy to assist you further.

Thanks.

Hi,

we wanted Facebook and Instagram next to each other in one line but below “Abonnieren”-button. Thanks.

Hi Alexander,

Thank you for the clarification.
I can see you have 5 containers and the fifth container has 2 icons FB and instagram.
Please try this steps.

1.) Move those 2 icons after the button ABONNIEREN on the fourth container.
2.) Delete the fifth container.
3.) Set the FLEXBOX settings of the fourth container to this:

4.) Set NEWSLETTER headline and the text element width to 100%.
5.) Add a GAP element after the button. This will move the button below it.

See this sample: https://screencast-o-matic.com/watch/cq66XluTq2

Hope this helps.

Thanks, we tried this without success. :frowning: Is this correct for width for headline and text? It wasn’t shown in the screencast:

In the builder preview it shows correct but not on live site. See preview;

Hey Alexander,

To save us time exchanging responses, please provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password

To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Thanks.

Thanks I’ll add it in secure note.

Hi Alexander,

Please follow this steps. Add a 20px bottom margin on your button, so this will balance out the space above and below your button (Abonnieren).

Then that Gap element below the button, change the direction of that to Horizontal, and set the Gap size to 100%.

You can learn more about this new Flexbox features on our Youtube Channel.
Flexbox for Rows and Columns (Part 1)
Flexbox for Rows and Columns (Part 2)

Hope it helps,
Cheers!

1 Like

Thanks, it’s fine now!

You’re welcome!
We’re glad @friech’s solution works out for you.

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