Tutorial: crear una barra con los datos del autor

Si nuestro blog es unipersonal, es probable que no nos interese el siguiente tutorial. Pero si tenemos un en blog multipersonal, ya sea con una cantidad determinada de colaboradores  o abierto todo aquel que quiera colaborar (como éste), puede ser una buena idea mostrar de forma dinámica los datos del autor de la entrada actualizados al día.

Seguramente existe más de un plugin para realizar esto o algo por el estilo, pero como soy un fanático del hágalo usted mismo les voy a mostrar cómo hacerlo por código utilizando las mismas funciones de WordPress.

Cabe aclarar que más allá del código php y html, seguramente cada uno necesitará adaptar un poco los estilos css a su theme. De todas formas sobre utilizar el theme por defecto de wordpress 2.9.2. La idea por supuesto es que tengan alguna idea de html, php y css, pero sino copiar y pegar el código final también vale. Comencemos entonces con el código:

Creemos primero el div que va a contener todo:

Vamos a comenzar mostrando el gravatar del autor. Para eso vamos a utilizar la función “get_avatar()” que recibe el id del usuario y el ancho en pixeles del avatar, y retorna el código html listo para insertar. A su vez para obtener el id del autor usaremos la función “get_the_author_meta()” que nos servirá para obtener casi cualquier información acerca del mismo, recibe como parámetro el dato a recuperar. Una vez obtenido el código lo imprimimos:

Ahora lo segundo seria agregar un título con un enlace al sitio web del autor, para eso utilizaremos la función “the_author_link()” que imprime el nombre publico del autor como link a su sitio.

Si pensamos en el SEO y preferimos que el enlace sea nofollow (o sea que los bots como el de Google no lo considere). Podriamos hacer lo siguiente:

Como verán usamos la función “the_author()” que imprime el nombre publico del author y la función “the_author_meta()” para obtener el link de su web.

Ahora utilicemos nuevamente la función “the_author_meta()” pero para obtener su descripción:

Si por cuestiones de diseño quisiéramos recortarla a no mas de una x cantidad de caracteres podemos usar la función “substr()” de php. Recibe la cadena a recortar, el punto de inicio y la cantidad de caracteres. Para recuperar la descripción usamos “get_the_author_meta()”, como ya habrán deducido, cuando lo usamos con get_ adelante recuperamos el valor y cuando lo usamos sin el, directamente lo imprimimos. Por ejemplo si quisiéramos recortar la descripción a 140 caracteres:

Ahora la idea va a ser mostrar la cantidad de post del autor (una pavada que hacemos con la función “the_author_posts()”) pero que a su vez funcione como un link a la pagina con los post del author. Esta página en un blog con permalinks “bonitos” tendría la siguiente forma tu-dominio.com/author/el-autor/. Pero como dependiendo de la configuración, esto puede cambiar, vamos a obtener primero el link a la página con los posts del autor.

Para nuestra tarea vamos a hacer uso de la función “get_author_posts_url()” que recibe el id del autor y devuelve el link que mostramos. Para obtener el id, volvemos a usar la función “get_the_author_meta()”:

Ya el link armado para mostrar todo lo que queríamos queda así:

Para finalizar los datos a mostrar nos queda un detalle mas, los comentarios realizados por el autor. Dado que no existe (o más bien, yo no conozco) una función para obtener directamente la cantidad de comentarios de un autor, vamos a crear una, basándonos en el sql que Fernando me facilito tan amablemente hace un tiempo,que a su vez esta basado en el del plugin wordpress-plugin-nofollow-free:

Debido al hecho de que si los comentarios del blog son abiertos al que quiera comentar, nos vamos a encontrar con un mismo usuario que comenta con 2 email y nombres distintos o 2 usuarios que comentan con el mismo nombre; el resultado de la función no siempre va a ser exacto. Pero dentro de todo funciona bastante bien.

Ahora vamos a insertarla en el archivo functions.php de nuestro theme para poder utilizarla. En nuestro código vamos a utilizarla así (insertándola en el mismo párrafo que la de los posts del autor):

Todo nuestro código insertado dentro del div contenedor y puesto en forma de función por una cuestión de practicidad queda así:

Si al colocar ambas funciones en su archivo functions.php empiezan a saltarles errores diciendo que las cabeceras no se han podido enviar, lo mas probable es que hayan dejado saltos de línea o espacios por fuera de las etiquetas de php.

Por último vamos a agregar a la hoja de estilos de nuestro theme algunos retoques para embellecer nuestra barrita (por lo menos para que en Kubrick se vea bien):

En lo personal inserte la barrita arriba del título (llamando a la función show_author_data), pero cada uno colóquela donde quiera (siempre y cuando sea adentro del bucle).

Mi barrita en Kubrick se ve así (no se ve el gravatar porque al momento de tomar la captura me encuentro offline):

Para que funcione en Twenty Ten (el tema por defecto en wp 3.0) hay que armar una estructura un poco más compleja en cuanto a divs y css:

Y los css:

[code]#author-data {
color: #000000; /* o sea negro */
font-size: 14px;
background: #cccccc;
margin: 10px 0;
padding: 3px;
float: left;
clear: both;
width: 100%;

/*si ponen lo siguiente su css no va a validar */
border-radius: 5px; /*para opera*/
moz-border-radius: 5px; /*para firefox */
webkit-border-radius: 5px; /*para safari y chrome*/
khtml-border-radius: 5px; /* para konkeror */
box-shadow: 2px 2px 5px #000000; /*para opera*/
-moz-box-shadow: 2px 2px 5px #000000;/*para firefox*/
-webkit-box-shadow: 2px 2px 5px #000000;/*para safari y chrome*/
-khtml-box-shadow: 2px 2px 5px #000000;/*para konkeror*/
}

#author-data #author-gravatar {
margin: 4px;
float: left;
margin: 4px -104px 4px 4px;
}

#author-data #author-info {
float: left;
margin: 0 0 0 104px;
}

#author-info h4 {
font-size: 17px;
margin: 2px;
padding: 0;
}

#author-info p {
margin: 2px;
padding: 4px;
}[/code]

El resultado es el siguiente:

Palabras Finales

Espero que algún valiente haya llegado hasta acá. La idea del tutorial no era tanto hacer la barrita en si, sino colaborar a que de a poco muchos empiecen a perderle el miedo al código y no sean tan plugin dependientes.

Además tenía tiempo queriendo colaborar con algún post para esta bodega de conocimiento que es AyudaWordpress. Espero les sea útil.

PD: para el que no entendió un pomo pero igual quiere la barrita acá la tiene en forma de plugin(eso si, en versión súper minimalista, no esperen panel de control, opciones, ni nada por el estilo).

AVISO: esta publicación es de hace dos años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado.

Valora este artículo para mejorar la calidad del blog ...

PobreRegularEstá bienMuy buenoExcelente (sin valoración aún)
Loading...

Autor: study

Comparte esta entrada en
468 ad
  • FrankPereiro

    Qué lástima que el css no valide (por culpa del IE ¿no es así?)

    De todos modos, impresionante tutorial. Gracias. Yo creo que lo pondré en práctica.

    • En realidad, no valida por culpa de hacks para Firefox, Safari y navegadores KHTML, que no interpretan bien el CSS3 ESTANDAR. Mira donde esta el CSS: lo no-estandar es lo que comienza con <code>-moz-</code>, <code>-webkit-</code> y <code>-kthml-</code>.

      Y lo triste de esto es que hay que irse acostumbrando, porque hasta ahora el único navegador que da muestras de interpretar CSS3 estándar es Opera. Para Firefox, Safari y KHTML's hay que seguir usando hacks que solo ellos reconocen :/

  • Buen truco.

    Por cierto, también redacto en este blog y también tuve en más de una ocación problemas con el plugin para mostrar el código resaltado: ignora esos cambios, cuando el artículo se publica, esto se arregla solo… o es eso, o Fernando ha estado editando mis artículos xD

    Saludos!

  • Bueno, no se si se arreglo solo o lo editor fer, pero ahora se ve bien.

    Lo del css si es por culpa de los hacks, pero igual lo de la validación un poco como que da igual, porque en general si usan plugins o el editor visual de wp (como el 99.99% de los blogs) lo mas probable es que su sitio ya no valide, así que que le hace una mancha mas al tigre 😀

    • Lo apañé anoche, no tuve tiempo de avisarte 🙂

      • Gracias entonces.

  • Sabogal

    Perfecto, sólo un detalle: ¿Cómo haría para excluir al autor admin?

    Saludos!

  • ¿porque querrías excluirlo?. Igual no seria muy difícil, sino me equivoco en una instalación estándar, el usuario admin, es el usuario con ID numero 1. Tendrías que usar una condición mas o menos así en la función show_author_data:

    if(get_the_author_meta('ID') != 1){

    el resto de la función

    }

  • Darío Ferrer

    Study, quizás así sería más semántico:

    <code>if ( is_admin() ) {

    el resto de la función

    }</code>

  • Creí que esa función servia para el usuario logueado, no para el autor de una entrada. Igual gracias por el aporte. Aunque como veras estoy intentando bloquear al usuario admin original, no a todos los administradores (si hubiera otros), sino hubiera preguntado por el nivel de usuario, no por su id.

  • Sabogal

    No he podido condicionar que no se muestra los datos del autor cuando el post corresponde a admin.

    Podría alguien por favor indicarme los pasos?

  • ¿ya todo lo demás funciona bien?. Despues, cuando llames a la funcion "show_author_data", llamala así:

    if(get_the_author_meta('ID') != '1'){

    show_author_data();

    }

    Fijate que ahora el 1 esta entre comillas simples.

  • Sabogal

    Grcias, ya he conseguido hacerlo así:

    <code></code>
    Saludos!

  • Jesús

    Hay que agradecer tu dedicación y ganas de compartir, desde luego, Study. Si puede ser, quisiera hacer una pregunta, al hilo de tu tutorial. Yo utilizo el theme Kubrick, y en mi blog escirben varios autores, pero no controlo el código php. ¿cómo puedo hacer que en la entrada me salga, por defecto, quién escribió, sin que haga falta pinchar en la entrada específica, como veo que es el resultado final de tu estupendo tutorial?

    Ya mismo, gracias.

  • No se si entendí bien tu pregunta, pero te cuento que se puede mostrar el nombre público del autor sencillamente usando la función the_author()

  • Moon

    Osea que no funciona no?

  • Lo de los comentarios nunca me funcionó pero lo demás anda perfecto en wordpress 3.1.3

    Sólo una duda amigo, hay forma de que tambien se puedan detectar el numero de pages escritas o publicadas por ese autor??

    Hay alguna función para eso??

    Espero tu respuesta, saludos.

  • Cheitto

    no hay algun plugin ke haga eso hahaha para los ke no sabemos de codigo esto es complicado 

  • Remanencia

    si me sirvio ,gracias por el  aporte

Pin It on Pinterest