Avisos
Vaciar todo

Formularios de contact form no son responsive - Wordpress

8 Respuestas
4 Usuarios
0 Reactions
872 Visitas
Respuestas: 2640
Famed Member
Topic starter
 

Buenas tardes,

¿Porque los formularios que tengo creados con el plugin "contact form" no son responsive?

Ejemplo:

Contenido solo visible a usuarios registrados


 
Respondido : 16/11/2017 6:57 pm
Jhon
 Jhon
Respuestas: 44989
Illustrious Member Moderator
 

Hola

Los formularios que se crean con este plugin son dependientes de los estilos y de la estructura que tengas en tu theme

Veo que tu theme usa clases del tipo :

Aqui van controles de una columna
Aqui van controles de otra columna

Usa la estructura anterior como parte de tu formulario que veo que esta en columnas

Saludos.


 
Respondido : 16/11/2017 8:57 pm
Respuestas: 2640
Famed Member
Topic starter
 

Buenos días,

No entiendo muy bien lo que hay que hacer. He quitado la imagen que tenía puesta en la derecha pero aún, los recuadros se ponen encima de los textos.

Ajdunto captura de pantalla.

Gracias.

Espero noticias.

Un saludo, Enrique P.


 
Respondido : 17/11/2017 8:29 am
Pablo Velasco
Respuestas: 20382
Illustrious Member
 

Hola,

Como te comentaba mi compañero, tendrías que editar el formulario de Contact Form 7 y añadir los campos del formulario dentro de las etiquetas div. Dentro de la primera tendrías que poner todos los campos excepto en textbox de "Consulta", y en el segundo el textbox de "Consulta".

Si tienes dudas con el proceso nos puedes pegar aquí el código de formulario (donde defines los campos) para que te podamos indicar de forma más precisa el código que hay que dejar.


 
Respondido : 17/11/2017 12:20 pm
Respuestas: 2640
Famed Member
Topic starter
 

Buenas tardes Pablo,

Adjunto el código, a ver si me puedes ayudar.

[response]

Nombre:*

Email:*

Teléfono:

Dirección:

CP:

Localidad:

Provincia:

[text* Nombre: size:30 id:nombre akismet:author ]

[text* Email: size:30 id:email akismet:author]

[text Telfono: size:30 id:telefono]

[text Direccion: size:30 id:direccion]

[text CP: size:30 id:cp]

[text Localidad: size:30 id:localidad]

[text Provincia: size:30 id:Provincia]

[recaptcha]

[submit id:enviar "Enviar"]  Los datos marcados con * son imprescindibles
Consulta:* [textarea* Consula: id:consulta]

var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre"); var diasSemana = new Array("Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado"); var f=new Date(); document.write(diasSemana[f.getDay()] + " " + f.getDate() + " de " + meses[f.getMonth()] + " de " + f.getFullYear());

Gracias.

Un saludo, Enrique P.


 
Respondido : 21/11/2017 11:41 am
Pepe
 Pepe
Respuestas: 41116
Illustrious Member Admin
 

Hola Enrique.

Tienes que añadir as celdas dentro de un div:

Nombre:*

Email:*

Teléfono:

Dirección:

CP:

Localidad:

Provincia:

[text* Nombre: size:30 id:nombre akismet:author ]

[text* Email: size:30 id:email akismet:author]

[text Telfono: size:30 id:telefono]

[text Direccion: size:30 id:direccion]

[text CP: size:30 id:cp]

[text Localidad: size:30 id:localidad]

[text Provincia: size:30 id:Provincia]

Consulta:* [textarea* Consula: id:consulta]

var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre"); var diasSemana = new Array("Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado"); var f=new Date(); document.write(diasSemana[f.getDay()] + " " + f.getDate() + " de " + meses[f.getMonth()] + " de " + f.getFullYear());

Un Saludo


 
Respondido : 21/11/2017 2:36 pm
Respuestas: 2640
Famed Member
Topic starter
 

Buenas tardes,

Lo he vuelto a modificar pero en el móvil no aparece bien.

A ver si puedes echarle un vistazo en el móvil.

http://www.informaticapavon.net/desarrollo/economistas/formulario-de-contacto/

Gracias.

Espero noticias.

Un saludo, Enrique P.


 
Respondido : 28/11/2017 11:28 am
Pepe
 Pepe
Respuestas: 41116
Illustrious Member Admin
 

Hola Enrique.

Si reviso el codigo en el inspector veo lo siguinete:

El padding que tienes añadido es el que te esta provocando lo que nos comentas, seria modificarlo por lo siguiente:

En este caso lo que modificamos es el padding con un valor de 10px

Un saludo


 
Respondido : 28/11/2017 11:42 am