Mientras trabajaba en el sitio web de un cliente, nos dimos cuenta de que la función incorporada para los autores de la lista no era suficiente. Le mostramos cómo mostrar todos los autores de su sitio, pero ese método solo fue bueno si desea que se muestre una lista simple en su barra lateral. Si desea crear una página de contribuyentes más rica en contenido y útil, entonces esa función es inútil.

En este artículo, le mostraremos cómo puede crear una página de colaboradores que mostrará una lista de autores con avatares o fotos de usuario y cualquier otra información que desee. Este tutorial es un nivel intermedio tutorial.

Lo primero que debe hacer es crear una página personalizada utilizando esta plantilla.

Entonces necesitarás abrir functions.php archivo en su carpeta de temas y agregue el siguiente código:

Contribuyentes de la función () {
 global $ wpdb;

 $ authors = $ wpdb-> get_results ("SELECT ID, user_nicename from $ wpdb-> users ORDER BY display_name");

 foreach ($ authors as $ author) {
 eco " 
  • «;
    echo «ID;
    echo «»> «;
    echo get_avatar ($ author-> ID);
    eco «»;
    eco «;
    echo «ID;
    echo «»> «;
    the_author_meta (‘display_name’, $ author-> ID);
    eco «»;
    eco «»;
    eco »
  • «;
    }
    }

    Al agregar esta función, le está diciendo a WordPress que cree una función que muestre el nombre del autor y el avatar del autor. Puede cambiar la configuración de avatar a plugin de usuario simplemente cambiando la siguiente línea:

    echo get_avatar ($ author-> ID); 

    y reemplazándolo con:

    echo userphoto ($ author-> ID); 

    Puede agregar más funciones a esta función, como mostrar la URL del autor y otra información del perfil siguiendo la estructura utilizada.

    También necesitaría agregar las siguientes líneas a su archivo CSS:

    #authorlist li {
     claro: izquierda;
     flotador izquierdo;
     margen: 0 0 5px 0;
     }
    
     #authorlist img.photo {
     ancho: 40px;
     altura: 40px;
     flotador izquierdo;
     }
    
     #authorlist div.authname {
     margen: 20px 0 0 10px;
     flotador izquierdo;
     } 

    Una vez que haya terminado de agregar la función, ahora deberá llamarla en su plantilla de página. Abra el archivo contributors.php o lo que sea que nombre el archivo. Siga la misma plantilla de página que su página.php y en el bucle, simplemente agregue esta función en lugar de mostrar el contenido:

    
    

    Esto le proporcionará una página de contribuyentes más rica en contenido. Este truco es excelente para los blogs de varios autores.

    Ahora aquí hay un ejemplo de cómo lo usamos:

    Ejemplo de una página de contribuyentes con lista de autores y otra información

    Si desea tener una página de colaboradores con información como la que se muestra en el ejemplo anterior, deberá realizar algunos cambios en la función original. Tenemos un código de ejemplo que le dará exactamente todo lo que se muestra en la imagen de arriba.

    Contribuyentes de la función () {
     global $ wpdb;
    
     $ authors = $ wpdb-> get_results ("SELECT ID, user_nicename from $ wpdb-> users WHERE display_name 'admin' ORDER BY display_name");
    
     foreach ($ authors as $ author) {
    
     eco " 
  • «;
    echo «ID);
    echo «/»> «;
    echo get_avatar ($ author-> ID);
    eco «»;
    eco «;
    echo «ID);
    echo «/»> «;
    the_author_meta (‘display_name’, $ author-> ID);
    eco «»;
    eco »
    «;
    echo «Website: ID);
    echo «/» target = ‘_ blank’> «;
    the_author_meta (‘user_url’, $ author-> ID);
    eco «»;
    eco »
    «;
    echo «Twitter: ID);
    echo «» target = ‘_ blank’> «;
    the_author_meta (‘twitter’, $ author-> ID);
    eco «»;
    eco »
    «;
    echo «ID);
    echo «/»> Visita «;
    the_author_meta (‘display_name’, $ author-> ID);
    la página de perfil de echo «;
    eco «»;
    eco «»;
    eco »
  • «;
    }
    }

    Este código utiliza el plugin User Photo. El campo de Twitter se muestra utilizando el truco que mencionamos en el artículo Cómo mostrar Twitter y Facebook del autor en la página Perfil.

    El CSS por ejemplo se vería así:

    #authorlist ul {
     lista-estilo: ninguno;
     ancho: 600px;
     margen: 0;
     relleno: 0;
     }
     #authorlist li {
     margen: 0 0 5px 0;
     lista-estilo: ninguno;
     altura: 90px;
     relleno: 15px 0 15px 0;
     border-bottom: 1px solid #ececec;
     }
    
     #authorlist img.photo {
     ancho: 80px;
     altura: 80px;
     flotador izquierdo;
     margen: 0 15px 0 0;
     relleno: 3px;
     borde: 1px sólido #ececec;
     }
    
     #authorlist div.authname {
     margen: 20px 0 0 10px;
     } 

    Puede mostrar más información si lo desea utilizando el código avanzado como su guía.

    Fuente de esta función