[KoryKeymaster]

Hey everybody,

I just wanted to chime in here with some info for any of our users who happen to be using older versions of our child theme and may have experienced an issue with styles not loading for your site. With our last update of X we needed to restructure some things in the theme as we continue to revamp in preparation for various coming changes. You can see more detailed information about this in our changelog:

http://theme.co/changelog/#theme-4-3-3

What’s the quick fix?

For example, if you were using Integrity light on your site, you would want to update your @import statement from:

@import url( '../x/framework/css/site/stacks/integrity-light.css' );

To the following:

@import url( '../x/framework/css/dist/site/stacks/integrity-light.css' );

Adding in that dist directory in between css and site is what will ensure you’re pulling in the correct stylesheet for each Stack?

What about this new child theme of yours I keep hearing about?

As noted in the changelog, we moved away from this format mentioned above some time ago. There is a newer, more performance conscious way that WordPress encourages users to utilize in their child themes now. If you are using a version of X higher than v3.2.2, you can switch to this new format and we strongly encourage users to do this instead of just updating the @import statment as mentioned above. You can download our latest version of our child themes here:

https://community.theme.co/child-theme/

Once you’ve downloaded that, to migrate to the new theme you can move all of your styles over along with anything else you might have in your other child theme (e.g. functions, views, et cetera). This is not only faster, but more flexible as it is able to work with all Stacks and keeps things cleaner.

How do I know what version of the child theme I am using?

If you are using the old version of the child theme it will have an @import statement inside the child theme’s style.css file. If you are using the new version of the child theme it will have the following filter in the child theme’s functions.php file, which is required to load your parent theme styles under the new system: add_filter( ‘x_enqueue_parent_stylesheet’, ‘__return_true’ );.

How do I move my customizations from the old child theme to the new one?

The cleanest way to do this is to login to your server via FTP after uploading the new child theme and go to your /wp-content/themes/ directory. In here, you should see two child themes for X (the old format was named x-child-{stack-name-here} depending on the Stack you were using while the new child theme is simply named x-child). Once you are here, copy over your previous styles from the old child theme to the new child theme stylesheet (minus the @import statement as it is no longer needed). If you have any custom functions, copy those over to the new child theme’s functions.php file, but make sure to leave the add_filter( ‘x_enqueue_parent_stylesheet’, ‘__return_true’ ); filter as this is what pulls in your parent theme stylesheet. If you have any custom views over, copy them over to the new child theme with the exact same path structure.

Are you going to make these changes often?

Nope! We don’t take any update lightly and always want to ensure things are kept as stable as possible. On that note, this is why we strongly encourage updating to the new child theme format as it will 100% ensure that this does not happen again since it does not rely on a relative path include and is also much faster as it no longer uses the CSS @import statement.

[Author]

Posts