Estás en: Inicio / Recursos / Obtener mas comentarios, modificando el formulario de WordPress

Obtener mas comentarios, modificando el formulario de WordPress

votarDecember 2, 2009 por Fedelosa · 22 Comentarios 

Hace un tiempo leí una entrada de Aeromental en la que decían que habían triplicado el numero de comentarios rediseñando el formulario de comentarios, a raíz de eso comencé a observar los comentarios en los blogs que administro, y note que me sucedía exactamente lo mismo, que muchos lectores al no saber que poner en el campo “Sitio Web” ponían palabras sueltas, URLs erróneas (Que al final son links rotos en nuestro blog), y varias cosas mas, por lo que supuse que ademas, algunos lectores no se animarían a comentar por no saber que poner en ese campo.

formulario-comentarios

Antes de que salte algun purista del diseño web, voy a aclarar que yo no tengo idea de diseño web, ni de programación, ni de PHP, ni de CSS, ni de nada, por lo que si consideran que alguno de los cambios realizados al código es una aberración a las buenas costumbres, me pasan el código como debería ser y lo cambio :)

Lo primero que hice fue editar el archivo comments.php:

Busque esta parte del código:

<input id="author" name="author" type="text" value="&lt;?php echo $comment_author; ?/&gt;" tabindex="1" />
<label for="author"><small>&lt; ?php _e("Nombre", 'studiopress'); ?&gt; &lt; ?php if ($req) echo __("(requerido)", 'studiopress'); ?&gt;</small></label>

<input id="email" name="email" type="text" value="&lt;?php echo $comment_author_email; ?/&gt;" tabindex="2" />
<label for="email"><small>&lt; ?php _e("E-Mail (no será publicado)", 'studiopress'); ?&gt; &lt; ?php if ($req) echo __("(requerido)", 'studiopress'); ?&gt;</small></label>

<input id="url" name="url" type="text" value="&lt;?php echo $comment_author_url; ?/&gt;" tabindex="3" />
<label for="url"><small>&lt; ?php _e("Sitio web (si tienes)", 'studiopress'); ?&gt;</small></label>

Y la sustituí por:


<span style="float: right;">
<input id="url" name="url" type="text" value="&lt;?php echo $comment_author_url; ?/&gt;" tabindex="3" />
<label for="url"><small>&lt; ?php _e("Sitio web (si tienes)", 'studiopress'); ?&gt;</small></label></span>

<input id="email" name="email" type="text" value="&lt;?php echo $comment_author_email; ?/&gt;" tabindex="2" />
<label for="email"><small>&lt; ?php _e("E-Mail (no será publicado)", 'studiopress'); ?&gt; &lt; ?php if ($req) echo __("(requerido)", 'studiopress'); ?&gt;</small></label>

<input id="url" name="url" type="text" value="&lt;?php echo $comment_author_url; ?/&gt;" tabindex="3" />
<label for="url"><small>&lt; ?php _e("Sitio web (si tienes)", 'studiopress'); ?&gt;</small></label>

Si observan, lo que hice fue agregar [/html]

al código del campo del formulario donde se deja la dirección del sitio web, luego ubique el campo al principio del formulario, con eso ya cambiamos la posicion de este campo.

Luego, hice que el fondo quedara de color gris, como para diferenciarlo del resto del formulario y de alguna manera quitarle importancia, esto lo hice editando el archivo style.css, busqué la parte del estilo del formulario que en mi caso era así:

#author, #email, #url {
background: #FFFFFF !important;
width: 250px;
color: #333333;
font-size: 12px;
font-weight: normal;
margin: 5px 0px 0px 0px;
padding: 3px 0px 3px 5px;
border: 1px solid #DDDDDD;
display: inline;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
}

y la cambié por:

#author, #email {
background: #FFFFFF !important;
width: 250px;
color: #333333;
font-size: 12px;
font-weight: normal;
margin: 5px 0px 0px 0px;
padding: 3px 0px 3px 5px;
border: 1px solid #DDDDDD;
display: inline;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
}
#url	{
background: #E8E8E8 !important;
width: 250px;
color: #333333;
font-size: 12px;
font-weight: normal;
margin: 5px 0px 0px 0px;
padding: 3px 0px 3px 5px;
border: 1px solid #999999;
display: inline;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
}

Es muy simple, solamente quite el id “url” y lo puse aparte, copié todo y solo modifiqué el valor para “background”

En unas semanas les cuento si el experimento resulta favorable :)

Archivado en Recursos, Sitios Web · Etiquetado con

Acerca de Fedelosa
Geek uruguayo de 31 años, adicto a Internet, las comunicaciones y las nuevas tecnologías. Recientemente adicto a Twitter. Pichón (?) de emprendedor.

Comentarios

22 Respuestas to “Obtener mas comentarios, modificando el formulario de WordPress”
  1. DanielSemper says:
    Wednesday, December 2, 2009 at 23:16

    Te quedó muy bien !!!

    Y me alegra que mi post te haya interesado tanto como para aplicarlo. Yo también use un span float right como indicas aquí

    Algo cool para aplicar también en el formulario es cambiar el color del borde de cada campo de texto cuando se elije llenarlo. Es con este css:

    #author:focus, #email:focus, #url:focus {
    border: 1px solid #227AC6;
    }

    Reply
    • Fedelosa says:
      Wednesday, December 2, 2009 at 23:46

      Gracias Daniel por el dato y por pasar a comentar, hace dos meses que estaba atrás de implementar en mis blogs lo que vos comentabas hasta que al fin me decidí :D

      Voy a probar esto otro también!

      Saludos!

      Reply

Deja tu comentario

Di lo que estas pensando...
Si quieres que se muestre una imagen con tu comentario, ve por un gravatar!