How Do I Add a Shortcode to an Elementor Page?
How the Shortcode Widget Works
The widget itself does nothing more than pass whatever's typed into its field through to WordPress's normal shortcode processing, the same mechanism used everywhere else on the site — it doesn't add any special Elementor-specific handling, meaning any shortcode already working elsewhere on the site should work identically here.
Common Situations This Solves
- A plugin providing only a shortcode for its output (a form, a gallery, a pricing table) with no dedicated Elementor widget of its own.
- Custom shortcodes built specifically for a site, needing to appear within an otherwise fully Elementor-designed page.
- WooCommerce shortcodes, like displaying a specific product or a cart total, in a custom location a native WooCommerce widget doesn't cover.
- Styling limitations: the widget renders the shortcode's own output as-is, so any Elementor styling controls only wrap around it rather than restyle its internal markup, which still depends on the shortcode's own CSS.
Adding a Shortcode
- Drag the Shortcode widget onto the page from the widget panel.
- Paste the shortcode into its content field, exactly as it would be typed elsewhere.
- Preview the result, checking that the shortcode's own plugin is active and configured correctly if nothing displays.
Need shortcode-based content integrated cleanly into your design? See Elementor customization.