Sticky header not working proper

Hi,prior to this time my website sticky header was working very fine on mobile,I encounter a problem which prompted me to change my name server reload website after which I point my site back to Cloudflare by changing my name server to Cloudflare’s,but ever since my header has not been displaying proper and again when I checked with chrome developer tools everything works fine but reverse is the case when I use my mobile phone ,I checked with safari,chrome on iPhone and opera and chrome on android still not displaying properly.
Lastly my back image is not display in the about-us page

URL. Www.autruo.com

This link: https://autruo.com/wp-content/uploads/2020/11/Screen-Shot-2019-06-05-at-10.07.21-AM-1024x681-1-768x511-2.jpg
is fireing a 403 error when loaded at https://www.autruo.com/about-us/ and called from the css file ( https://2h9.212.myftpupload.com/wp-content/uploads/elementor/css/post-103.css?ver=1607165905&time=1607367053 )
But loading fine when called directly. Dont know what exactly is causing that, but may try clear cache and disable all firewalls which could prevent loading the file. But actually this seems to me like its an origin server error. Cloudflare is NEVER triggering 4xx errors, its just forwarding them. So the rootcause is at your origin server.

Cant confirm that as I dont know if “switching to Cloudflare” was the only change which was done at that time. Also I can not call the page without Cloudflare. Dont want to say its not true, but could be everything. Please try to “Clear ALL Cache” at Cloudflare and try again.

But in the end I do not see any single error related to anything that could be caused because of Cloudflare.

1 Like

Thanks m4rtin…
I don’t think itheme should cause it,the image was embed in background before using color overlay using elementor

Again by default the header displays that way,but when I point my name server to cloudflare then it usually fix that issue,but after reloading the backup again it has not been able to fix the issues this time…

Again when my site is loading I use to see myupload ,secureservercdn and autruo at the left lower end of my screen,how can I make it autruo only…

Again I have purge my cache many times but It don’t seams to fix any thing,in fact I can still see the first speed analysis that cloudflare carry out when I sign up with them,in the detail it wrote 16 of November.i believe the problem is that I have not been able to purge my cloudflare cache although I click on but It don’t seamz to be effective…

Actually your CSS and JS files have been pushed to myupload & secureservercdn, but to revert that you have to change it in the application which is producing the DOM (HTML file) because just there is written where to load the necessary files.

As you are using WordPress please search for all installed plugins which could replace the links in your DOM (with RegEx for example) to myupload & secureservercdn domains.
as they actually use the technique of “realCDN”, but as CloudFlare is a proxyCDN they do have conflicts.

Because as long as these links are pointing to these domains, you have to change the files there and not at CloudFlare/YourApplication to take effect!

So maybe turn off all other CDN Plugins and try to wipe/clear cach again (at WordPress). Then it should take effect immediately

At the moment I don’t have cdn plug-in on my wordpress apart from the one on my GoDaddy dashboard.Again I think that my might be the problem…but that will be tomorrow because my laptop battery is low at the moment ,I will turn it off and see,please can you share your social contact,believe I have more to learn from you

Please DO NOT share any contacts here. This community forum is public and everyone could catch your infos and abuse them!

Fact: in your HTML files are requested from other secureservercdn.com which is a standard GoDaddy CDN Service.
May I ask if you do have any GoDaddy Plugin insalled?
If so turn the CDN (or the whole Plugin) off. this should help.

Please notice that I will not give any personal/private help here. Also i will not share any other personal information here except the one which are already published here.

Ok thanks,I switch off the cdn on my GoDaddy dashboard and it managed to fix the about us page issue but not the sticky header glitch on mobile.
Again I also notice that on opera mini,i mean the mobile version,my drop down icon bar,slide arrow have change to box with two diagonal within .

This seems to be due to your CSS, try to fix your CSS and it should work again.

After making changes to the CSS clear cache if the files in CloudFlare or set ClouFlare to develop-mode and you will see changes immediately. But then its not cached. That what this mode is for

this is my css…

pls help me have a look on the above…

Sorry we can not help you when it comes to your custom CSS as it is not related to CloudFlare.
Please hire a frontend-webdeveloper for this.

2 Likes

Besides the CSS issues @M4rt1n has pointed, you site is also returning an error for a non-existing JavaScript file when you visit it with a mobile user agent.

To reproduce this, please visit your site on Chrome with Dev Tools open > Network Conditions, and select a mobile user agent, then reload the page.

You should head to WordPress.org Documentation and ask them for further help, as none of these errors is related to Cloudflare, but more likely to faulty plugins, faulty theme, misconfiguration at your installation etc.

1 Like

ok alright

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