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.
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="<?php echo $comment_author; ?/>" tabindex="1" />
<label for="author"><small>< ?php _e("Nombre", 'studiopress'); ?> < ?php if ($req) echo __("(requerido)", 'studiopress'); ?></small></label>
<input id="email" name="email" type="text" value="<?php echo $comment_author_email; ?/>" tabindex="2" />
<label for="email"><small>< ?php _e("E-Mail (no será publicado)", 'studiopress'); ?> < ?php if ($req) echo __("(requerido)", 'studiopress'); ?></small></label>
<input id="url" name="url" type="text" value="<?php echo $comment_author_url; ?/>" tabindex="3" />
<label for="url"><small>< ?php _e("Sitio web (si tienes)", 'studiopress'); ?></small></label>
Y la sustituí por:
<span style="float: right;">
<input id="url" name="url" type="text" value="<?php echo $comment_author_url; ?/>" tabindex="3" />
<label for="url"><small>< ?php _e("Sitio web (si tienes)", 'studiopress'); ?></small></label></span>
<input id="email" name="email" type="text" value="<?php echo $comment_author_email; ?/>" tabindex="2" />
<label for="email"><small>< ?php _e("E-Mail (no será publicado)", 'studiopress'); ?> < ?php if ($req) echo __("(requerido)", 'studiopress'); ?></small></label>
<input id="url" name="url" type="text" value="<?php echo $comment_author_url; ?/>" tabindex="3" />
<label for="url"><small>< ?php _e("Sitio web (si tienes)", 'studiopress'); ?></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