--- title: "How to Style WPForms in WordPress (NO CSS)" url: https://nexterwp.com/docs/style-wpforms-in-wordpress/ date: 2023-02-14 modified: 2026-09-18 lang: en author: "Aditya Sharma" description: "WPForms gets a form built quickly, and its default styling is deliberately neutral so it fits anywhere — which also means it rarely matches anything exactly. The External Form Styler..." image: https://nexterwp.com/wp-content/uploads/2024/05/style-wpforms-in-wordpress-1024x519.jpg word_count: 516 --- # How to Style WPForms in WordPress (NO CSS) ## Key Takeaways - External Form Styler envuelve un formulario ya creado y le da a Nexter controles de estilo sobre etiquetas, campos, botones y espaciado, sin escribir CSS. - WPForms mantiene el comportamiento del formulario, incluidas las fields, conditional logic, notifications y entries, mientras el bloque solo aplica el estilo por instancia en cada página. - Nexter Blocks Free incluye External Form Styler, que se activa en Nexter > Blocks y requiere el plugin WPForms instalado y activo; si no hay formulario elegido muestra “Please select Form” y si WPForms no está activo imprime el shortcode como texto plano. WPForms gets a form built quickly, and its default styling is deliberately neutral so it fits anywhere — which also means it rarely matches anything exactly. The External Form Styler wraps the form you already built and gives you Nexter's styling controls over it. [LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-contact-form-stylers/) ## Before You Start - **Edition:** Free — the External Form Styler works in Nexter Blocks (free) and with Nexter Blocks Pro.- **Block to enable:** External Form Styler, switched on under **Nexter > Blocks** in your WordPress dashboard.- **Also required:** the WPForms plugin, installed and active. This block styles that plugin's form — it does not create forms of its own. ## Video Tutorial https://youtu.be/fOP2g1LLDWg?t=759 ## Steps - Build your form in **WPForms** as usual. ![Enabling the External Form Styler block in Nexter > Blocks](https://nexterwp.com/wp-content/uploads/2023/02/external-form-styler-activation-new-1-1024x345.png) - Add the **External Form Styler** block to the page. ![Adding the External Form Styler block](https://nexterwp.com/wp-content/uploads/2023/02/external-form-styler-wp-form-contact.png) - Set **Form Type** to **WPForms** and choose your form. ![Choosing WPForms as the form type](https://nexterwp.com/wp-content/uploads/2023/02/external-form-styler-contact-form-input-field-2.png) - Style the labels, fields and button. ![The styling controls](https://nexterwp.com/wp-content/uploads/2023/02/external-form-styler-contact-form-checkbox-radio-field-1.png) - Check the published page. ![A styled WPForms form](https://nexterwp.com/wp-content/uploads/2023/02/external-form-styler-contact-form-file-upload-1.png) > *With no form chosen the block renders its own **"Please select Form"** message rather than an empty space — measured, so a half-configured block is easy to spot.* ## How It Behaves This block does not build forms. It renders the form your form plugin already provides and gives you Nexter's styling controls over it — labels, fields, buttons and spacing — without writing CSS. - Choosing WPForms makes the block build that plugin's own shortcode for the form you selected — measured on a published page.- The output is wrapped in a WPForms-specific container so the block's style controls target the right markup.- Form behaviour stays with WPForms — fields, conditional logic, notifications and entries are all unchanged.- The styling belongs to the block, so the same form can be styled differently on different pages. > ***If the form plugin is not active, the page shows the shortcode as plain text.** Measured on a published page with the plugin removed: the block printed the literal shortcode instead of a form. If you see square brackets where your form should be, the form plugin is missing, deactivated, or the form was deleted.* ## Limitations - **The block styles a form, it does not create one.** Fields and logic stay in WPForms.- Styling applies per block instance, not to the form everywhere it appears.- Heavily customised WPForms templates may not match every control, since the controls target that plugin's standard markup.- The label-style option is specific to Contact Form 7 — measured, it is not applied to other form types. See [the Contact Form 7 doc](https://nexterwp.com/docs/style-contact-form-7-in-wordpress/). ## Troubleshooting ### The page shows [wpforms id=…] as text WPForms is not active. Measured with the plugin absent: the block prints the shortcode as plain text instead of a form. Install or activate WPForms. ### It says "Please select Form" No form has been chosen in the block yet. Pick one from the form list. ### My styling is not applying Check **Form Type** really is set to WPForms — the wrong type builds a different plugin's shortcode and the style selectors will not match. ### Entries are not being saved Entries are WPForms' responsibility, not the block's. Check the form's own settings; the block only wraps and styles the output. ## Related Docs - [Style Contact Form 7](https://nexterwp.com/docs/style-contact-form-7-in-wordpress/)- [Style Gravity Forms](https://nexterwp.com/docs/style-gravity-forms-in-wordpress/)- [Style Ninja Forms](https://nexterwp.com/docs/style-ninja-forms-in-wordpress/)- [Style Everest Forms](https://nexterwp.com/docs/style-everest-forms-in-wordpress/)