26
Dec

Agregar Twitter @AnyWhere a los comentarios de WordPress

5 Comments

Siguiendo el tutorial sobre “How to Integrate Twitters @Anywhere with your WordPress Comments” pude integrar Twitter @AnyWhere en los comentarios de mi blog wordpress. El tutorial no es tan sencillo, pero como no encontré ningún plugin que lo haga de forma automática vamos a verlo de a poco.

Twitter AnyWhere

Utilizar la API de Twitter

Lo primero que hay que hacer es registrarse para utilizar la API de Twitter. Esto es necesario para utilizar Twitter @AnyWhere.

Agregar el campo de Twitter al formulario de comentarios

Lo primero es agregar el campo en el formulario de comentarios para que tus visitantes puedan ingresar su nombre de usuario de Twitter. Desde el editor del tema vamos al archivo comments.php y buscamos donde se agregan los campos del formulario y le agregamos los siguientes:

1
2
3
4

<p>
    <input type="text" name="twitter_username" id="twitter_username" class="text" value="<?php echo bm_getCurrentTwitterUser(); ?>" size="22" tabindex="4" />
    <label for="twitter_username"><?php _e('Twitter Username', BM_THEMENAME); ?></label>
</p>

Recordar el nombre de usuario de Twitter

Se va a guardar el nombre de usuario de Twitter en una cookie que será salvado más adelante. Esto sirve para que los usuarios que recurrentes no tengan que completar el campo campo cada vez que quieran comentar algo, de esta forma queda consistente con los demás campos del formulario. En el archivo functions.php debemos agregar la siguiente función:

1
2
3
4
5
6
7
8
9
10
11

function bm_getCurrentTwitterUser () {
    $comment_twitterUser = '';

    if (isset($_COOKIE['comment_twitteruser_' . COOKIEHASH])) {
        $comment_twitterUser = $_COOKIE['comment_twitteruser_' . COOKIEHASH];
        $comment_twitterUser = stripslashes ($comment_twitterUser);
        $comment_twitterUser = esc_attr ($comment_twitterUser);
    }

    return $comment_twitterUser;
}

Agregar el nombre de usuario de Twitter para los usuarios registrados

De esta forma los usuarios registrados podrán agregar su nombre de usuario de Twitter desde su perfil, así este valor se agregara automáticamente en los comentarios que estos usuarios dejen. Nuevamente en el archivo functions.php agregamos estas funciones:

1
2
3
4
5
6

function my_new_contactmethods( $contactmethods ) {
    $contactmethods['twitter'] = 'Twitter';
    return $contactmethods;
}

add_filter('user_contactmethods','my_new_contactmethods',10,1);

Guardando el nombre de usuario de Twitter en los comentarios

Para los usuarios que no están registrados en el blog debemos guardar este valor en cada comentario. Para esto en el archivo functions.php debemos agregar el siguiente código: 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

function bm_saveTwitterUser ($post_id) {
    global $user;

    // only save the twitter details for users who are not logged in
    if (!is_user_logged_in()) {

        // if an account name is specified
        if (isset($_POST['twitter_username'])) {
            // save cooke for...
            $comment_cookie_lifetime = apply_filters('comment_cookie_lifetime', 30000000);
            // sanitize username
            $twitter_user = esc_html ($_POST['twitter_username']);
            $twitter_user = str_replace('http://twitter.com/', '', $twitter_user);
            // save cookie to use in comment form
            setcookie('comment_twitteruser_' . COOKIEHASH, $twitter_user, time() + $comment_cookie_lifetime, COOKIEPATH, COOKIE_DOMAIN);
            // save name to db
            add_comment_meta ($post_id, 'twitter_user', $twitter_user, true);
        }
    }
}

add_action ('comment_post', 'bm_saveTwitterUser');

Mostrar el nombre de usuario de Twitter en los comentarios

En esta parte es donde más pueden utilizar la imaginación para mostrar el nombre de usuario de Twitter, yo lo coloque seguido al nombre de quien comenta, pero lo pueden colocar en cualquier parte del comentario. El código se debe colocar en el archivo comments.php 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<?php
$twittername = '';
$commentAuthorUrl = get_comment_author_url();

if ($comment->user_id > 0) {
    $auth = get_userdata ($comment->user_id);
}

if (isset($auth->twitter)) {
    $twittername = $auth->twitter;
} else {
    $twitter_user_array = get_comment_meta (get_comment_ID(), 'twitter_user');
    if ($twitter_user_array[0]) {
        $twittername = $twitter_user_array[0];
    }
}

if ($twittername != '') {
?>
                (<a class="twitter_anywhere" href="http://twitter.com/<?php echo $twittername; ?>">@<?php echo $twittername; ?></a>)
<?php
}
?>

Agregar el Javascript para mostrar la tarjeta de Twitter @AnyWhere

El código Javascript es el encargado de armar la tarjeta de Twitter @AnyWhere en los comentarios de WordPress. Se puede colocar en el archivo header.php dentro de las etiquetas head o hay quienes recomiendan colocarlo en el footer.php antes de cerrar la etiqueta body para que no interfiera con la carga de la página.

1
2
3
4
5
6
7
8
9

<script src="http://platform.twitter.com/anywhere.js?id=YOUR_API_KEY&v=1"></script>
<script type="text/javascript">
    twttr.anywhere(function(twitter) {
        twitter('.commentlist').linkifyUsers();
        twitter('.twitter_anywhere').hovercards({
            infer: true
        });
    });
</script>

Es necesario sustituir “YOUR_API_KEY” en el javascript por la clave que nos dieron al registrar la aplicación.

© 2007. All Rights Reserved. Theme by: Dezinerfolio