Skip Navigation

[Resolved] Toolset Starter Theme Loading old styles first

This support ticket is created 7 years, 7 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Our next available supporter will start replying to tickets in about 0.95 hours from now. Thank you for your understanding.

Sun Mon Tue Wed Thu Fri Sat
8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 - -
13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 - -

Supporter timezone: America/New_York (GMT-04:00)

Author
Posts
#489681

I built my site with layouts using the Toolset Start Theme. When you load any of the pages, it is loading the default styles for the Theme for a second before it shows the actual page. How can I fix this? I am using WP Rocket CDN with WP Engine, but not sure if that has anything to do with it. Thanks

The site is hidden link

#489699

Hi, can you tell me more about how your CSS styles are added to your child theme? Are they in a separate style.css file, or added to the Layout CSS & JS editor, or added in the Customizer?

#490215

I am actually not using the child theme. Should I be? I have the styles mixed between the Layout CSS and JS Editor as well as within content templates depending on the post type. I used the visual composer as well to build out the layout for each template. I can give you access if needed. Thanks

#490551
Screen Shot 2017-02-17 at 9.24.23 AM.png

Hi, I definitely recommend using a child theme if you are making any changes in theme files, like functions.php or style.css, single.php, etc. If you make modifications to any of the theme files in the Toolset Starter Theme, those will be overwritten if we release a new version of the theme in the future and someone chooses to update. If you create your own child theme, your modifications will not be overwritten by future theme updates.

The flash of styles I see while your site is loading seems to be related to several different plugins loading stylesheets after page load. For instance, please see the DOM screenshot attached. Each of these link tags represents a stylesheet that needs to be loaded after the page begins to render. If you delete stylesheets vc-mm-css and vc-mm-skins-css (I assume these are from VC Mega Menu), your Mega Menu looks broken. If you delete the wp_ddl_layout_fe_css-css stylesheet as well (from Toolset), you can see how your menu looks while the site is loading.

If the flicker is troublesome for you, there are a few options. You could consider adding some CSS in the document <head> that hides your menu content by setting it to opacity:0. This means that as the page begins to load, your menu will be hidden. Then in one of the CSS files that gets loaded later, you can override that with opacity:1. Alternatively, you could consider moving all the CSS that styles the top part of the screen into a style definition in the head of the document so it is loaded as soon as the HTML is downloaded. Do either of those approaches seem feasible for you?

#493531

If I moved it into a style tag in the header, would I be copying and pasting all of the css from the menu plugin?

#493735

I'm not really familiar with your menu plugin's CSS structure to know how much of its CSS you would need to copy over, but you would need to copy as much as it takes to style your menu satisfactorily until the stylesheets are loaded in.

This ticket is now closed. If you're a Toolset client and need related help, please open a new support ticket.