• Inicio
• Wordpress
• PHP
• jQuery
• HTML & CSS
• CMS
• Diseño Gráfico

Personalizar comentarios usando functions.php

Por: Laru | Categoría: Wordpress

La manera común de arreglar los comentarios es agregar códigos donde se pueda en comments.php, algo que si bien puede considerarse correcto, no es lo ideal porque al fin y al cabo: no es nuestra template.

La mejor manera de personalizar los comentarios es creando una función que entendamos por completo y que podamos modificar a gusto, sin tener miedo de desarmar el blog.

Básico

Preparación de los archivos

Los archivos que usaremos son: comments.php, functions.php y hoja de estilo.

@import "comments.css";

Comments.php

En comments.php es en donde llamaremos nuestra función. En el caso de nuestro blog quitamos todo lo innecesario, y dejamos los comentarios abiertos a quien deseara dejar un mensaje.

Comenzamos colocando el código de seguridad:

<?php if(!empty($_SERVER['SCRIPT_FILENAME']) && 'comments.php' == basename($_SERVER['SCRIPT_FILENAME'])) : ?>     
 <?php die('No puedes entrar a este archivo directamente!'); ?> 
<?php endif; ?>

Mediante el ‘die’ terminas todo llamado que atente con la seguridad del blog.

A continuación nos dedicaremos a crear la lista de comentarios, usando los siguientes códigos:

<?php if ( have_comments() ) : ?>
<ol>
 <?php wp_list_comments('type=comment&callback=dinvaders_comm');?>
</ol>
<?php endif; ?>

Lo más importante de este código es la línea del medio, ya que está llamando la función de los comentarios que crearemos a continuación.

Si quisiéramos que nuestros comentarios estuvieran abiertos, continuamos con el formulario.

<?php if(comments_open()) : ?>
<?php (get_option('comment_registration') && !$user_ID) ?>

<div>Título</div>
<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform">
<?php if($user_ID) : ?>
<div>Logueado 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="Desloquear">Cierra sesión &raquo;</a></div>
<?php else : ?>
<div>
<h4>Título</h4>
<input type="text" name="author" value="<?php echo $comment_author; ?>" size="22" tabindex="1" />
<label for="author"><small>Nombre <span><?php if($req) echo "*"; ?><span></small></label></p>

<p><input type="text" name="email" value="<?php echo $author_email; ?>" size="22" tabindex="2" />
<label for="email"><small>E-mail <span><?php if($req) echo "*"; ?></span></small></label></p>

<div><span>*</span> Marca campo requerido</div>
</div>

 <?php endif; ?>
 <p><textarea name="comment"  cols="70" rows="8" tabindex="4"></textarea></p>
 <p><input name="submit" type="submit" tabindex="5" value="" />
 <input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" /></p>

<?php do_action('comment_form', $post->ID); ?>

</form>
<?php ; ?>
<?php endif; ?>

Ya tendríamos el código necesario en nuestro comments.php, ahora pasaremos a editar functions.php

Functions.php

Pero a no tener miedo, porque harems un back-up del archivo para que cualquier eventualidad no nos quite más de unos segundos.

El archivo se sitúa en: (su ruta)/wp-content/themes/(su theme)/functions.php

Descargamos una copia de functions.php y la dejamos en el escritorio de la computadora para estar seguros de que tenemos un respaldo del archivo sin errores.

Ahora lo que nos concierne, el código:

function dinvaders_comm($comment, $args, $depth) {  
$GLOBALS['comment'] = $comment; ?>

 <?php
 $user_id = $comment->user_id;
 $role = ( isset( $roles[$user_id] ) ? $roles[$user_id] : '' );
?>

<li <?php comment_class(); ?> id="li-comment-<?php comment_author_link() ?>">      
<?php if ($comment->comment_approved == '0') : ?><p>En lista de moderación</p><?php endif; ?>
<div><?php echo get_avatar($comment, 90 ); ?></div>
<div><span><?php comment_author_link(); ?></span> dijo:</div>
<div><?php comment_date('d F Y'); ?></div>
<p><?php comment_text(); ?></p>
</li>

Expliquemos cómo funciona para que puedan personalizar este ejemplo aún más.

Si en su blog los comentarios no tienen que ser aprobados antes de colocarse en el artículo simplemente eliminan esta línea:

<?php if ($comment->comment_approved == '0') : ?><p>En lista de moderación</p><?php endif; ?>

Los avatar en los comentarios son muy comunes, nosotros los tenemos de 90 pixeles, pero el tamaño puede variar de acuerdo a su diseño:

<div><?php echo get_avatar($comment, 90 ); ?></div>
<div><?php echo get_avatar($comment, 60 ); ?></div>
<div><?php echo get_avatar($comment, 25 ); ?></div>

Si deseamos que los comentarios tengan fecha (se puede cambiar el esquema):

<div><?php comment_date('d F Y'); ?></div>

Eso sería todo lo importante a destacar, ahora les exlicaré como se personaliza el <li>

En el CSS

li {parámetros}
li#li-comment-SU USUARIO {parámetros}

Mediante esta diferenciación podemos crear estilos específicos para aquellos que crearon el tema, moderan o administran el blog.