Non-sticky Header Mobil - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!

Non-sticky Header Mobil

L

lluis

SP Page Builder 3 years ago

Is it possible to have sticky header on desktop devices and non-sticky header on mobile? Thank you

0
19 Answers
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #88016

Hi

Thanks for contacting us. Yes you can do it via custom CSS. First you have to select this option for Desktop sticky header

https://prnt.sc/URNcLQDX5D_J

Then for Non sticky header on mobile you have to use this custom CSS

@media (max-width: 767px){
#sp-header.header-sticky{
    position:unset !important;
}

}

Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

-Regards.

0
L
lluis
Accepted Answer
3 years ago #88312

Thanks for your reply. Unfortunately this didn't work for me. I do not use the header that you indicate me. I leave the client's website hidden since I am not authorized to publish it. I appreciate your help

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #88413

Give me your super admin access on the hidden content please I need to check.

0
L
lluis
Accepted Answer
3 years ago #88481

Access sent. Thank you

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #88561

Now check please.

0
L
lluis
Accepted Answer
3 years ago #88584

Thanks for your reply, still not working. I am attaching hidden screenshots so you can see the error in more detail. As you can see in the third screenshot, the sticky header appears when scrolling the page. Tested on iphone. Thanks.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #88764

Now check please. Its working on my end.

0
L
lluis
Accepted Answer
3 years ago #88782

I don't understand :(. You do not see the sticky header with a colored background at any time when you scroll the page on a mobile device.? How does the third screenshot show? This sticky header would not have to appear, it would have to directly displace the transparent one. I've cleared all caches and it's still showing up.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #88806

Isn't it non sticky??

https://prnt.sc/L_cT_v-Dse8R

0
L
lluis
Accepted Answer
3 years ago #88812

Dear Mehtaz, I sent you a video of my mobile screen in a hidden section. I don't doubt his word. I have all the caches clean, those of the browser and those of Joomla, I can only think that, if you confirm that you see it different from the video, my server has some type of cache activated. I appreciate your support again.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #89063

Please see the screen record below. It seems ok on my end.

0
L
lluis
Accepted Answer
3 years ago #89098

Dear Mehta, it doesn't work for you either! Note that the header is transparent and the sticky header has a colored background. When scrolling the page, the colored sticky header appears, which is what does not have to appear. I send you again an illustrative image in hidden, if you think it necessary, re-view the screen video that I sent you, to see the effect. Thanks.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #89249

Please see my video again. And seriously I don't know its fine on my end. I am also checking it with my colleagues. I don't know what's the issue. See my screenshot again

https://prnt.sc/nivEu7WkOaFY

0
L
lluis
Accepted Answer
3 years ago #89272

Dear Mehtaz, sorry maybe I don’t explain it correctly. My english is not good. For this reason, my daughter records a new screen recording voice explaining the problem at the exact moment that it appears. The video is in the section hidden content. I wish we can resolve the problem because it is urgent. Thanks!!

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #89277

This is your link right? I need to check from here right?

0
L
lluis
Accepted Answer
3 years ago #89288

yes! the link is right. thanks!

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #89290

I hope now its clear to you. Its totally fine on my end. Please see the video carefully.

0
L
lluis
Accepted Answer
3 years ago #89300

Dear Mehtaz. This is the solution that he offered me the first day, it is not correct for me, I think it is demonstrated in the videos that I sent to you and you to me :(

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 3 years ago #89947

Can you share working access ... we cannot check anymore.

The CSS code should be OK.

0