Fix Price-by-Quantity Table Display Issues

Problem Description #

After a theme update, page builder change, or other plugin update, the plugin’s pricing table or price display stops rendering correctly (layout broken, missing buttons, wrong HTML structure).

Common symptoms:

• Pricing table missing or layout distorted.

• JavaScript errors in console referencing plugin selectors.

• Table works on some pages but not others.

Cause:
The plugin uses specific DOM selectors and markup to insert or update the pricing table. When the theme or another plugin changes HTML structure (DOM), those selectors fail. Also, custom templates or page builders can render different structure.

Solution step-by-step #

1. Reproduce and inspect
   1. Open the affected product page and right-click → Inspect (Dev Tools). Check console for JS errors and examine the DOM structure where the table should appear.

2. Check plugin version & docs
   1. Ensure you run the latest plugin version. Check WPFactory docs for notes about theme compatibility or required selectors. WPFactory

3. Switch to default theme to confirm
   1. Temporarily activate Storefront or Twenty Twenty-Three and test. If it works in default theme, the problem is theme-related.

4. Check page-builder / shortcode usage
   1. If using Elementor, WPBakery, or block editor custom templates, ensure the plugin’s shortcodes are placed into standard content areas (some builders render content in a way that prevents the plugin from attaching).

5. Use the plugin’s shortcode or hook in template

Some WPFactory plugins expose shortcodes or template functions to render the pricing table. Example (pseudo-code):

// In your single-product template

echo do_shortcode( ‘[wpfactory_price_by_quantity id=”123″]’ );

1.  Use the plugin’s documented shortcode rather than relying on auto-insertion. See docs. WPFactory

1. Update selectors with developer help

If DOM changed and plugin didn’t adapt, a developer can add a small snippet to re-target the new elements or use a wrapper. Example JS (developer):

// Wait for product DOM then initialize table

jQuery(document).ready(function($){

  if ( $(‘.my-theme-product-wrapper’).length ) {

     // initialize or reinsert pricing table

  }

});

1. Report to WPFactory with details
   1. Provide theme name/version, steps to reproduce, and a screenshot of broken DOM. The vendor can adapt plugin hooks to broader selector support.
      

Prerequisites #

• Admin access and developer access to theme files if template changes are needed.
  

Additional notes / prevention tips #

• When updating theme or page builder, test on staging first.

• Use theme child to keep template customizations stable.