Premium WordPress Theme Customization: Astra, Avada, Flatsome, Woodmart, Salient
Child themes, WooCommerce template overrides and speed work for Astra, Avada, Flatsome, Woodmart and Salient. About 30 child themes, mobile LCP from 4.6s to 1.8s on the heaviest build.
- Client
- WooCommerce stores and content sites on Astra, Avada, Flatsome, Woodmart and Salient
- My role
- WordPress developer: child themes, WooCommerce overrides and performance
- Astra
- Avada
- Flatsome
- Woodmart
- Salient
- WooCommerce
- Elementor Pro
- Divi
- theme.json
- PHP
- child themes built
- ≈ 30
- WooCommerce template overrides
- ≈ 15
- mobile LCP on the heaviest Woodmart + Elementor build
- 4.6s → 1.8s
- PageSpeed mobile (desktop 62 → 97)
- 38 → 87
- fewer "layout broken after update" tickets
- ≈ 70%
child themes built
WooCommerce template overrides
mobile LCP on the heaviest Woodmart + Elementor build
PageSpeed mobile (desktop 62 → 97)
fewer "layout broken after update" tickets
The challenge
Sites on Astra, Avada, Flatsome, Woodmart and Salient had a previous developer who edited the parent theme directly, so updates were impossible. Others had copied WooCommerce templates years ago that were now three major versions behind and silently missing security and accessibility fixes.
Heavy themes plus page builders were also hurting Core Web Vitals.
What I built
- 01
About 30 child themes built properly
style.css with the Template: header, enqueue after the parent handle, no @import, and all customizations in functions.php or template files in the child.
- 02
About 15 WooCommerce template overrides
Single product, archive, cart, mini-cart and my-account, with correct @version headers. Where a full template copy was not needed, I used hooks-first overrides.
- 03
Theme-options extensions
Custom Customizer controls for Astra and Flatsome, an Avada options panel field, and a Woodmart child-theme settings page for store-specific toggles (badge text, delivery cut-off, vendor note).
- 04
Builder and theme conflict resolution
Elementor Pro Theme Builder vs Woodmart's product layout, Divi vs WooCommerce archive templates, and Flatsome UX Builder shortcodes inside Gutenberg. Fixed by controlling which system owns each template instead of disabling either.
- 05
Speed work on heavy themes
Conditional asset loading, deferring non-critical JS, preloading the LCP image, removing unused builder icon packs, disabling cart fragments on non-commerce pages, critical CSS and object caching.
- 06
One custom block theme from scratch
theme.json, register_block_pattern and template parts for a content publisher who wanted zero builder overhead.
Gotchas and how I fixed them
The parent theme handle is not guessable
Astra is astra-theme-css, Flatsome is flatsome-main, Woodmart is woodmart-style; Avada and Salient differ by version. Inspect wp_enqueue_scripts or the page source instead of hard-coding a guess, and enqueue the child at priority 20 with the correct dependency array.
WooCommerce template versions matter
A copied content-product.php without the @version header is "outdated" forever, and WooCommerce System Status flags it. Copy the header from the current core template and re-check on every WooCommerce major.
Prefer hooks over template copies
woocommerce_before_shop_loop_item_title, woocommerce_single_product_summary and woocommerce_after_shop_loop_item cover most customizations with far less maintenance risk.
wc-cart-fragments is load-bearing
Dequeuing it on non-commerce pages is safe. Dequeuing it everywhere breaks AJAX add-to-cart and the mini-cart count.
Elementor Theme Builder can silently lose to the theme
If Woodmart or Flatsome declares its own product template, the Elementor template never renders. Decide the owner explicitly and document it; toggling both is how you get "why is my template ignored?"
Do not @import the parent stylesheet
@import in style.css blocks rendering and doubles the request chain. Use wp_enqueue_style with the parent handle as a dependency.
Block theme: theme.json version bumps change defaults
Pin the version, test on a staging site, and use the wp_theme_json_data_theme filter for per-site overrides instead of editing theme.json directly.
Code from the build
add_action( 'wp_enqueue_scripts', function () {
wp_enqueue_style(
'child-style',
get_stylesheet_uri(),
[ 'astra-theme-css' ], // parent handle — verify per theme
wp_get_theme()->get( 'Version' )
);
}, 20 );Priority 20 and an explicit parent dependency guarantee the child loads after the parent, which replaces the @import anti-pattern.
add_action( 'wp_enqueue_scripts', function () {
if ( ! is_woocommerce() && ! is_cart() && ! is_checkout() && ! is_account_page() ) {
wp_dequeue_style( 'woocommerce-general' );
wp_dequeue_style( 'woocommerce-layout' );
wp_dequeue_style( 'woocommerce-smallscreen' );
wp_dequeue_script( 'woocommerce' );
wp_dequeue_script( 'wc-cart-fragments' );
}
}, 99 );
add_action( 'wp_head', function () {
if ( ! is_product() ) {
return;
}
$image = wp_get_attachment_image_src( get_post_thumbnail_id(), 'woocommerce_single' );
if ( $image ) {
printf(
'<link rel="preload" as="image" href="%s" fetchpriority="high">',
esc_url( $image[0] )
);
}
}, 1 );This pair alone moved mobile LCP by over a second on the Woodmart build; removing wc-cart-fragments breaks the AJAX mini-cart count, so it is for content pages, not shop or archive.
add_filter( 'elementor/theme/need_override_location', function ( $need, $location ) {
if ( 'single' === $location && is_product() ) {
return false; // Woodmart/Flatsome product template wins
}
return $need;
}, 10, 2 );The fix for an ignored Elementor template is declaring a single owner for each template location, not disabling the theme.
Results
- Mobile LCP went from about 4.6s to about 1.8s on the heaviest Woodmart + Elementor build; CLS from about 0.24 to about 0.02.
- PageSpeed mobile went from about 38 to about 87; desktop from about 62 to about 97.
- About 250k monthly visits across the portfolio's theme projects; server response and asset weight cuts reduced bandwidth cost by about 30%.
- "Layout broken after update" tickets dropped about 70% after moving all customizations into child themes with versioned overrides.
- One client's WooCommerce archive TTFB went from 3.2s to 0.9s after removing a meta_query and enabling object cache.
Questions people ask
How do I customize Astra, Flatsome or Woodmart without losing changes on update?
Put every change in a child theme: style.css with the Template: header, enqueued after the parent handle, no @import, and code in functions.php or child template files. I have built about 30 child themes this way, and update-related breakage tickets fell about 70%.
What is the parent stylesheet handle for Astra, Flatsome and Woodmart?
Astra is astra-theme-css, Flatsome is flatsome-main and Woodmart is woodmart-style. Avada and Salient differ by version, so check the page source or wp_enqueue_scripts rather than guessing.
Why is my Elementor product template ignored on a Woodmart or Flatsome store?
The theme declares its own product template and wins. Decide which system owns each template location and make the other step aside, for example with the elementor/theme/need_override_location filter, instead of toggling both.
Can you speed up a heavy WooCommerce theme?
Yes. On the heaviest Woodmart + Elementor build, mobile LCP went from about 4.6s to about 1.8s and PageSpeed mobile from about 38 to about 87, using conditional asset loading, an LCP image preload, deferred JS, critical CSS and object caching.
Do my old copied WooCommerce templates need updating?
If they lack the current @version header, WooCommerce System Status flags them as outdated and they may miss security and accessibility fixes. I re-sync them against core, and use hooks instead of template copies where possible.