WooCommerce not working with Elementor pages

A store page is built from two layers. WooCommerce supplies the product data, the cart rules and the buttons that work with them. Elementor supplies the layout that places those pieces on the page, either through its own widgets or through a template you edited. When the layout drops a piece, such as the add-to-cart area, or moves it into a column too narrow to show it, the shopper sees a page that looks finished and cannot buy. Your desktop check can pass, because the wide layout still fits the button, while a phone layout pushes it off the screen.

• Open a product page on a phone. Can you reach the add-to-cart button without scrolling sideways?
• Check that the price and quantity box show above the button, not hidden under a column.
• In the page editor, find the widget that holds the product or cart area and note what it is.
• Open the console on a product page and press add to cart. Look for a script error at that moment.
• Compare the same product on a laptop and a phone, because a layout can break on only one.

Open the page editor and look at the product area. If the add-to-cart button is part of a store block, WooCommerce draws it, and the layout around it is what you changed. If the area is an Elementor widget or a template you built, Elementor draws the layout and may have replaced the store's block with its own copy. A copy can look right and still fail when pressed, which is why the button can appear and then do nothing.

Start with the layer that changed last. A new template, a widget you added while redesigning the page, or an update to either plugin is the most likely source. Undo the change in a copy of the page and test again before you touch the rest of the design. That tells you which layer to fix, so you do not rebuild the whole store for one missing button.

A laptop has room for two or three columns, so a product page can hide a problem behind a wide layout. On a phone, the same columns stack or narrow. A column that sits beside the photo can squeeze the add-to-cart button under a sticky header, or push it past the edge of the screen where a shopper cannot scroll to it. The fix is not a bigger desktop window. It is a test at phone width, from a phone browser, for the exact pages you sell from.

A cart or checkout built in Elementor can keep the items and drop the payment box, or keep the box and hide the order summary. A shopper who reaches the cart can still be stopped at checkout if the payment section never appears. A simulated visitor walks the cart and checkout on a phone and records the step where the page stops, which tells you whether the custom layout reaches payment.

Page builders and store plugins update on their own schedules, and a new version can change where a product section sits. After each update, run the same simulated shoppers through a product page on a phone, then the cart and checkout, and compare the step where each one stopped. Protected previews need the site password in the run, which is part of paid credits. A saved run shows which update moved the button.