() translation by (you can also view the original English article)
WordPress tiene un buen sistema de publicación, el cual es extensible de manera que WordPress se pueda usar para construir un montón de diferentes sitios en lugar de solo un blog. WordPress también tiene un sistema de comentarios muy ampliable. El sistema de comentarios de WordPress también se puede extender de distintas formas para su uso en tus sitios WordPress. El sistema de comentarios se puede usar como un foro de opiniones si el sitio WordPress se va a convertir en un sistema de catálogo de productos. El sistema de comentarios se puede usar como un sistema de respuestas y preguntas si el sitio WordPress se va a usar como un sitio de Respuestas y Preguntas. De modo que el sistema de comentarios de WordPress se puede modelar o ampliar para proporcionar una funcionalidad que mejore por completo el sitio creado con WordPress. En este artículo vamos a escribir un plugin para añadir un sistema de votos en los comentarios que podría resultar útil si el sistema de comentarios se usa de forma distinta tal y como hemos descrito en los anteriores ejemplos y en muchos otros que se te puedan imaginar.
Paso 1 Creación del plugin
Empecemos ahora creando el plugin. En nuestra carpeta wp-content crearemos una carpeta para nuestro plugin denominada commentsvote. Dentro de la carpeta commentsvote crea un archivo commentsvote.php que será el archivo principal de nuestro plugin. Después añadiremos la cabecera del plugin de la siguiente manera, lo que ayudará a WordPress a identificar nuestro plugin y a mosrarlo en la lista de plugins del administrador de WordPress. La cabecera es como sigue.
1 |
<?php
|
2 |
/*
|
3 |
Plugin Name: Vote on Comments
|
4 |
Plugin URI:
|
5 |
Description: Allows to add votes on comment
|
6 |
Author: Abbas Suterwala
|
7 |
Version:
|
8 |
Author URI:
|
9 |
*/
|
10 |
?>
|
Una vez hayamos añadido la cabecera, seremos capaces de ver nuestro plugin en la lista de plugins de la siguiente manera. Ahora podemos activarlo.
Configuremos ahora algunas variables y scripts que usaremos en nuestro plugin. Creamos constantes para definir la ruta del plugin y la URL del mismo que se podrán usar en distintos sitios del plugin de la siguiente manera.
1 |
<?php
|
2 |
define('VOTECOMMENTSURL', WP_PLUGIN_URL."/".dirname( plugin_basename( __FILE__ ) ) ); |
3 |
define('VOTECOMMENTPATH', WP_PLUGIN_DIR."/".dirname( plugin_basename( __FILE__ ) ) ); |
4 |
?>
|
También, como vamos a tener la funcionalidad de añadir votos vía AJAX necesitaremos un archivo JavaScript. Para añadir el archivo JavaScript creamos una carpeta js en la carpeta de nuestro plugin y creamos un archivo commentsvote.js en ella. Una vez hayamos creado los archivos necesarios la estructura de nuestra carpeta del plugin tendrá el siguiente aspecto.
Después encolamos el script de modo que los archivos JS sean cargados por el motor de WordPress de la siguiente manera.
1 |
<?php
|
2 |
function voteme_enqueuescripts() { |
3 |
wp_enqueue_script('votecomment', VOTECOMMENTSURL.'/js/commentsvote.js', array('jquery')); |
4 |
wp_localize_script( 'votecomment', 'votecommentajax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) ); |
5 |
}
|
6 |
add_action('wp_enqueue_scripts', voteme_enqueuescripts); |
7 |
?>
|
Paso 2 Entender algunas funciones de WorPress para los comentarios
WordPress proporciona soporte para meta de los comentarios en los que podemos guardar y recuperar algunos meta datos relacionados con el comentario. Vamos a almacenar los votos de los comentarios como meta de los comentarios usando estas funciones de soporte. Por tanto, aquí vamos a ver qué son estas funciones que proporciona WordPress.
La primera función que vamos a ver es get_comment_meta(). Esta función es similar a get_post_meta(). Esta función toma el primer argumento como el ID del comentario, el segundo argumento como el nombre de la clave meta, el tercer argumento si está establecido como true devuelve el valor como cadena, si está establecido como false o está en blanco devolverá una cadena de valores para esa clave.
Para más información puedes visitar la página de get_comment_meta() en el Códice de WordPress.
La otra función que vamos a usar es update_comment_meta. Esta función toma cuatro argumentos que son el ID del comentario, la clave meta, el valor meta y el valor anterior.
Para más información puedes visitar la página update_comment_meta() en el Códice de WordPress.
Paso 3 Mostrar los votos actuales junto al comentario
Ahora, añadamos el número de votos y un enlace de voto junto a cada comentario de manera que los usuarios puedan votar en los comentarios. Para lo primero escribimos una función que creará el enlace y lo devolverá como una cadena.
1 |
<?php
|
2 |
function commentsvote_showlink() { |
3 |
$link = ""; |
4 |
$nonce = wp_create_nonce("commentsvote_nonce"); |
5 |
$current_CommentID = get_comment_ID(); |
6 |
$votes = get_comment_meta($current_CommentID, '_commentsvote', true) != '' ? get_comment_meta($current_CommentID, '_commentsvote', true) : '0'; |
7 |
$arguments = $current_CommentID.",'".$nonce."'"; |
8 |
$link = $votes.' <a onclick="commentsvote_add('.$arguments.');">'.'Votes'.'</a>'; |
9 |
$completelink = '<div id="commentsvote-'.$current_CommentID.'">'; |
10 |
$completelink .= '<span>'.$link.'</span>'; |
11 |
$completelink .= '</div>'; |
12 |
return $completelink; |
13 |
}
|
14 |
?>
|
En esta función primero obtenemos el ID del actual comentarios usando la función de WordPress get_comment_ID(). Después obtenemos el número de votos en el comentario usando la función get_comment_meta().
A continuación creamos un enlace en el que llamamos a la función JavaScript commentsvote_add() la cual implementaremos en los siguientes pasos.
Después añadimos este enlace a cada comentario usando el filtro comment_text. Enganchamos al filtro comment_text y añadimos el enlace de la siguiente forma.
1 |
<?php
|
2 |
function commentsvote_comment_text($content) { |
3 |
return $content.commentsvote_showlink(); |
4 |
}
|
5 |
add_filter('comment_text', commentsvote_comment_text); |
6 |
?>
|
Ahora si visitas la página de la entrada individual verás el enlace de voto de la siguiente forma.
Paso 4 Crear el manejador AJAX para añadir votos en los comentarios
Ahora, una vez hayamos creado el código para mostrar el enlace, creemos los manejadores AJAX en WordPress para manejar la solicitud. El manejador de la solicitud AJAX es como sigue.
1 |
<?php
|
2 |
function commentsvote_ajaxhandler() { |
3 |
if ( !wp_verify_nonce( $_POST['nonce'], "commentsvote_nonce")) { |
4 |
exit("Something Wrong"); |
5 |
}
|
6 |
|
7 |
$results = ''; |
8 |
global $wpdb; |
9 |
|
10 |
$commentid = $_POST['commentid']; |
11 |
$votecount = get_comment_meta($commentid, '_commentsvote', true) != '' ? get_comment_meta($commentid, '_commentsvote', true) : '0'; |
12 |
$votecountNew = $votecount + 1; |
13 |
update_comment_meta($commentid, '_commentsvote', $votecountNew); |
14 |
|
15 |
$results.='<div class="votescore" >'.$votecountNew.'</div>'; |
16 |
|
17 |
//Return the String
|
18 |
die($results); |
19 |
}
|
20 |
// creating Ajax call for WordPress
|
21 |
add_action( 'wp_ajax_nopriv_commentsvote_ajaxhandler', 'commentsvote_ajaxhandler' ); |
22 |
add_action( 'wp_ajax_commentsvote_ajaxhandler', 'commentsvote_ajaxhandler' ); |
23 |
?>
|
En el manejador AJAX primero verificamos el nonce. Después obtenemos el ID del comentario y el número actual de votos en el comentario usando la función get_comment_meta(). Una vez hecho esto incrementamos el conteo actual por uno y después actualizamos el meta usando la función update_comment_meta().
Después devolvemos el valor actualizado del manejador AJAX.
Paso 5 Votar en los comentarios a través de AJAX
Ahora una vez nuestro enlace y los manejadores AJAX estén creados solo necesitamos escribir la función JavaScript para realizar la llamada AJAX. La función es como sigue.
1 |
function commentsvote_add(comment_id,nonce) {
|
2 |
|
3 |
jQuery.ajax({
|
4 |
type: 'POST', |
5 |
url: votecommentajax.ajaxurl, |
6 |
data: {
|
7 |
action: 'commentsvote_ajaxhandler', |
8 |
commentid: comment_id, |
9 |
nonce: nonce |
10 |
}, |
11 |
success: function(data, textStatus, XMLHttpRequest) {
|
12 |
var linkofcomment = '#commentsvote-' + comment_id; |
13 |
jQuery(linkofcomment).html('');
|
14 |
jQuery(linkofcomment).append(data); |
15 |
}, |
16 |
error: function(MLHttpRequest, textStatus, errorThrown) {
|
17 |
alert(errorThrown); |
18 |
} |
19 |
}); |
20 |
|
21 |
} |
La función básicamente obtiene el ID del comentario y hace una llamada AJAX al manejador AJAX. Una vez el manejador AJAX devuelva el valor, la función JavaScript recupera el div del comentario y actualiza su contenido con el número de votos. Ahora podemos hacer clic en el voto para añadir un voto al comentario.
Paso 6 Permitir votar solo a los usuarios que hayan iniciado sesión
Mejoremos ahora el plugin para proporcionar una opción al administrador que solo permita votar en los comentarios a los usuarios que hayan iniciado sesión. Para hacer esto primero creamos una página de ajustes para nuestro plugin. Sigue este código para crear una página de ajustes.
1 |
<?php
|
2 |
// Settings
|
3 |
add_action('admin_menu', 'commentvote_create_menu'); |
4 |
function commentvote_create_menu() { |
5 |
add_submenu_page('options-general.php','Comments Vote','Comments Vote','manage_options', __FILE__.'comments_settings_page','comments_settings_page'); |
6 |
}
|
7 |
function comments_settings_page() { |
8 |
?>
|
9 |
<div class="wrap"> |
10 |
<?php
|
11 |
if( isset( $_POST['commentvotesubmit'] ) ) { |
12 |
update_option( 'commentvotelogin' , $_POST[ 'commentvotelogin' ] ); |
13 |
}
|
14 |
?>
|
15 |
<div id="commentvotesetting"> |
16 |
<form id='commentvotesettingform' method="post" action=""> |
17 |
<h1><?php echo 'Settings'; ?></h1> |
18 |
<input type = 'Radio' Name ='commentvotelogin' value= 'yes' <?php if( get_option('commentvotelogin') == 'yes' ) echo 'checked';?> >Voting allowed to only logged in users |
19 |
<br/>
|
20 |
<input type = 'Radio' Name ='commentvotelogin' value= 'no' <?php if( get_option('commentvotelogin') != 'yes' ) echo 'checked';?> >Voting allowed to non logged in users |
21 |
<br/><br/>
|
22 |
<p class="submit"> |
23 |
<input type="submit" id="commentvotesubmit" name="commentvotesubmit" class="button-primary" value="<?php echo 'Save'; ?>" /> |
24 |
</p>
|
25 |
</form>
|
26 |
</div>
|
27 |
</div>
|
28 |
<?php } |
29 |
?>
|
Ahora dependiendo de la configuración comprobaremos si el usuario ha iniciado sesión o no antes de mostrar el enlace de voto o de hacer que el enlace apunte a la página de inicio de sesión. Así que las funciones adaptadas commentsvote_showlink() y commentsvote_ajaxhandler() tendrán el siguiente aspecto.
1 |
<?php
|
2 |
function commentsvote_showlink() { |
3 |
$link = ""; |
4 |
$nonce = wp_create_nonce("commentsvote_nonce"); |
5 |
$current_CommentID = get_comment_ID(); |
6 |
$votes = get_comment_meta($current_CommentID, '_commentsvote', true) != '' ? get_comment_meta($current_CommentID, '_commentsvote', true) : '0'; |
7 |
if( get_option('commentvotelogin') != 'yes' || is_user_logged_in() ) { |
8 |
|
9 |
$arguments = $current_CommentID.",'".$nonce."'"; |
10 |
$link = $votes.' <a onclick="commentsvote_add('.$arguments.');">'.'Votes'.'</a>'; |
11 |
$completelink = '<div id="commentsvote-'.$current_CommentID.'">'; |
12 |
$completelink .= '<span>'.$link.'</span>'; |
13 |
$completelink .= '</div>'; |
14 |
}
|
15 |
else { |
16 |
$register_link = site_url('wp-login.php', 'login') ; |
17 |
$completelink = '<div class="commentlink" >'." <a href=".$register_link.">".$votes." Votes"."</a>".'</div>'; |
18 |
}
|
19 |
return $completelink; |
20 |
}
|
21 |
function commentsvote_ajaxhandler() { |
22 |
if ( !wp_verify_nonce( $_POST['nonce'], "commentsvote_nonce")) { |
23 |
exit("Something Wrong"); |
24 |
}
|
25 |
|
26 |
$results = ''; |
27 |
global $wpdb; |
28 |
if( get_option('commentvotelogin') != 'yes' || is_user_logged_in() ) { |
29 |
|
30 |
$commentid = $_POST['commentid']; |
31 |
$votecount = get_comment_meta($commentid, '_commentsvote', true) != '' ? get_comment_meta($commentid, '_commentsvote', true) : '0'; |
32 |
$votecountNew = $votecount + 1; |
33 |
update_comment_meta($commentid, '_commentsvote', $votecountNew); |
34 |
|
35 |
$results.='<div class="votescore" >'.$votecountNew.'</div>'; |
36 |
}
|
37 |
|
38 |
//Return the String
|
39 |
die($results); |
40 |
}
|
41 |
?>
|
Así que ahora si el administrador hace que sea obligatorio que solo los usuarios que hayan iniciado sesión puedan votar y si el usuario que registrado no ha iniciado sesión, este será redirigido a la página de inicio de sesión de la siguiente manera.
Paso 7 Mostrar los comentarios con más votos en la entrada
Añadamos ahora la funcionalidad para mostrar bajo cada entrada las entradas más votadas. Para hacer esto primero tendremos que procesar los comentarios de la entrada en orden descendente de sus votos. No hay forma directa de ordenar los comentarios basándonos en sus meta, por tanto escribiremos una consulta personalizada para lo mismo. Escribiremos la siguiente función para hacerlo.
1 |
function commentsvote_get_top_voted_comments($post_id) { |
2 |
|
3 |
$commentids = array(); |
4 |
global $wpdb; |
5 |
|
6 |
$request = " |
7 |
select * from $wpdb->comments , $wpdb->commentmeta where |
8 |
$wpdb->comments.comment_post_ID = ".$post_id. |
9 |
" AND $wpdb->comments.comment_ID = $wpdb->commentmeta.comment_ID |
10 |
AND $wpdb->commentmeta.meta_key = '_commentsvote' |
11 |
ORDER BY $wpdb->commentmeta.meta_value+0 DESC; |
12 |
"; |
13 |
|
14 |
$comments = $wpdb->get_results($request); |
15 |
|
16 |
foreach ($comments as $comment) { |
17 |
array_push( $commentids , $comment->comment_ID ); |
18 |
}
|
19 |
|
20 |
return $commentids; |
21 |
}
|
Esta función toma las entradas como datos de entrada y después ejecuta una consulta personalizada en wp_comments y wp_commentmeta para procesar la lista de los comentarios más votados de la entrada.
Después añadimos una función al filtro the_content de la siguiente manera para mostrar el extracto del comentario y los votos bajo la entrada.
1 |
function show_top_voted_comments($content) { |
2 |
|
3 |
$result = ""; |
4 |
$post_ID = get_the_ID(); |
5 |
|
6 |
$commentids = commentsvote_get_top_voted_comments($post_ID); |
7 |
|
8 |
if (count($commentids) > 0 ) |
9 |
$result = "Top Comments for this post:<br/>"; |
10 |
|
11 |
foreach ($commentids as $commentid) { |
12 |
$votecount = get_comment_meta($commentid, '_commentsvote', true) != '' ? get_comment_meta($commentid, '_commentsvote', true) : '0'; |
13 |
$result .=get_comment_excerpt($commentid) .'('.$votecount.')'.'<br/>'; |
14 |
}
|
15 |
|
16 |
return $content.$result; |
17 |
|
18 |
}
|
19 |
add_filter('the_content', show_top_voted_comments); |
Si ahora vemos la entrada, esta tendrá el siguiente aspecto.
Conclusión
En el caso de que WordPress se utilice para otros tipos de sitios sus sistemas básicos y funcionalidades podrían no ser suficientes para el sitio. Pero como el sistema de WordPress es muy ampliable podemos escribir plugins como el de arriba para proporcionar funcionalidad adicional que se adapte a nuestras necesidades. ¡De modo que diviértete mientras extiendes tu sitio WordPress!
