Solved Any header design jumps at load

Martijn Kuilema · Oct 18, 2021

Any header design jumps at page load. What this mean is when a website page is loading on desktop, containing 1 of the Divi Block Header designs, it very fast also shows the mobile header below it.
Very annoying and this makes a website look less professional. This happens with all the Header designs, also when previewing a Header design from within Divi Block itself
Can this be solved?

Attached a screenshot of a frame of a slowmotion video i recorded when a desktop webpage is loading. It shows the desktop design, tablet design, and the orange button in the wrong place.

Divi.Help · Oct 18, 2021

Try to go to Divi > Theme Options to set up the below settings. After you set that, visit every page of your site & Divi will save a copy of the CSS of each page in file format. The next visit to your page will have the CSS file load first & you don't have to see the 'flashing'.

Alternatively, you may try this solution: https://www.markhendriksen.com/how-to-fix-divi-flashing-unstyled-content-on-page-load/

Martijn Kuilema · Oct 18, 2021

Wow that was a fast reply. Thanks.

Your advice solved the problem. What i did:
Divi settings/Performance, switched all to DISABLED
Divi settings/Builder/Advanced/switched Output Styles Inline to DISABLED, the Static CSS file Generation was already set to Enabled.

Solved Any header design jumps at load

Martijn Kuilema New Member
Divi Ultimate Blog Plugin

Attached Files:

IMG_9626.jpg

Divi.Help Administrator
Staff Member

Martijn Kuilema New Member
Divi Ultimate Blog Plugin

Useful Searches

Solved Any header design jumps at load

Martijn Kuilema New Member Divi Ultimate Blog Plugin

Attached Files:

IMG_9626.jpg

Divi.Help Administrator Staff Member

Martijn Kuilema New Member Divi Ultimate Blog Plugin

Martijn Kuilema New Member
Divi Ultimate Blog Plugin

Divi.Help Administrator
Staff Member

Martijn Kuilema New Member
Divi Ultimate Blog Plugin