{"id":35503,"date":"2022-07-14T07:00:49","date_gmt":"2022-07-14T14:00:49","guid":{"rendered":"https:\/\/dhblog.dream.press\/blog\/?p=35503"},"modified":"2025-01-16T13:06:00","modified_gmt":"2025-01-16T21:06:00","slug":"crear-formulario-de-contacto-llamativo-wordpress","status":"publish","type":"post","link":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/","title":{"rendered":"C\u00f3mo Crear Un Formulario de Contacto Llamativo en WordPress"},"content":{"rendered":"\n<p><span style=\"font-weight: 400;\">Un formulario de contacto es uno de los elementos m\u00e1s populares en la web. El formulario correcto en el lugar adecuado te permitir\u00e1 recaudar informaci\u00f3n de <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/errores-de-diseno-web-que-asustan\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">tus visitantes<\/span><\/a><span style=\"font-weight: 400;\">, suscribirlos a tu <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/email-marketing-sitio-wordpress\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">lista de correos electr\u00f3nicos<\/span><\/a><span style=\"font-weight: 400;\">, y saber que opinan sobre tu p\u00e1gina web. Todo esto solo es posible si tus formularios de contacto logran llamar la atenci\u00f3n de los usuarios.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Crear un formulario de contacto llamativo no significa usar colores brillantes y hacer los campos tan grandes como sea posible. Algo tan sencillo como modificar la ubicaci\u00f3n de un formulario puede volverlo mucho m\u00e1s efectivo.&nbsp;<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">En este art\u00edculo hablaremos sobre que son los formularios de contacto y cu\u00e1les son sus beneficios. Te explicaremos que otros tipos de formularios existen, d\u00f3nde ubicarlos, y qu\u00e9 campos deber\u00edas considerar incluir. Finalmente, te ense\u00f1aremos c\u00f3mo agregar formularios en <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/recursos-para-aprender-a-usar-wordpress\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">WordPress<\/span><\/a><span style=\"font-weight: 400;\"> con y sin <\/span><i><span style=\"font-weight: 400;\">plugins<\/span><\/i><span style=\"font-weight: 400;\">. \u00a1Vamos all\u00e1!<\/span><\/p>\n\n\n\n<h2 id=\"h-que-son-los-formularios-de-contacto\" class=\"wp-block-heading\"><strong>\u00bfQu\u00e9 Son Los Formularios de Contacto?<\/strong><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">Un formulario de contacto consiste en una colecci\u00f3n de campos que los visitantes pueden utilizar para comunicarse con el due\u00f1o o el equipo de soporte de una p\u00e1gina web o una aplicaci\u00f3n. Probablemente, hayas visto miles de formularios de contacto si pasas mucho tiempo en la web:<\/span><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"900\" height=\"1083\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-2.jpg\" alt=\"Un formulario de contacto.\" class=\"wp-image-35506 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-2.jpg.webp 900w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-2-249x300.jpg 249w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-2-851x1024.jpg 851w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-2-768x924.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-2-600x722.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-2-730x878.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-2-784x943.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-2-877x1055.jpg.webp 877w\" data-sizes=\"(max-width: 900px) 100vw, 900px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 900px; --smush-placeholder-aspect-ratio: 900\/1083;\" \/><\/figure><\/div>\n\n\n<p><span style=\"font-weight: 400;\">Cuando hablamos de \u2018campos\u2019 nos referimos a los elementos que puedes usar para incluir informaci\u00f3n dentro de un formulario. Cada formulario puede tener tantos campos como quieras y generalmente algunos de ellos son obligatorios.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Una vez que rellenes un formulario, puedes usar un bot\u00f3n para enviar la informaci\u00f3n. Usualmente, los encargados de la p\u00e1gina reciben esta informaci\u00f3n a <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/correo-personalizado-pequenas-empresas\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">una direcci\u00f3n de correo espec\u00edfica<\/span><\/a><span style=\"font-weight: 400;\">. Algunos <\/span><i><span style=\"font-weight: 400;\">plugins <\/span><\/i><span style=\"font-weight: 400;\">o herramientas de formularios te permiten acceder la informaci\u00f3n que los usuarios env\u00edan sin salir del <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/estilos-globales-wordpress\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">escritorio de WordPress<\/span><\/a><span style=\"font-weight: 400;\">.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Aunque hablamos solo de formularios de contacto, existen muchos tipos de formularios que se utilizan en las p\u00e1ginas web. Veamos algunos otros ejemplos.<br><\/span><\/p>\n\n\n\n<div class=\"article-newsletter article-newsletter--gradient\">\n\n\n<h2>Get Content Delivered Straight to Your Inbox<\/h2><p>Subscribe now to receive all the latest updates, delivered directly to your inbox.<\/p><form class=\"nwsl-form\" id=\"newsletter_block_\" novalidate><div class=\"messages\"><\/div><div class=\"form-group\"><label for=\"input_newsletter_block_\"><input type=\"email\"name=\"email\"id=\"input_newsletter_block_\"placeholder=\"Enter your email address\"novalidatedisabled=\"disabled\"\/><\/label><button type=\"submit\"class=\"btn btn--brand\"disabled=\"disabled\"><span>Sign Me Up!<\/span><svg width=\"21\" height=\"14\" viewBox=\"0 0 21 14\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n<path d=\"M13.8523 0.42524L12.9323 1.34521C12.7095 1.56801 12.7132 1.9304 12.9404 2.14865L16.7241 5.7823H0.5625C0.251859 5.7823 0 6.03416 0 6.3448V7.6573C0 7.96794 0.251859 8.2198 0.5625 8.2198H16.7241L12.9405 11.8535C12.7132 12.0717 12.7095 12.4341 12.9323 12.6569L13.8523 13.5769C14.072 13.7965 14.4281 13.7965 14.6478 13.5769L20.8259 7.39879C21.0456 7.17913 21.0456 6.82298 20.8259 6.60327L14.6477 0.42524C14.4281 0.205584 14.0719 0.205584 13.8523 0.42524Z\" fill=\"white\"\/>\n<\/svg>\n<\/button><\/div><\/form><\/div>\n\n\n<h2 id=\"h-cuales-tipos-de-formularios-puedes-usar-en-una-pagina-web\" class=\"wp-block-heading\"><strong>\u00bfCu\u00e1les Tipos de Formularios Puedes Usar en Una P\u00e1gina Web?<\/strong><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">Existen muchos tipos de formularios adem\u00e1s de los elementos de contacto. Qu\u00e9 tipo de formulario emplees depender\u00e1 de la informaci\u00f3n que quieras recaudar o si quieres <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/crear-perfil-solido-google-business\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">realizar ventas<\/span><\/a><span style=\"font-weight: 400;\"> o no. Hablemos de otros tipos de formularios populares que puedes ver en la web.<\/span><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-formularios-de-suscripcion\"><strong>Formularios de Suscripci\u00f3n<\/strong><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Los formularios de suscripci\u00f3n son los elementos que utilizas para compartir tu correo y otra informaci\u00f3n de contacto a la vez que aceptas ser parte de <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/maneras-hacer-crecer-lista-de-correo\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">una lista de correo<\/span><\/a><span style=\"font-weight: 400;\">. Al suscribirte le confieres permiso para enviarte mensajes por <\/span><i><span style=\"font-weight: 400;\">email<\/span><\/i><span style=\"font-weight: 400;\">:<\/span><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"900\" height=\"214\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-3.jpg\" alt=\"Formulario de suscripci\u00f3n.\" class=\"wp-image-35507 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-3.jpg.webp 900w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-3-300x71.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-3-768x183.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-3-600x143.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-3-730x174.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-3-784x186.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-3-877x209.jpg.webp 877w\" data-sizes=\"(max-width: 900px) 100vw, 900px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 900px; --smush-placeholder-aspect-ratio: 900\/214;\" \/><\/figure><\/div>\n\n\n<p><span style=\"font-weight: 400;\">Muchos formularios de suscripci\u00f3n se conectan con plataformas de <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/guia-para-mercadeo-de-correo\/\" target=\"_blank\" rel=\"noopener\"><i><span style=\"font-weight: 400;\">marketing<\/span><\/i><span style=\"font-weight: 400;\"> de correo electr\u00f3nico<\/span><\/a><span style=\"font-weight: 400;\">. Estos programas suelen enviar un correo inicial para confirmar tu suscripci\u00f3n antes de enviarte otros materiales.<\/span><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-formularios-de-pago\"><strong>Formularios de Pago<\/strong><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Los formularios de pago son elementos cr\u00edticos para cualquier p\u00e1gina de <\/span><i><span style=\"font-weight: 400;\">e-commerce <\/span><\/i><span style=\"font-weight: 400;\">o venta de <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/ampliar-tu-negocio-en-linea\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">servicios en l\u00ednea<\/span><\/a><span style=\"font-weight: 400;\">. Esta clase de formularios recopilan datos personales, la direcci\u00f3n de los compradores, y los detalles de su m\u00e9todo de pago:<\/span><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"900\" height=\"651\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-1.jpg\" alt=\"Un formulario de pago con tarjeta de cr\u00e9dito.\" class=\"wp-image-35508 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-1.jpg.webp 900w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-1-300x217.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-1-768x556.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-1-600x434.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-1-730x528.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-1-784x567.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-1-877x634.jpg.webp 877w\" data-sizes=\"(max-width: 900px) 100vw, 900px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 900px; --smush-placeholder-aspect-ratio: 900\/651;\" \/><\/figure><\/div>\n\n\n<p><span style=\"font-weight: 400;\">Los formularios tienen que cumplir con una serie de <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/como-crear-copias-de-seguridad-wordpress\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">medidas de seguridad<\/span><\/a><span style=\"font-weight: 400;\"> estrictas para poder coleccionar informaci\u00f3n sobre m\u00e9todos de pago, como tarjetas de cr\u00e9dito. Generalmente, las <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/como-construir-una-tienda-en-linea-y-ser-tu-jefe\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">tiendas en l\u00ednea<\/span><\/a><span style=\"font-weight: 400;\"> utilizan <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/pasarelas-populares-de-pago\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">pasarelas de pago<\/span><\/a><span style=\"font-weight: 400;\"> que te proveen formularios que puedes usar en tu p\u00e1gina web.<\/span><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-formularios-de-donacion\"><strong>Formularios de donaci\u00f3n<\/strong><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Un formulario de donaci\u00f3n es una herramienta que puedes usar para recaudar fondos para una o <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/historias-de-clientes-inspiramark\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">varias causas<\/span><\/a><span style=\"font-weight: 400;\">. T\u00edpicamente, puedes encontrar esta clase de formulario en las p\u00e1ginas de organizaciones sin fines de lucro o en plataformas de recaudaci\u00f3n, como GoFundMe:<\/span><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"900\" height=\"516\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-9.jpg\" alt=\"Un formulario de donaci\u00f3n.\" class=\"wp-image-35509 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-9.jpg.webp 900w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-9-300x172.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-9-768x440.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-9-600x344.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-9-730x419.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-9-784x449.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-9-877x503.jpg.webp 877w\" data-sizes=\"(max-width: 900px) 100vw, 900px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 900px; --smush-placeholder-aspect-ratio: 900\/516;\" \/><\/figure><\/div>\n\n\n<p><span style=\"font-weight: 400;\">Los formularios de donaci\u00f3n generalmente se integran con pasarelas de pago para procesar los importes recaudados. Algunos formularios permiten que los usuarios decidan cu\u00e1nto donar, mientras que otros sugieren montos espec\u00edficos e incluso donaciones recurrentes.<\/span><\/p>\n\n\n\n<h2 id=\"h-cuales-son-los-beneficios-de-usar-un-formulario-de-contacto\" class=\"wp-block-heading\"><strong>\u00bfCu\u00e1les son los beneficios de usar un formulario de contacto?<\/strong><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">Los formularios de contacto son la manera m\u00e1s sencilla de recibir informaci\u00f3n y solicitudes por privado de los usuarios de tu p\u00e1gina web. Para entender por qu\u00e9 los formularios son tan efectivos, podemos compararlos con otros m\u00e9todos de contacto que los visitantes pueden usar:<\/span><b><\/b><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><b>Correo electr\u00f3nico. <\/b><span style=\"font-weight: 400;\">Para que un usuario te env\u00ede un correo electr\u00f3nico tiene que acceder a su aplicaci\u00f3n de <\/span><i><span style=\"font-weight: 400;\">email<\/span><\/i><span style=\"font-weight: 400;\">. Esto puede parecer sencillo, pero significa un esfuerzo mayor para muchos.<\/span><\/li>\n\n\n\n<li><b>SMS o aplicaciones de mensajer\u00eda. <\/b><span style=\"font-weight: 400;\">Para recibir mensajes por SMS o plataformas de mensajer\u00eda dependes de servicios ajenos a tu p\u00e1gina web. Muchas veces, los usuarios tambi\u00e9n esperan respuestas casi instant\u00e1neas por mensajes, lo cual puede impactar su experiencia.<\/span><\/li>\n\n\n\n<li><b>Comentarios en tus art\u00edculos. <\/b><span style=\"font-weight: 400;\">Los comentarios son una manera genial para establecer discusiones en p\u00fablico con <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/que-es-experiencia-de-usuario\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">tu audiencia<\/span><\/a><span style=\"font-weight: 400;\">. El problema principal con ellos es que no sirven para hacer preguntas en privado o para enviar informaci\u00f3n personal.<\/span><\/li>\n\n\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><b>Mensajes directos por redes sociales. <\/b><span style=\"font-weight: 400;\">Muchos usuarios se han acostumbrado a <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/herramientas-para-impulsar-interacciones-redes-sociales\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">usar las redes sociales<\/span><\/a><span style=\"font-weight: 400;\"> para enviar solicitudes de ayuda y preguntas a los encargados de p\u00e1ginas web. El inconveniente de este m\u00e9todo es que muchos de tus usuarios pueden no utilizar <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/como-promover-tu-blog-redes-sociales\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">las redes sociales<\/span><\/a><span style=\"font-weight: 400;\"> donde tienes perfiles.<\/span><\/li>\n\n\n\n<li><b><i>Chat<\/i><\/b><b> en vivo. <\/b><span style=\"font-weight: 400;\">El \u2018<\/span><i><span style=\"font-weight: 400;\">chat en vivo<\/span><\/i><span style=\"font-weight: 400;\">\u2019 es una herramienta \u00fatil para prestar soporte r\u00e1pido a tus usuarios. Si dispones de un equipo dedicado <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/como-mejorar-servicio-al-cliente-estas-fiestas\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">del servicio al cliente<\/span><\/a><span style=\"font-weight: 400;\"> y tienes una audiencia grande, te recomendamos usarlo en conjunto con formularios de contacto.<\/span><\/li>\n\n\n<\/ul>\n\n\n\n<p><span style=\"font-weight: 400;\">Los formularios de contacto son superiores a la mayor\u00eda de los otros elementos debido en gran parte a su simplicidad. Un usuario puede tomarse todo el tiempo que necesite para llenar un formulario, no tiene que emplear servicios externos, y no tiene que abandonar tu p\u00e1gina web.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Incluir un formulario de contacto en tu p\u00e1gina web es f\u00e1cil, mucho m\u00e1s a\u00fan si usas WordPress. En las pr\u00f3ximas secciones hablaremos sobre c\u00f3mo agregar un formulario de contacto.<\/span><\/p>\n\n\n\n<h2 id=\"h-donde-ubicar-un-formulario-de-contacto-y-que-campos-debes-incluir\" class=\"wp-block-heading\"><strong>D\u00f3nde ubicar un formulario de contacto y qu\u00e9 campos debes incluir<\/strong><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">Una de las decisiones m\u00e1s importantes que puedes tomar sobre un formulario es d\u00f3nde ubicarlo. En muchas p\u00e1ginas, los formularios terminan apareciendo despu\u00e9s de todo el contenido. El problema con esta ubicaci\u00f3n es que muchos usuarios tal vez no lleguen a ver el fondo de la p\u00e1gina.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">En nuestra experiencia, existen tres ubicaciones ideales para un formulario de contacto si quieres maximizar la cantidad de usuarios que lo utilicen. Son las siguientes:<\/span><b><\/b><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><b>En un <\/b><b><i>pop-up<\/i><\/b><b> o una ventana emergente. <\/b><span style=\"font-weight: 400;\">Aunque muchos usuarios pueden no gustar las ventanas emergentes, es imposible discutir su efectividad. Las ventanas emergentes son perfectas para recaudar correos electr\u00f3nicos utilizando un formulario.<\/span><\/li>\n\n\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><b>Al tope de la p\u00e1gina a la derecha. <\/b><span style=\"font-weight: 400;\">Incluir un formulario de contacto en el tope de la p\u00e1gina casi garantiza que los visitantes lo ven. Esta ubicaci\u00f3n es perfecta si quieres usar tu formulario para incrementar las conversiones.\u00a0<\/span><\/li>\n\n\n\n<li><b>Dentro de una p\u00e1gina dedicada al formulario. <\/b><span style=\"font-weight: 400;\">Muchos <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/lista-completa-de-mantenimiento-sitio-web\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">sitios web<\/span><\/a> <span style=\"font-weight: 400;\">tienen p\u00e1ginas dedicadas para que los usuarios puedan establecer contacto con ellos. Una p\u00e1gina de contacto puede incluir un formulario, la direcci\u00f3n de <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/como-empezar-un-negocio-guia\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">tu negocio<\/span><\/a><span style=\"font-weight: 400;\">, correos, y n\u00fameros telef\u00f3nicos.<\/span><\/li>\n\n\n<\/ul>\n\n\n\n<p><span style=\"font-weight: 400;\">Una vez que decidas d\u00f3nde incluir el formulario, tienes que considerar que campos deseas emplear. Por ejemplo, si quieres usar un formulario para colectar correos, solo necesitas un campo para que los usuarios puedan incluir su direcci\u00f3n:<\/span><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"840\" height=\"435\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-7.jpg\" alt=\"Un formulario para recaudar correos electr\u00f3nicos.\" class=\"wp-image-35510 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-7.jpg.webp 840w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-7-300x155.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-7-768x398.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-7-600x311.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-7-730x378.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-7-784x406.jpg.webp 784w\" data-sizes=\"(max-width: 840px) 100vw, 840px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 840px; --smush-placeholder-aspect-ratio: 840\/435;\" \/><\/figure><\/div>\n\n\n<p><span style=\"font-weight: 400;\">En este ejemplo, el campo de correo electr\u00f3nico ser\u00eda el \u00fanico requerido. Incluso as\u00ed, puedes elegir si a\u00f1adir otros campos para recolectar informaci\u00f3n personal sobre los visitantes. Esto puede ser valioso, ya que esa informaci\u00f3n es \u00fatil a la hora de <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/ideas-marketing-navidad-sitio-web\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">dise\u00f1ar campa\u00f1as de <\/span><i><span style=\"font-weight: 400;\">marketing<\/span><\/i><\/a><span style=\"font-weight: 400;\">.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Los detalles \u2018requeridos\u2019 son aquellos campos obligatorios que los visitantes tienen que llenar antes de poder enviar el formulario. Puedes configurar un formulario para que no pueda ser enviado sin ellos:<\/span><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"900\" height=\"529\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-11.jpg\" alt=\"Un formulario de contacto incompleto.\" class=\"wp-image-35511 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-11.jpg.webp 900w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-11-300x176.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-11-768x451.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-11-600x353.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-11-730x429.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-11-784x461.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-11-877x515.jpg.webp 877w\" data-sizes=\"(max-width: 900px) 100vw, 900px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 900px; --smush-placeholder-aspect-ratio: 900\/529;\" \/><\/figure><\/div>\n\n\n<p><span style=\"font-weight: 400;\">A la hora de dise\u00f1ar un formulario de contacto es importante que te preguntes \u201cCu\u00e1l es la informaci\u00f3n esencial que necesito de parte de los usuarios?\u201d. Cada una de las respuestas a esa pregunta representa un campo diferente. Entre esos campos, puedes tener opciones para nombres, motivo de la consulta, informaci\u00f3n de contacto, y el mensaje principal.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Como regla general, recomendamos no incluir muchos campos que no sean necesarios en ning\u00fan formulario. Mientras m\u00e1s campos incluyas, aumenta la posibilidad de que los usuarios prefieran no llenar el formulario por el esfuerzo que requiere.&nbsp;<\/span><\/p>\n\n\n\n<h2 id=\"h-como-anadir-un-formulario-basico-con-html-y-css\" class=\"wp-block-heading\"><strong>C\u00f3mo a\u00f1adir un formulario b\u00e1sico con HTML y CSS<\/strong><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">Existen muchas herramientas avanzadas y <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/como-elegir-plugins-de-wordpress\/\" target=\"_blank\" rel=\"noopener\"><i><span style=\"font-weight: 400;\">plugins<\/span><\/i><span style=\"font-weight: 400;\"> de WordPress<\/span><\/a><span style=\"font-weight: 400;\"> que puedes usar para crear formularios. Sin embargo, si prefieres agregar elementos nuevos a tu p\u00e1gina manualmente, los formularios pueden ser relativamente sencillos.&nbsp;<\/span><\/p>\n\n\n\n<p><a href=\"https:\/\/developer.mozilla.org\/es\/docs\/Learn\/Getting_started_with_the_web\/CSS_basics\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">Conocimientos b\u00e1sicos de HTML y CSS<\/span><\/a><span style=\"font-weight: 400;\"> son m\u00e1s que suficientes para producir casi cualquier tipo de formulario que necesites. Aqu\u00ed tienes un ejemplo de un formulario de contacto b\u00e1sico creado usando solo HTML:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\"><span style=\"font-weight: 400;\">&lt;div class=\"container\"&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;&lt;form action=\"mailto:tucorreo@email.com\"<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;&nbsp;method=\"POST\"<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;&nbsp;enctype=\"multipart\/form-data\"<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;&nbsp;name=\"Formulario\"&gt;<\/span>\n\n<span style=\"font-weight: 400;\">&nbsp;&nbsp;&nbsp;&nbsp;&lt;label for=\"pnombre\"&gt;Nombre&lt;\/label&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;&nbsp;&nbsp;&lt;input type=\"text\" id=\"pnombre\" name=\"nombre\" placeholder=\"Ingresa tu nombre aqu\u00ed\"&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;&nbsp;&nbsp;&lt;label for=\"pcorreo\"&gt;Correo electr\u00f3nico&lt;\/label&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;&nbsp;&nbsp;&lt;input type=\"text\" id=\"pcorreo\" name=\"correo\" placeholder=\"Ingresa tu correo electr\u00f3nico aqu\u00ed\"&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;&nbsp;&nbsp;&lt;label for=\"mensaje\"&gt;Mensaje&lt;\/label&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;&nbsp;&nbsp;&lt;textarea id=\"mensaje\" name=\"mensaje\" placeholder=\"\u00bfEn qu\u00e9 te podemos ayudar?\" style=\"height:200px\"&gt;&lt;\/textarea&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;&nbsp;&nbsp;&lt;input type=\"submit\" value=\"Enviar\"&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;&lt;\/form&gt;<\/span>\n<span style=\"font-weight: 400;\">&lt;\/div&gt;<\/span><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">Ese <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/introduccion-shortcodes-wordpress\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">c\u00f3digo<\/span><\/a><span style=\"font-weight: 400;\"> contiene los detalles para agregar tres campos con etiquetas diferentes y un bot\u00f3n para enviar los contenidos del formulario. Una vez que guardemos el archivo HTML y lo abrimos con un navegador, este es el resultado:<\/span><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"900\" height=\"198\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-6.jpg\" alt=\"Ejemplo de un formulario b\u00e1sico con HTML.\" class=\"wp-image-35512 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-6.jpg.webp 900w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-6-300x66.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-6-768x169.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-6-600x132.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-6-730x161.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-6-784x172.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-6-877x193.jpg.webp 877w\" data-sizes=\"(max-width: 900px) 100vw, 900px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 900px; --smush-placeholder-aspect-ratio: 900\/198;\" \/><\/figure><\/div>\n\n\n<p><span style=\"font-weight: 400;\">Aunque ese formulario funciona, no se ve particularmente llamativo. Para lograr eso, es necesario que usemos algo de CSS. En nuestro caso, optamos por aplicar el mismo estilo para los campos y uno diferente para el bot\u00f3n de <\/span><i><span style=\"font-weight: 400;\">Enviar<\/span><\/i><span style=\"font-weight: 400;\">:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\"><span style=\"font-weight: 400;\">input[type=text], select, textarea {<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;width: 100%; \/* Full width *\/<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;padding: 12px; \/* Agregamos <\/span><i><span style=\"font-weight: 400;\">padding <\/span><\/i><span style=\"font-weight: 400;\">alrededor de los campos *\/&nbsp;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;border: 1px solid #ccc; \/* Esto especif\u00edca un borde gris para los campos *\/<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;border-radius: 4px; \/* Esto nos sirve para redondear un poco los bordes de los campos *\/<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;box-sizing: border-box;&nbsp;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;margin-top: 6px; \/* Con esto agregamos distancia entre campo y campo *\/<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;margin-bottom: 16px;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;resize: vertical \/* Este c\u00f3digo permite que los usuarios extiendan los campos verticalmente *\/<\/span>\n<span style=\"font-weight: 400;\">}<\/span>\n<span style=\"font-weight: 400;\">\/* Este c\u00f3digo configura el color y el estilo del texto del bot\u00f3n *\/<\/span>\n<span style=\"font-weight: 400;\">input[type=submit] {<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;background-color: #04AA6D;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;color: white;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;padding: 12px 20px;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;border: none;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;border-radius: 4px;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp;cursor: pointer;<\/span>\n<span style=\"font-weight: 400;\">}<\/span><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">Una vez que agregues CSS a tu formulario de contacto, se ver\u00e1 mucho m\u00e1s llamativo. En nuestro caso este es el resultado final:<\/span><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"900\" height=\"395\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-4.jpg\" alt=\"Ejemplo de un formulario de contacto con CSS.\" class=\"wp-image-35513 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-4.jpg.webp 900w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-4-300x132.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-4-768x337.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-4-600x263.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-4-730x320.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-4-784x344.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-4-877x385.jpg.webp 877w\" data-sizes=\"(max-width: 900px) 100vw, 900px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 900px; --smush-placeholder-aspect-ratio: 900\/395;\" \/><\/figure><\/div>\n\n\n<p><span style=\"font-weight: 400;\">Agregar campos nuevos usando HTML es sencillo, tanto es cambiar su estilo con CSS. La parte compleja de a\u00f1adir un formulario manualmente es configurar que sucede con la informaci\u00f3n que los usuarios env\u00edan.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">En el c\u00f3digo anterior incluimos una que se llamaba \u2018<\/span><i><span style=\"font-weight: 400;\">form action\u2019<\/span><\/i><span style=\"font-weight: 400;\">. Utilizamos esta etiqueta para configurar que sucede con los datos del formulario. Nosotros configuramos el formulario para que env\u00ede los resultados a un correo electr\u00f3nico:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\"><span style=\"font-weight: 400;\">&lt;form action=\"mailto:tucorreo@email.com\"&gt;<\/span><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">El problema con esta configuraci\u00f3n es que muchos <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/guia-de-servidores-privados-vps\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">servidores<\/span><\/a><span style=\"font-weight: 400;\"> presentan problemas a la hora de enviar correos electr\u00f3nicos <\/span><a href=\"https:\/\/www.geeknetic.es\/SMTP\/que-es-y-para-que-sirve\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">empleando SMTP<\/span><\/a><span style=\"font-weight: 400;\">. En pocas palabras, esto sucede cuando los servidores no est\u00e1n configurados para enviar correos.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Entonces, si usas WordPress, la opci\u00f3n m\u00e1s sencilla para ti puede ser usar un <\/span><i><span style=\"font-weight: 400;\">plugin <\/span><\/i><span style=\"font-weight: 400;\">de formularios. Con un <\/span><i><span style=\"font-weight: 400;\">plugin<\/span><\/i><span style=\"font-weight: 400;\">, no tendr\u00e1s que preocuparte por si tu servidor est\u00e1 configurado para enviar correos o no.<\/span><\/p>\n\n\n\n<h2 id=\"h-3-plugins-para-crear-formularios-de-contacto-en-wordpress\" class=\"wp-block-heading\"><strong>3 Plugins para crear formularios de contacto en WordPress<\/strong><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">En realidad, si usas WordPress no hay necesidad de crear formularios manualmente. Existe una amplia variedad de <\/span><i><span style=\"font-weight: 400;\">plugins<\/span><\/i><span style=\"font-weight: 400;\">, tanto pagos como gratuitos, que te permiten producir formularios con facilidad. Ahora vamos a explorar nuestras opciones sugeridas.<\/span><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-1-wpforms\"><strong>1. WPForms<\/strong><\/h3>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"900\" height=\"288\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-10.jpg\" alt=\"WPForms\" class=\"wp-image-35514 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-10.jpg.webp 900w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-10-300x96.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-10-768x246.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-10-600x192.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-10-730x234.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-10-784x251.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-10-877x281.jpg.webp 877w\" data-sizes=\"(max-width: 900px) 100vw, 900px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 900px; --smush-placeholder-aspect-ratio: 900\/288;\" \/><\/figure><\/div>\n\n\n<p><a href=\"https:\/\/wordpress.org\/plugins\/wpforms-lite\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">WPForms<\/span><\/a><span style=\"font-weight: 400;\"> es posiblemente el <\/span><i><span style=\"font-weight: 400;\">plugin <\/span><\/i><span style=\"font-weight: 400;\">de formularios m\u00e1s popular entre los usuarios de WordPress, con m\u00e1s de cinco millones de instalaciones activas. Este <\/span><i><span style=\"font-weight: 400;\">plugin <\/span><\/i><span style=\"font-weight: 400;\">te permite acceder una gama completa de campos pre-configurados.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Tambi\u00e9n, este <\/span><i><span style=\"font-weight: 400;\">plugin <\/span><\/i><span style=\"font-weight: 400;\">incluye un \u2018constructor\u2019 de formularios que te permite arrastrar elementos y posicionarlos como prefieres. Adem\u00e1s, cuenta con una biblioteca de formularios predise\u00f1ados que puedes modificar y usar en tu p\u00e1gina web.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">La principal diferencia entre la versi\u00f3n gratis y la paga de WPForms es que la segunda te da acceso a m\u00e1s campos y m\u00e1s formularios predise\u00f1ados. Si solo quieres un <\/span><i><span style=\"font-weight: 400;\">plugin <\/span><\/i><span style=\"font-weight: 400;\">que te permite crear formularios de contacto sencillos, la versi\u00f3n gratuita es m\u00e1s que suficiente.<\/span><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-2-forminator\"><strong>2. Forminator<\/strong><\/h3>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"900\" height=\"283\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-5.jpg\" alt=\"Forminator\" class=\"wp-image-35515 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-5.jpg.webp 900w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-5-300x94.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-5-768x241.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-5-600x189.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-5-730x230.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-5-784x247.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-5-877x276.jpg.webp 877w\" data-sizes=\"(max-width: 900px) 100vw, 900px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 900px; --smush-placeholder-aspect-ratio: 900\/283;\" \/><\/figure><\/div>\n\n\n<p><a href=\"https:\/\/wordpress.org\/plugins\/forminator\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">Forminator<\/span><\/a><span style=\"font-weight: 400;\"> es un <\/span><i><span style=\"font-weight: 400;\">plugin <\/span><\/i><span style=\"font-weight: 400;\">gratis que ofrece funcionalidades avanzadas para crear formularios. Con Forminator, tienes acceso a una extensa variedad de campos listos para usar y un editor que permite posicionar los campos como quieras.&nbsp;<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Una ventaja de usar Forminator es que el <\/span><i><span style=\"font-weight: 400;\">plugin <\/span><\/i><span style=\"font-weight: 400;\">tambi\u00e9n te permite crear <\/span><i><span style=\"font-weight: 400;\">quizzes<\/span><\/i><span style=\"font-weight: 400;\"> y encuestas usando los campos que quieras. Tambi\u00e9n puedes usar el <\/span><i><span style=\"font-weight: 400;\">plugin <\/span><\/i><span style=\"font-weight: 400;\">para mostrar los resultados de las encuestas por medio de gr\u00e1ficos.<\/span><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-3-formidable-forms\"><strong>3. Formidable Forms<\/strong><\/h3>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"900\" height=\"290\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-8.jpg\" alt=\"Formidable Forms\" class=\"wp-image-35516 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-8.jpg.webp 900w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-8-300x97.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-8-768x247.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-8-600x193.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-8-730x235.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-8-784x253.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/07\/Crear-formulario-de-contacto-llamativo-DreamHost-8-877x283.jpg.webp 877w\" data-sizes=\"(max-width: 900px) 100vw, 900px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 900px; --smush-placeholder-aspect-ratio: 900\/290;\" \/><\/figure><\/div>\n\n\n<p><a href=\"https:\/\/wordpress.org\/plugins\/formidable\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">Formidable Forms<\/span><\/a><span style=\"font-weight: 400;\"> es similar a los otros <\/span><i><span style=\"font-weight: 400;\">plugins <\/span><\/i><span style=\"font-weight: 400;\">que hemos cubierto en que tambi\u00e9n incluye un editor visual que te permite posicionar campos como prefieras. Adem\u00e1s, te da acceso a una amplia biblioteca de campos y formularios listos para usar.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Lo que hace a Formidable Forms \u00fanico es que el <\/span><i><span style=\"font-weight: 400;\">plugin <\/span><\/i><span style=\"font-weight: 400;\">te permite configurar estilos que puedes reutilizar con varios formularios, todo sin tocar una l\u00ednea de CSS. Adem\u00e1s, el <\/span><i><span style=\"font-weight: 400;\">plugin <\/span><\/i><span style=\"font-weight: 400;\">se integra con m\u00faltiples servicios externos, como plataformas de <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/guia-para-principiantes-marketing-afiliados\/\" target=\"_blank\" rel=\"noopener\"><i><span style=\"font-weight: 400;\">marketing<\/span><\/i><\/a><span style=\"font-weight: 400;\"> de correo electr\u00f3nico.<\/span><\/p>\n\n\n\n<h2 id=\"h-crea-tu-primer-formulario-de-contacto\" class=\"wp-block-heading\"><strong>Crea Tu Primer Formulario de Contacto<\/strong><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">Los formularios de contacto son elementos clave para la mayor\u00eda de los <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/por-que-tu-negocio-necesita-sitio-web\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">sitios web<\/span><\/a><span style=\"font-weight: 400;\">. Si tus visitantes necesitan ponerse en contacto contigo o quieres colectar su informaci\u00f3n, ofrecen una soluci\u00f3n elegante. Adem\u00e1s, con las herramientas apropiadas, es f\u00e1cil gestionar los datos que tus formularios generan.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Crear formularios en WordPress es sencillo, ya que no necesitas usar c\u00f3digo para lograrlo. <\/span><a href=\"https:\/\/www.dreamhost.com\/blog\/es\/plugins-esenciales-wordpress\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">El <\/span><i><span style=\"font-weight: 400;\">plugin <\/span><\/i><span style=\"font-weight: 400;\">adecuado<\/span><\/a><span style=\"font-weight: 400;\"> te permitir\u00e1 crear formularios con facilidad. Recordemos que estas son nuestras opciones recomendadas:<\/span><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/wordpress.org\/plugins\/wpforms-lite\/\" target=\"_blank\" rel=\"noopener\"><b>WPForms<\/b><\/a><b>: <\/b><span style=\"font-weight: 400;\">El <\/span><i><span style=\"font-weight: 400;\">plugin<\/span><\/i><span style=\"font-weight: 400;\"> de formularios m\u00e1s popular para WordPress y uno de los m\u00e1s sencillos de usar.\u00a0<\/span><\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/plugins\/forminator\/\" target=\"_blank\" rel=\"noopener\"><b>Forminator<\/b><\/a><b>: <\/b><span style=\"font-weight: 400;\">Adem\u00e1s de formularios, tambi\u00e9n puedes usar Forminator para crear <\/span><i><span style=\"font-weight: 400;\">quizzes<\/span><\/i><span style=\"font-weight: 400;\"> y encuestas.<\/span><\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/plugins\/formidable\/\" target=\"_blank\" rel=\"noopener\"><b>Formidable Forms<\/b><\/a><b>: <\/b><span style=\"font-weight: 400;\">Este plugin viene con una amplia colecci\u00f3n de formularios listos para usar y se integra con muchas plataformas externas.<\/span><\/li>\n\n\n<\/ul>\n\n\n\n<p>Si esperas producir mucho tr\u00e1fico gracias a tus formularios de contacto, necesitar\u00e1s alojamiento web que est\u00e9 a la altura. \u00a1Considera nuestros planes de <a href=\"https:\/\/www.dreamhost.com\/es\/wordpress\/administrado\/\" target=\"_blank\" rel=\"noopener\">DreamPress<\/a>! Ofrecemos <i>hosting<\/i> administrado para WordPress.<\/p>\n\n\n\n<p><span style=\"font-weight: 400;\"><\/span><\/p>\n\n\n\n\n<div\n\tclass=\"article-cta-shared article-cta-small\"\n>\n    <div class=\"tr-img-wrap-outer jsLoading\"><img decoding=\"async\" class=\"js-img-lazy \" src=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/lazy-loading-transparent.webp\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/article-small-ad-cta-placeholder.webp 1x, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/article-small-ad-cta-placeholder-x2.webp 2x\"  alt=\"Ad background image\" \/><\/div>\n\n\n\n\n  <div class=\"content-btm\">\n    <h2\n      class=\"h2--md\"\n    >\n      Haz M\u00e1s Con DreamPress\n    <\/h2>\n    <p\n      class=\"p--md\"\n    >\n      \u00a1Los usuarios de DreamPress Plus y Pro obtienen acceso a Jetpack Professional (y m\u00e1s de 200 temas pr\u00e9mium) sin costo adicional!\n    <\/p>\n\n            <a\n            href=\"https:\/\/www.dreamhost.com\/es\/wordpress\/administrado\/\"\n                        class=\"btn btn--white-outline btn--sm btn--round\"\n                                    target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            >\n                            Adquiere Tu Plan                    <\/a>\n\n  <\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Un formulario de contacto es uno de los elementos m\u00e1s populares en la web. El formulario correcto en el lugar adecuado te permitir\u00e1 recaudar informaci\u00f3n de tus visitantes, suscribirlos a tu lista de correos electr\u00f3nicos, y saber que opinan sobre tu p\u00e1gina web. Todo esto solo es posible si tus formularios de contacto logran llamar [&hellip;]<\/p>\n","protected":false},"author":1062,"featured_media":35504,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_yoast_wpseo_metadesc":"Un formulario de contacto puede cambiar la forma de comunicaci\u00f3n con tus usuarios. Conoce c\u00f3mo crear un formulario f\u00e1cil en WordPress.","toc_headlines":"[[\"h-que-son-los-formularios-de-contacto\",\"\u00bfQu\u00e9 Son Los Formularios de Contacto?\"],[\"h-cuales-tipos-de-formularios-puedes-usar-en-una-pagina-web\",\"\u00bfCu\u00e1les Tipos de Formularios Puedes Usar en Una P\u00e1gina Web?\"],[\"h-cuales-son-los-beneficios-de-usar-un-formulario-de-contacto\",\"\u00bfCu\u00e1les son los beneficios de usar un formulario de contacto?\"],[\"h-donde-ubicar-un-formulario-de-contacto-y-que-campos-debes-incluir\",\"D\u00f3nde ubicar un formulario de contacto y qu\u00e9 campos debes incluir\"],[\"h-como-anadir-un-formulario-basico-con-html-y-css\",\"C\u00f3mo a\u00f1adir un formulario b\u00e1sico con HTML y CSS\"],[\"h-3-plugins-para-crear-formularios-de-contacto-en-wordpress\",\"3 Plugins para crear formularios de contacto en WordPress\"],[\"h-crea-tu-primer-formulario-de-contacto\",\"Crea Tu Primer Formulario de Contacto\"]]","hide_toc":false,"footnotes":""},"categories":[11668,11683],"tags":[],"class_list":["post-35503","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutoriales","category-wordpress-es"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.3 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Crear un Formulario de Contacto Llamativo en WordPress<\/title>\n<meta name=\"description\" content=\"Un formulario de contacto puede cambiar la forma de comunicaci\u00f3n con tus usuarios. Conoce c\u00f3mo crear un formulario f\u00e1cil en WordPress.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"C\u00f3mo Crear Un Formulario de Contacto Llamativo en WordPress\" \/>\n<meta property=\"og:description\" content=\"Un formulario de contacto puede cambiar la forma de comunicaci\u00f3n con tus usuarios. Conoce c\u00f3mo crear un formulario f\u00e1cil en WordPress.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/\" \/>\n<meta property=\"og:site_name\" content=\"DreamHost Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/DreamHost\/\" \/>\n<meta property=\"article:published_time\" content=\"2022-07-14T14:00:49+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-01-16T21:06:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/DES-3082-How-to-Create-An-Eye-Catching-Contact-Form-on-WordPress_ES-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"628\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Jason Cosper\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@dreamhost\" \/>\n<meta name=\"twitter:site\" content=\"@dreamhost\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jason Cosper\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"12 minutes\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Crear un Formulario de Contacto Llamativo en WordPress","description":"Un formulario de contacto puede cambiar la forma de comunicaci\u00f3n con tus usuarios. Conoce c\u00f3mo crear un formulario f\u00e1cil en WordPress.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/","og_locale":"en_US","og_type":"article","og_title":"C\u00f3mo Crear Un Formulario de Contacto Llamativo en WordPress","og_description":"Un formulario de contacto puede cambiar la forma de comunicaci\u00f3n con tus usuarios. Conoce c\u00f3mo crear un formulario f\u00e1cil en WordPress.","og_url":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/","og_site_name":"DreamHost Blog","article_publisher":"https:\/\/www.facebook.com\/DreamHost\/","article_published_time":"2022-07-14T14:00:49+00:00","article_modified_time":"2025-01-16T21:06:00+00:00","og_image":[{"width":1200,"height":628,"url":"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/DES-3082-How-to-Create-An-Eye-Catching-Contact-Form-on-WordPress_ES-1.jpg","type":"image\/jpeg"}],"author":"Jason Cosper","twitter_card":"summary_large_image","twitter_creator":"@dreamhost","twitter_site":"@dreamhost","twitter_misc":{"Written by":"Jason Cosper","Est. reading time":"12 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/#article","isPartOf":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/"},"author":{"name":"Jason Cosper","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/person\/2273b8bf7336df78f6d99a89c17253c4"},"headline":"C\u00f3mo Crear Un Formulario de Contacto Llamativo en WordPress","datePublished":"2022-07-14T14:00:49+00:00","dateModified":"2025-01-16T21:06:00+00:00","mainEntityOfPage":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/"},"wordCount":2292,"publisher":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/#primaryimage"},"thumbnailUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/DES-3082-How-to-Create-An-Eye-Catching-Contact-Form-on-WordPress-1.jpg","articleSection":["Tutoriales","WordPress"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/","url":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/","name":"Crear un Formulario de Contacto Llamativo en WordPress","isPartOf":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/#primaryimage"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/#primaryimage"},"thumbnailUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/DES-3082-How-to-Create-An-Eye-Catching-Contact-Form-on-WordPress-1.jpg","datePublished":"2022-07-14T14:00:49+00:00","dateModified":"2025-01-16T21:06:00+00:00","description":"Un formulario de contacto puede cambiar la forma de comunicaci\u00f3n con tus usuarios. Conoce c\u00f3mo crear un formulario f\u00e1cil en WordPress.","breadcrumb":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/#primaryimage","url":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/DES-3082-How-to-Create-An-Eye-Catching-Contact-Form-on-WordPress-1.jpg","contentUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/07\/DES-3082-How-to-Create-An-Eye-Catching-Contact-Form-on-WordPress-1.jpg","width":900,"height":598},{"@type":"BreadcrumbList","@id":"https:\/\/www-dev.dreamhost.com\/blog\/es\/crear-formulario-de-contacto-llamativo-wordpress\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/dhblog.dream.press\/blog\/"},{"@type":"ListItem","position":2,"name":"C\u00f3mo Crear Un Formulario de Contacto Llamativo en WordPress"}]},{"@type":"WebSite","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#website","url":"https:\/\/www-dev.dreamhost.com\/blog\/","name":"DreamHost Blog","description":"","publisher":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www-dev.dreamhost.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization","name":"DreamHost","url":"https:\/\/www-dev.dreamhost.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/dhblog.dream.press\/blog\/wp-content\/uploads\/2019\/01\/dh_logo-blue-2.png","contentUrl":"https:\/\/dhblog.dream.press\/blog\/wp-content\/uploads\/2019\/01\/dh_logo-blue-2.png","width":1200,"height":168,"caption":"DreamHost"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/DreamHost\/","https:\/\/x.com\/dreamhost","https:\/\/www.instagram.com\/dreamhost\/","https:\/\/www.linkedin.com\/company\/dreamhost\/","https:\/\/www.youtube.com\/user\/dreamhostusa"]},{"@type":"Person","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/person\/2273b8bf7336df78f6d99a89c17253c4","name":"Jason Cosper","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/02\/IMG_4807-scaled.jpeg","url":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/02\/IMG_4807-scaled.jpeg","contentUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/02\/IMG_4807-scaled.jpeg","caption":"Jason Cosper"},"description":"Jason is DreamHost\u2019s WordPress Product Advocate, based out of Bakersfield, CA. He is currently working on making our DreamPress product even better. In his free time, he likes to curl up on the couch and watch scary movies with his wife Sarah and three very small dogs. Follow him on Twitter.","url":"https:\/\/www-dev.dreamhost.com\/blog\/author\/jasoncosper\/"}]}},"lang":"es","translations":{"es":35503},"pll_sync_post":[],"_links":{"self":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/35503","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/users\/1062"}],"replies":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/comments?post=35503"}],"version-history":[{"count":8,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/35503\/revisions"}],"predecessor-version":[{"id":63192,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/35503\/revisions\/63192"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/media\/35504"}],"wp:attachment":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/media?parent=35503"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/categories?post=35503"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/tags?post=35503"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}