Personalizar columnas Gravity Forms

No hay elemento más utilizado que un Formulario de Contacto en cualquier página web, ya sea para contactar, solicitar información o presupuesto, etc…

Son numerosos los plugins para poder integrarlo, uno de ellos es Gravity Forms, cada vez más utilizado por la cantidad de funcionalidades y add-ons o herramientas secundarias e integraciones con herramientas externas que dan pie a un sin fin de posibilidades!

En muchas ocasiones necesitamos ajustar el diseño de nuestro formulario a nuestras necesidades y con Gravity Forms es realmente fácil, pero debes encontrar las indicaciones apropiadas en la documentación de su web, ya que tienen predefinidas unas clases CSS para poder poner las columnas u otro estilo a tu gusto.

Añadir css personalizada en el campo Apariencia > Clase CSS personalizada

 

Clases para colocar los campos en dos columnas:

• gf_left_half : para el campo que quieras colocar a la izquierda
• gf_right_half : para el campo de la derecha

 

En el caso de 3 columnas, las clases a asignar serían:

• gf_left_third
• gf_middle_third
• gf_right_third

 

Para crear listados en columnas (solo aplicable a multiple choice/checkbox lists):

• gf_list_2col

• gf_list_3col

• gf_list_4col

• gf_list_5col

Para colocar en «fila india» aprovechando toda la linea:

• gf_list_inline

Para poner texto en modo scroll, usado normalmente para resumen de condiciones o aceptación de uso de datos personales:

• gf_scroll_text

Como con cualquier regla de CSS, tu tema particular puede contener css que anulen o reemplacen algunos de estos estilos. Los que mostramos han sido probados en una variedad amplia de temas y funcionan perfectamente pero puede que tengas que hacer algunos ajustes a tus estilos si utilizas themes «raros» de themefores o sitios similares, para que todo funcione correctamente.

En themes para Genesis como el de esta Web, sin problema!!!

 

Ahorra tiempo y evita posibles errores con el Servicio Mantenimiento WordPress