How-to: Fix the flash on page load 3.2.x (FOUC)

Thanks David!!!
Had problems with both the flash and the content of pages moved a bit when loading. This fix solved it all.

I get this error, when inserting the above code into functions.php: Fatal error: Call to undefined function add_action() in /var/www/vhosts/tinnethorup.dk/httpdocs/wp-includes/functions.php on line 2896

Can anyone explain why?

Thanks in advance ??

NOTE: I was inserting the code in the wrong functions-file – should have been in the functions-file in the themes folder. Didn′t work anyway though,

David
Sorry, but what/where is the STYLESHEET CALL?

Sorry, but what/where is the STYLESHEET CALL?

It’s usually located near the top of your theme’s header.php file.

I am going to try adding the print.css to my root directory. I am using BlueHost and I think the root directory is in MyPhpAdmin. Is this correct? I have taken a look inside MyPhpAdmin and I have no idea what to do. Can anyone help here?

Thanks

The root directory is not in PHPMyAdmin. It is going to be the same place that your files are installed to, and the same place where your files like index.php and wp-config.php and wp-settings.php are.

If this is your main domain, it will probably be something like public_html . If this is an addon domain, it will be something like public_html/addonfolder (where addonfolder is the name of your addon domain).

@bh_wp_fan

I read somewhere the root directory for WordPress was in MyPhpAdmin and it did seem very complicated. Yep! In tiny print but BlueHost states the public directory is the root directory. Indisputable.

I’ll give it a try now ??

Thanks so much for your reply.

@ Member: valerio-d (posted 2 months ago)

“Hello I’ve added the jQuery fix but somehow doesn’t work… I’m using the atahualpa theme, not sure if this makes any difference …”

I also used the stahualpa theme for a while, and found that there was a flicker on IE page load.

I somewhat recently tried out MagazinePremium by Bavotasan, and that one does not have a flicker with the jQuery Fix, and is a real good theme, for the type of person that likes something like Atahualpa. He has a free edition to test out if your might like to buy the premium which I thought was worth it and I’ve looked at a number of them.

@david after a day of looking for the perfect fix, finally i’ve found your jquery solution! i thought it was css related or uncached content. good job on finding the solution for the lot of us.

The javascript downgrade doesn’t work for me nor do any other solutions other than turning off javascript completely, which solves the problem.

Any new ideas on how to resolve this issue? Thanks!

Here’s the site that flashes on each page reload:
https://stjoesworkshop.com/newsite/

Beginning to think in terms of “this is feature” and “phase 2”-solutions I think I just got rid of my flickering issue – after a struggle:

I think there are several reasons this could happen.

1. I cleared whitespace after my ending HTML in footer.php (I am not sure that it helped, but I’ve convinced myself that it flickered on every page load before that (I really didn’t need to check it that much…), and afterwards it just flickered occassionally on different page loads (no pattern I think…)

2. Did same thing to wp-config.php (end) (end – I think that fixed it for me on another project (or maybe it was a white pages all over issue that fixed) – and to header.php (beginning). Although I am not sure this helps, I like to keep things clean.

3. The great difference (no flickering!) – and that could be the case for you dwzemens – was when I changed the order of .css and .js loads. wp_enqueue_script (or something like that – if you use it properly should take care of that – or maybe you can change the order in the header.php.)
I guess css-files should be loaded before js-files. Also some js-files are dependent on that other libraries are loaded – i.e- load jQuery before fancybox and so on.

And still you might have the problem because background-images can take some time to load and thus js loads before css. in that case see if this helps: https://stackoverflow.com/questions/7411541/how-to-prevent-the-white-flash-on-page-load-created-by-background-image-loadin helps.

Hope this helps someone.

Thanks LasseClaes. I am struggling to try and get the js loaded in the footer by using wp_enqueue_script, but with little success so far. I’m using Genesis with a child theme and amnot quite certain how to accomplish it.

Oh – btw. You may also want to check the Firebug console (or Chrome developer tools -> concole) once in a while. Errors here can also make content flash so they should be fixed. And – from experience – using @font-face you need to have the fonts set up for all browsers (font-squirrel has a generator for that). Just saying that CSS-related things (though loadign some fnts here) also can cause this.

dwzemens – check your console log and let me know how you are doing (and the code for loading) the scripts in the footer) ehen you figure that out. thanks.

Based on a suggestion from another forum, I added this to my functions.php file

function my_enqueue_scripts() {
	wp_enqueue_script('custom-js',
		get_stylesheet_directory_uri() . '/lib/js/custom.js',
		array('jquery'),
		'1.0',
		true
	);
}
add_action('wp_enqueue_scripts', 'my_enqueue_scripts');

Not sure why it works, because the .js file referenced in the footer is not an actual file, but for some reason this stops the flash completely.

Weird.

If anyone can explain why I’d love to hear it.

Hello people.
I recently tried out the answer immediately above and didn’t work. I am not a coding expert.
However, i deleted the above from the functions.php and now i get this problem and i cannot fix it.

Parse error: syntax error, unexpected ‘}’ in /home/slradmin/public_html/wp-content/themes/newbusiness/functions.php on line 12

THIS IS MY SCRIPT. WHERE IS THE FAULT, PLEASE HELP ME:

<?php

$theme_options = get_option(‘newbusiness’);

// php color script

include_once(‘csscolor.php’);

// Include the admin controlpanel

require_once(‘backend/controlpanel.php’);

$cpanel = new ControlPanel();

require_once(‘backend/customfields.php’);

// move javascript to footer

/*remove_action(‘wp_head’, ‘wp_print_scripts’);

remove_action(‘wp_head’, ‘wp_print_head_scripts’);