Es conocido de todas las personas que inician un blog con WordPress que lo mas difícil es crear un tema propio desde cero, sin embargo, muchos se las arreglan para manejar y editar temas existentes. Uno de los archivos mas difíciles de codificar e incluso de modificar es el comments.php, con este tutorial te voy a explicar los aspectos básicos que debe llevar tu archivo comments.php para que no tengas problemas al crearlo.
Si no eres muy experto en la codificación de temas para WordPress y te llevas mejor editándolos, vamos a trabajar con un framework llamado “Starkers” que ya habíamos usado antes pero ahora con su versión en español traducido por Jack Bach en su web TINNTA.
Descarga aquí la versión de Starkers en español “StarskersES”
Antes de hacer algo con este archivo, primero debemos entender para que funciona y desde donde llamarlo.
El comments cumple entre otras, las siguientes funciones.
Entendiendo para que funciona, podemos entender desde donde llamarlo. Lo recomendable es hacerlo desde el archivo single.php en algún lugar al final de la publicación de la entrada, por ejemplo:
1 2 3 4 5 6 7 | <div class="entrada"><!--Comienza entrada--> <h1><?php the_title(); ?></h1> <div class="imagen-entrada"><a href="#"><img src="imagen.jpg" class="imagen" /></a></div> <?php the_content(''); ?> <?php edit_post_link('Editar Entrada', '', '.'); ?> <?php comments_template(); ?><!--Inserta la pagina comments.php--> </div><!--Termina entrada--> |
Esa sería una sección del archivo single.php y vemos que llamamos al archivo comments en la línea 6 justo antes de cerrar el div de las entradas (después de publicar el contenido).
Llamamos al archivo comments con la siguiente línea:
1 | <?php comments_template(); ?> |
Imaginemos las posibles situaciones de tu entrada.
1- Se publico un comentario pero espera moderación
2- Están los comentarios abiertos y nadie ha publicado uno
3- Están los comentarios cerrados
4- Están los comentarios abiertos pero se necesita estar registrado para publicar uno
5- Están los comentarios abiertos y el usuario ha ingresado a su sesión.
Los creadores de WordPress le han dado todas esas posibilidades a la publicación de comentarios en tus entradas, aquí vamos a entender cómo se trabaja con ellas.
Comenzamos primero que nada con unas líneas que como bien dice en los comentarios php, no deben ser modificadas a menos que sepas lo que haces. En el StarkersES las líneas son las siguientes:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | <?php // No borrar estas líneas if (!empty($_SERVER['SCRIPT_FILENAME']) && 'comments.php' == basename($_SERVER['SCRIPT_FILENAME'])) die ('Por favor, no abras esta página directamente. ¡Gracias!'); if (!empty($post->post_password)) { // Si hay una contraseña if ($_COOKIE['wp-postpass_' . COOKIEHASH] != $post->post_password) { // Y no coincide con la cookie ?> <p>Esta entrada está protegida con contraseña. Introduce la contraseña para ver los comentarios.</p> <?php return; } } /* Esta variable es para alternar el fondo de los comentarios */ $oddcomment = 'class="alt" '; ?> <!-- Puedes empezar a modificar aquí. --> |
Como dice que no modifiquemos, aquí en skyandstars hacemos caso y no la tocamos.
En el StarkersES lo que sigue es una etiqueta PHP condicional “If”, no la toques, deja tal cual como esta. Luego sigue con un titulo de tercer orden (h3) que indica el numero de comentarios que se han hecho en tu entrada.
1 2 | <?php if ($comments) : ?> <h3 id="comments"><?php comments_number('Sin Respuestas', 'Una Respuesta', '% Respuestas' );?> a “<?php the_title(); ?>”</h3> |
*Aquí lo único que te recomiendo que modifiques es el grado del título (h1, h2 o h3).
Seguimos bajando y nos encontramos con una lista ordenada (ol), que no hace más que mostrar un comentario hecho por algún visitante de tu web, la lista ordenada es así:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | <ol> <?php foreach ($comments as $comment) : ?> <li <?php echo $oddcomment; ?>id="comment-<?php comment_ID() ?>"> <?php echo get_avatar( $comment, 32 ); ?> <cite><?php comment_author_link() ?></cite> Dice:: <?php if ($comment->comment_approved == '0') : ?> <p>Tu comentario está pendiente de moderación.</p> <?php endif; ?> <p><a href="#comment-<?php comment_ID() ?>" title=""><?php comment_date('F jS, Y') ?> a las <?php comment_time() ?></a> <?php edit_comment_link('editar',' ',''); ?></p> <?php comment_text() ?> </li> <?php /* Cambia cualquier otro comentario (trakbacks) a una clase distinta */ $oddcomment = ( empty( $oddcomment ) ) ? 'class="alt" ' : ''; ?> <?php endforeach; /* fin de los comentarios */ ?> </ol> |
Vamos a entender esta sección de código línea por línea:
Linea 1 (ol): Abre un elemento HTML que va a unir a TODOS los comentarios que se hagan en tu entrada, es decir, luego que se publiquen los comentarios, los mismos van a tener el siguiente aspecto:
1 2 3 4 5 | <ol> <li>un comentario de un usuario llamado x con su avatar y demás<li> <li>Otro comentario de otro usuario llamado y con su avatar y demás</li> <li>Otro comentario de un usuario llamado Carlos con su avatar y demás</li> </ol> |
Entendiendo esto, podemos hacerle algunas modificaciones a este código y hacerlo de la siguiente manera:
1 2 3 4 | <div id="comentarios"> <div class="comentario-individual">un comentario de un usuario llamado x con su avatar y demás</div> <div class="comentario-individual">Otro comentario de otro usuario llamado y con su avatar y demás</div> </div> |
Linea 3: Esta sección de código PHP lo que hace es abrir un comentario individual, algo parecido al LOOP que usamos en el index donde se publican las entradas pero en este caso usado para la publicación de un comentario.
Tiene lo siguiente:
1 2 3 | <?php foreach ($comments as $comment) : ?> Aquí iría el aspecto general de tus comentarios individuales <?php endforeach; /* fin de los comentarios */ ?> |
*A estas líneas no les hacemos ninguna modificación
Linea 5 (li): Abre un elemento HTML para una entrada individual, en este caso un elemento de la lista ordenada abierta anteriormente, con las modificaciones que hicimos en la línea 1, aquí podemos hacer la siguiente:
Nueva línea 5 y 13 respectivamente:
1 2 | <div class="comentario-individual" <?php echo $oddcomment; ?>id="comment-<?php comment_ID() ?>"> </div> |
Linea 6: Llama al avatar del usuario que publico el comentario, en este caso va a ser de un tamaño de 32px x 32px (siempre valores iguales para el ancho y alto.
Si queremos hacer algunas modificaciones al aspecto de los avatares de los usuarios, por ejemplo añadirle una clase y que sean de 80px x 80px, podemos hacerlo así:
1 | <div class="avatar"><?php echo get_avatar( $comment, 80 ); ?></div> |
Linea 7: Esta línea lo que hace es llamar al link de la persona que publico el comentario.
Líneas 8, 9 y 10: Estas líneas abren una de las primeras situaciones comentadas al principio de esta sección (Se publico un comentario pero espera moderación). Solo modifica el mensaje que quieras dar a tus usuarios, por ejemplo lo siguiente:
1 2 3 | <?php if ($comment->comment_approved == '0') : ?> <p>En este blog se necesita que un administrador acepte tu comentario, por lo tanto, el mismo espera moderación.</p> <?php endif; ?> |
Linea 11: Esta línea muestra los datos de la publicación de los comentarios: ID, fecha, hora y un link para editar los mismos.
Linea 12: Esta línea muestra el contenido como tal, es decir, el mensaje que fue publicado.
Líneas 15, 16, 17 y 18: Lo que hacen estas líneas es alternar el estilo con que se muestran tus comentarios (puedes ver un ejemplo aquí en skyandstars donde se alternan los fondos de los comentarios). Mi recomendación si eres nuevo haciendo temas para WordPress es que NO uses esta función.
Ahora toca lo más complicado de este archivo, lo es porque encontramos muchos IF, ELSE, ENDIF.
Bajamos en el StarkersES y encontramos lo siguiente:
1 2 3 4 5 6 7 8 9 10 11 | <?php else : // esto se muestra si aún no hay comenarios ?> <?php if ('open' == $post->comment_status) : ?> <!-- Si los comentarios están abiertos, pero no hay comentarios. --> <?php else : // los comentarios están cerrados ?> <!-- Si los comentarios están cerrados --> <p>Los comentarios están cerrados.</p> <?php endif; ?> <?php endif; ?> |
Líneas 1, 2, 3 y 4: Estas líneas modifican la segunda situación planteada en esta sección (Están los comentarios abiertos y nadie ha publicado uno) y en este caso no se muestra nada si no hay comentarios pero puedes añadir algún texto en estas líneas, por ejemplo:
Nuevas líneas 1, 2, 3 y 4:
1 2 3 4 5 | <?php else : // esto se muestra si aún no hay comenarios ?> <?php if ('open' == $post->comment_status) : ?> <p>Por ahora no hay comentarios en la entrada, pero tú puedes ser el primero</p> <!-- Si los comentarios están abiertos, pero no hay comentarios. --> |
Líneas 6, 7 y 8: Plantean la tercera situación (Están los comentarios cerrados), puedes modificar el texto que se muestra en esta sección:
1 2 3 | <?php else : // los comentarios están cerrados ?> <!-- Si los comentarios están cerrados --> <p>Disculpa pero en esta entrada están los comentarios cerrados.</p> |
Linea 10: Es un cierre de los “estatus” del comentario (si no hay ninguno y si están cerrados).
Linea 11: Es un cierre general de la segunda situación planteada.
Mi consejo es que NO modifiques la estructura general de estos códigos PHP, solo modifica los textos que aparecerán como lo hicimos aquí.
Bajamos mas en el starkers y encontramos la siguiente línea:
1 | <?php if ('open' == $post->comment_status) : ?> |
Lo que nos indica es que los comentarios están abiertos y se procede a la apertura del formulario de publicación de nuevos comentarios.
Luego encontramos lo siguiente:
1 2 3 | <?php if ( get_option('comment_registration') && !$user_ID ) : ?> <p>Tu debes estar <a href="<?php echo get_option('siteurl'); ?>/wp-login.php?redirect_to=<?php echo urlencode(get_permalink()); ?>">conectado</a> para escribir un comentario.</p> <?php else : ?> |
Las líneas de arriba lo que hacen es abrir la cuarta situación planteada (Están los comentarios abiertos pero se necesita estar registrado para publicar uno), no se necesita hacerle ninguna modificación a estas líneas.
Ahora más abajo está abierto el formulario de publicación de comentarios con la siguiente línea:
1 | <form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform"> |
NO LA MODIFIQUES
Luego tenemos el siguiente bloque de código:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <?php if ( $user_ID ) : ?> <p>Conectado como <a href="<?php echo get_option('siteurl'); ?>/wp-admin/profile.php"><?php echo $user_identity; ?></a>. <a href="<?php echo get_option('siteurl'); ?>/wp-login.php?action=logout" title="Salir de esta cuenta">Deconectarme »</a></p> <?php else : ?> <input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="22" tabindex="1" <?php if ($req) echo "aria-required='true'"; ?> /> <label for="author">Nombre <?php if ($req) echo "(necesario)"; ?></label> <input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?>" size="22" tabindex="2" <?php if ($req) echo "aria-required='true'"; ?> /> <label for="email">Email (no se publicará) <?php if ($req) echo "(necesario)"; ?></label> <input type="text" name="url" id="url" value="<?php echo $comment_author_url; ?>" size="22" tabindex="3" /> <label for="url">Página web</label> <?php endif; ?> |
No modifiques la estructura de los campos de formulario!!
Líneas 1, 2, 3 y 4: Estas líneas abren la situación planteada numero 5 (Están los comentarios abiertos y el usuario ha ingresado a su sesión), lo que hace es mostrar el nombre de usuario con un link hacia su perfil y un link para salir de la sesión.
El resto de las líneas lo que hacen es mostrar los campos de formularios a los usuarios que no esten en su sesión de usuarios.
Se cierra el formulario de publicación de comentarios con las siguientes líneas:
1 2 3 4 5 6 7 8 9 | <p><strong>XHTML:</strong> Puedes utilizar estas etiquetas: <code><?php echo allowed_tags(); ?></code></p> <textarea name="comment" id="comment" cols="100%" rows="10" tabindex="4"></textarea> <input name="submit" type="submit" id="submit" tabindex="5" value="Enviar Comentario" /> <input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" /> <?php do_action('comment_form', $post->ID); ?> </form> |
Lo que hacen estas líneas es mostrar los campos de formularios que van a ser comunes a todos los usuarios (tantos los que iniciaron sesión como los que no).
El cierre del archivo comments es de la siguiente manera:
1 2 3 | <?php endif; // Si es necesario registro y no está conectado ?> <?php endif; // Si borras esto el cielo caerá sobre tu cabeza ?> |
Creo que los comentarios PHP de estas líneas hablan por sí solos.
Lo importante resumiendo un poco toda esta maraña de código es que NO modifiques la estructura general en PHP, con esto me refiero a eliminar los IF, ELSE, ENDIF solo limítate a agregar etiquetas HTML (divs, h1, h2, etc) donde creas necesario. Si tienes alguna otra duda sobre el archivo comments.php puedes dejarla aquí o en el foro y tratare de ayudarte.
Mijael es el creador y editor de skyandstars.net donde publica guias y tutoriales sobre WordPress, Cutenews, PHP, HTML y mucho más. Acutalmente estudiante universitario.
stage72
27 Octubre 2009
si que es dificil yo lo hice pero todavia no me lo creo que lo lograra jajaja hasta luego y gracias por tu tiempo
marta
27 Octubre 2009
hola.
siento contactarte de esta manera. Te escribo de parte de una empresa de publicidad con sede en Berlin. Podrias ponerme en contacto con el responsable de la publicidad de tu blog?
muchas gracias
Marta p.
Mijael
27 Octubre 2009
Respuesta al Comentario destage72: Me alegra que consiguieras el tuyo :P
Respuesta al Comentario demarta: Hola marta, yo soy el dueño y encargado de esta web..puedes dejar un correo a webmaster@skyandstars.net o agregarnos a ese mismo MSN.Saludos.
Jack Bach
29 Octubre 2009
Ei Mijael!
Gracias por la referencia! Me alegro de que te haya sido útil StarkersEs.
Hasta pronto :)
Mijael166
29 Octubre 2009
Hey Jack la verdad es que si es muy util en español, se ahorra trabajo al traducir todo el tema.Gracias.
nefer
2 Diciembre 2009
por fin consegui montar la web con wordpress ,todavia no esta bien al 100% pero se ve perfectamente ,estoy tan feliz xd
Mijael166
2 Diciembre 2009
Respuesta al Comentario denefer: Me alegro Nefer :P pronto lo vas terminando, como te dije por ahi..Una vez que haces el primero los demas te salen facilmente.
nefer
3 Diciembre 2009
si si es super facil ,yo me complicaba demasiado pero qeu va jajaja ahora me toca cambiar todas las webs a wp xd
ShairNash
6 Enero 2010
yo tengo un super problemas cuando pongo una entrada con contraseña no me aparecen los comments luego de escribir la contraseña pero si se ve la entrada T_T
Mijael166
6 Enero 2010
A ver si entiendo el problema. La entrada esta protegida con contraseña y no se ve nada, pero cuando escribes la contraseña se muestra la entrada pero no los comentarios, es eso lo que sucede?
ShairNash
6 Enero 2010
si!! eso me pasa y por mas q reviso y reviso el codigo no hallo el problema
ShairNash
6 Enero 2010
ya lo arregle! o.O y no se ni como hice otra entrada igual y esa si sirvio la otra no asi q la borre disculpa las molestias n_n
Mijael166
6 Enero 2010
Dale :) quien sabe que fue lo que paso…Saludos!