Webpage styling not working after changes - php

I was making some changes on the header.php file of my wordpress site, related to the flag icons displayed on the top of the webpage.
After that, I loaded back the page and suddenly it all appeared messed. I undoed all the changes I've previosly done, saved and I don't know why but the page is still messed.
Just so you can see how it should be and how it's actually looking like.
I'm sort of desperate because of it, so any clue in what could be causing this is gonna be extremely helpful.
Thanks!

Sometimes with wordpress it needs a bit of time until it's changing. Also try pressing F5 to force refresh, or clear your cache.
Also, you might forgot to add some styles or other file.

Related

Wordpress comments.PHP shows cached version on incognito BUT new version for logged in admin

I've been bumping my head around this for quite a while now. I've added some code to the comments.php function which is loaded on some pages. That code, however, does not work on ALL pages in the incognito browser, but strangely enough, it works on some of them.
When I'm using admin users, it pretty much works on all of them.
What can the problem with this even be?? I've tried flushing cache, disabling it, nothing helps. I'm using Elementor as well if that helps.
If anyone has any idea, I would highly appreciate it, any help is welcome.
UPDATE:
Wordpress sorcery has no bounds. Okay, when I find that certain "post" where I want to see the changes and just click on "Update" button with NO REAL UPDATES DONE in that file, it works and shows up new code from comments.php. But come on, I have tons of those posts, do I really need to "Update" each of them? Is there a smarter way to do this?

Blank space above header (seems to be random content)

i'm building a Wordpress website from scratch (plugin + template) and made today my header/sidebar.
The problem is that i have a blank space at the top of the website and don't know where it comes from.
When i inspect it i have this.
And here is the blank :
Thanks all...
i'm pretty sure this is due to the wordpress admin bar, try logging off and getting back on your website local host page without being logged on to wordpress. This should be only visible on the admin side, if not once you're logged off, try pasting the source code, will take a look.
thanks for all the answers. Nothing was left in the header.php (checked twice) and tried too to go on the website without being logged but it was not that. I fixed it by sticking by header to top :/
Thanks !

Google Chrome won't update CSS

I just started working on a Wordpress theme, but it won't reload the stylesheet after I update. I searched throughout here and tried the common remedies, including:
Reload holding ctrl/shift
Reload while Developer Tools is open
Reload twice quickly in a row
Get firefox/firebug
Add the timestamp generator to the end of the href
Install an extension, specifically this one: https://chrome.google.com/webstore/detail/clear-cache/cppjkneekbjaeellbfkmgnhonkkjfpdn?utm_source=chrome-app-launcher-info-dialog\
It seems like it only reloads every once in a while, and it really impedes my ability to write CSS...
Does anyone here have any ideas to fix this?
Thanks.
edit: I think it may have something to do with my host (it's free). I'm just going to move offline for development, I think.
You can always go into Incognito which does not use any chached data. It also does not save any history information.
To use it you can press Crtl+Shift+N then navigate to the page / website that you want to see.
You can also access Incognito by pressing the ☰ icon in the top right of your chrome window and click on New incognito window:
If your page is still not updating I would make sure that the file is even being saved. Because at this point your issue would not be because of files being cached..
My only other thought is that it could be your CSS itself... Sometimes your CSS is not applied due to an error in your code, another piece of code counteracting it, etc...
So see what is being applied:
press F12
OR
right click somewhere on your page and press Inspect Element.
You should see something like this (except with your code / webpage):
The parts of the "Inspect Element" will be sized slightly different but you can change those around...
Essentially click on the html element that you are trying to change the css on...
You will now see what css elements are being displayed... If they are crossed out, it most likely means that there is some other parent (or just some other property) that is canceling out the css you are adding.
These are just some of the reasons why the CSS may not be working! But I hope this helps!
When working with child theme, make sure you are loading the right css file. Sometimes you load the parent's css file.
Make sure to disable cache plugin in development time.

Blank space at the bottom of page when using BACK with CHROME

Not sure how to ask this question properly.
If you go on the website I'm currently working on:
My Website
The page loads fine, but if you go to another page or link afterwards and then hit BACK, the same page loads with a huge blank space at the bottom. If you refresh the page, it fixes itself. The website pcgamer.com seems to have the same problem.
Here is my HTML/PHP and CSS:
Source Code
EDIT 1: Removing the facebook plugin seems to solve the problem, but how can I use the plugin without having this issue ?
disable facebook like plugin and check it will fix your problem
I just check your web and I think I got your problem. You set .bodymainwrap to has height of 2100px. Please delete the css height:2100px; at .bodymainwrap selector. I'm sure it'll work.

Fancy Box and Jquery Tiny Scroll Bar Prolem

I am working on a page and having problem with the Fancybox close action for the Image gallery in the first button at the bottom, the gallery is closed but overaly is still there. Here is the test link
How ever the same settings are working for the second link "Floor Plan".
Secondly I am using a Tiny Scrollbar plugin for the gallery on the page. The thumbs on the left side have blue scroll bar if they are larger in contents. This scroll bar does not appear in Google Chrome, and sometime don't show up even in other browser if the page loads first time, then I have to refresh the page to show it. Any idea about the problem will be greatly helpful.
Thank you!
First off, I noticed you're suing jQuery 1.3, why?
Here's 1.6:
http://jquery.com/
It isn't that much larger, and its an updated library. That may fix your problem.
If that didn't work, then delete the fancybox.js, re-downlod and put it in again, same with css. Make sure the css is called at the end of your css document.
If that doesn't work, I suggest getting rid of your javascript files one by one until there is only fnaycbo xleft, it's obviously some conflicting code at this point, so you'll have to troubleshoot by trial and error, going through one by one to findout what script is preventing close. I don't have access to your server, so I can't test it.
It's most likely in main.js, so remove that first, and see if fancybox works then!
ETA: Scrollbar fix.
The problem is something is adding a disabled selector, it's javascript. But you could change up tinyscrollbar.js to fix it, or you could go to your css, find the line:
'#scrollbar1 .disable {display:none}
and remove that line entirley, it's causing your scrollbar not to appear in browsers the javascript is (for some reason) disabling in.
In my case I solved with the next modification:
$(document).bind("load", function() { $('#myTinyScrollbar').tinyscrollbar(); });
Well you have an error in console:
d.onClosed is not a function
It could be because:
Your using an old version of jQuery possibly not supported by Fancybox. Try updating to 1.6, though beware legacy plugins or code that could break due to the steep upgrade.
A compression issue. It's possible i.e. the Google Closure could of removed what it saw as "unneeded" code and therefore broke the functionality. Try using uncompressed Fancybox to see if it fixes it, if it does then you know this the issue, rather than your jQuery version.

Categories