Introducción Forminator es un plugin potente y flexible para WordPress que permite crear formularios, encuestas y cuestionarios con arrastrar y soltar y funciones avanzadas como lógica condicional, protección contra spam y pasarelas de pago. Si has creado una plantilla personalizada en tu tema y el formulario de Forminator no aparece o se muestra roto, es habitual que los estilos del tema sobrescriban el formulario o que falten funciones y recursos de WordPress en la plantilla. En este artículo te explicamos paso a paso cómo integrar correctamente Forminator en una plantilla personalizada y corregir problemas de visibilidad. Además conoceras a Q2BSTUDIO, empresa de desarrollo de software a medida y expertos en inteligencia artificial, ciberseguridad y servicios cloud.

Paso 1 Insertar el formulario de Forminator Si tienes un archivo de plantilla por ejemplo page-contact.php, coloca el shortcode de Forminator dentro del marcado HTML/PHP de la plantilla. Usa el shortcode con el ID de tu formulario así [forminator_form id=123] sustituyendo 123 por el ID real que encontrarás en WordPress Admin Forminator Forms pasando el cursor sobre el nombre del formulario. Si obtienes el ID dinámicamente desde un campo personalizado, escapa siempre el valor para seguridad y usa la función do_shortcode en tu plantilla.

Paso 2 Corregir problemas de visibilidad con CSS A veces el formulario está presente en el DOM pero queda oculto por reglas CSS del tema. Añade este CSS en style.css o Apariencia Personalizar CSS adicional para forzar la visibilidad y que los estilos de Forminator no queden anulados.

.custom-form .forminator-ui, .custom-form .forminator-custom-form, .custom-form .forminator-design--default { display: block !important; visibility: visible !important; opacity: 1 !important; max-height: 100% !important; }

Usa las herramientas de desarrollo del navegador tecla F12 y la opción Inspeccionar para ver qué reglas CSS prevalecen y ajustar selectores más específicos si es necesario.

Paso 3 Asegurar carga de recursos de WordPress Si el formulario no carga o se ve roto, comprueba que tu plantilla carga los hooks estándar de WordPress. Normalmente get_header y get_footer cargan wp_head y wp_footer en las plantillas del tema. Si creas una plantilla en blanco asegúrate de incluir estas llamadas para que se encolen scripts y estilos de plugins y del core.

Paso 4 Depurar errores JavaScript Si la página sigue en blanco abre la consola del navegador F12 Consola y busca errores como Uncaught ReferenceError jQuery is not defined o 404 por archivos JS o CSS faltantes. Estos errores suelen indicar que no se encolaron scripts o que hay un conflicto con otro plugin.

Consejos adicionales y conflictos con plugins y caché Plugins de rendimiento que minifican o combinan CSS y JS, lazy loading o cachés pueden bloquear activos de Forminator. Prueba a desactivar temporalmente minificación o exclusiones para Forminator, desactivar lazy loading para formularios, excluir Forminator de la optimización y desactivar plugins uno a uno para identificar conflictos. También puede ayudar regenerar reglas de reescritura en Ajustes Permalinks Guardar cambios.

Resultado final Con el shortcode en el lugar correcto, estilos CSS conflictivos ajustados y los recursos de WordPress cargados, la plantilla renderizará el formulario correctamente dentro de un contenedor como <div class=custom-form> y verás el formulario con sus inputs y scripts funcionando sin elementos ocultos ni estilos fantasmas.

Conclusión y servicios Q2BSTUDIO Integrar Forminator en una página WordPress personalizada es sencillo si sigues una comprobación sistemática: inserta el shortcode correctamente, resuelve conflictos CSS con selectores específicos, asegúrate de que wp_head y wp_footer están presentes y depura errores JavaScript y conflictos de plugins. En Q2BSTUDIO somos especialistas en desarrollo de aplicaciones a medida y software a medida y ofrecemos soluciones completas que incluyen inteligencia artificial para empresas, servicios cloud aws y azure, ciberseguridad y servicios de inteligencia de negocio. Si necesitas automatizar formularios, integrar IA para empresas o generar informes avanzados con Power BI ponte en contacto con nuestro equipo y descubre cómo podemos ayudarte a implantar agentes IA y soluciones seguras y escalables.

Palabras clave aplicaciones a medida, software a medida, inteligencia artificial, ciberseguridad, servicios cloud aws y azure, servicios inteligencia de negocio, ia para empresas, agentes IA, power bi.