[trexmaParticipant]

#11625

Dear Support Team,

I have some issues with the header in my site:

1- I use the theme as box layout So when I set the header to 30% transparent the header is having full width, below with a screenshot

https://snag.gy/NpWQhf.jpg

2- If I want to have 2 raws in my header and I wanted the first one to be normal and the second one to be transparent, how can I achieve this .

3- When I set the header to transparent I put the logo as white color and the header is sticky, So when I scroll down the logo will not appear, coz its white and the background is white, Is possible to put different when the header goes to sticky mode

[Ahmed YasserModerator]

#11626

Hi trexma,

1- We will add a fix for this issue in the upcoming update, but for now you can add the following css code to your site.

.boxedLayout header.preSticky.activeSticky, .boxedLayout header.overlayedHeader {max-width: 970px;}
@media (min-width: 1200px) { .boxedLayout header.preSticky.activeSticky, .boxedLayout header.overlayedHeader {max-width: 1230px;}

2- There’s no option to add a transparent background to a row.

3- There’s no option to change the logo.

For issue 2 & 3 maybe I can help with custom css if can you send a link to the page, also admin credentials would be great.

Best Regards.

[trexmaParticipant]

#11628

This reply has been marked as private.

[trexmaParticipant]

#11629

Hello Support Team,

Any update on this please

Thank you

[Ahmed YasserModerator]

#11633

Hi trexma,

I’ve fixed the header position.

About number 2. Unfortunately this is not doable in this theme, I tried adding custom css but it broke the row color in responsive.

For number 3. You can’t change the logo image, but you can change the background of the row when it’s sticky. I’ve already made this change, you can check it on your website.

About your last request, you can select a different header to appear in a specific page. Right now you’re Using the overlay header option which overlaps with the page title in some pages. All you need to do is create a new header and choose header type to be default Header.

I’ve added a new header in your theme. When you edit a page, you’ll find a tab called ” (Circleflip) Header Builder ” containing a select drop down that you choose from it which header you want to display for this page.

Let me know if this fixes your issue.

[trexmaParticipant]

#11634

This reply has been marked as private.

[trexmaParticipant]

#11635

This reply has been marked as private.

[Ahmed YasserModerator]

#11636

Hi Trexma,

I fixed the sticky header position, sorry about that. Here’s the overall style that’s been added to your theme:

.boxedLayout header.preSticky.activeSticky, .boxedLayout header.overlayedHeader {max-width: 970px;margin-left: auto;margin-right: auto;left: 0;right: 0;}
@media (min-width: 1200px) { .boxedLayout header.preSticky.activeSticky, .boxedLayout header.overlayedHeader {max-width: 1230px;}

I see you managed to place a global header for all the pages and a custom one for the home.
If you need any further help, please let me know.

Best Regards

[trexmaParticipant]

#11637

Now everything looks fine, but there is one more thing please

If you look at the home page the breaking news section width is not matching with the slider/site width, we need to fix that please.

Or if its possible to exclude the breading news from benign transparent, I mean the first 2 raw in the hear to be transparent but the breaking news to be normal

Thank you

[Ahmed YasserModerator]

#11649

Hi trexma,

I fixed the breaking news section width. I added a custom class to your header row that contains the breaking news block and applied to following css to your theme.

.breakingNews .movingHead {float: right;}
@media (min-width: 768px) {.breakingNews .container {width: auto;margin: 0 10px;}}

Best Regards