I am attempting to display the authors of my site in a jquery carousel but for some reason my images are outputted outwith the li tags and I don't know why.

Code

functions.php

function contributors() {
    global $wpdb;

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

    foreach($authors as $author) {
        // display user image for each author
        echo '<li class="author" id="author-'.$author->ID.'">'.userphoto($author->ID).'</li>';
    }
}

Template File

<?php while ( have_posts() ) : the_post(); ?>

    <div id="authorlist"><ul id="authorcarousel"><?php contributors(); ?></ul></div>

<?php endwhile; // end of the loop. ?>

Output

<div id="authorlist">
    <ul id="authorcarousel">
        <img src="/wordpress/wp-content/uploads/userphoto/1.jpg" alt="admin" width="143" height="150" class="photo" />
        <li class="author" id="author-1"></li>
        <img src="/wordpress/wp-content/uploads/userphoto/3.png" alt="" width="128" height="128" class="photo" />
        <li class="author" id="author-3"></li>
        <img src="/wordpress/wp-content/uploads/userphoto/2.png" alt="" width="128" height="128" class="photo" />
        <li class="author" id="author-2"></li>
    </ul>
</div>

What I am aiming for is the image to be outputted between the li tags.

A bonus question if someone knows the answer - how to edit the query so that only authors are displayed and not site admins? I tried adding a WHERE clause to the query but it didn't work.

Any help is much appreciated as I am a WordPress n00b.

I am attempting to display the authors of my site in a jquery carousel but for some reason my images are outputted outwith the li tags and I don't know why.

Code

functions.php

function contributors() {
    global $wpdb;

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

    foreach($authors as $author) {
        // display user image for each author
        echo '<li class="author" id="author-'.$author->ID.'">'.userphoto($author->ID).'</li>';
    }
}

Template File

<?php while ( have_posts() ) : the_post(); ?>

    <div id="authorlist"><ul id="authorcarousel"><?php contributors(); ?></ul></div>

<?php endwhile; // end of the loop. ?>

Output

<div id="authorlist">
    <ul id="authorcarousel">
        <img src="/wordpress/wp-content/uploads/userphoto/1.jpg" alt="admin" width="143" height="150" class="photo" />
        <li class="author" id="author-1"></li>
        <img src="/wordpress/wp-content/uploads/userphoto/3.png" alt="" width="128" height="128" class="photo" />
        <li class="author" id="author-3"></li>
        <img src="/wordpress/wp-content/uploads/userphoto/2.png" alt="" width="128" height="128" class="photo" />
        <li class="author" id="author-2"></li>
    </ul>
</div>

What I am aiming for is the image to be outputted between the li tags.

A bonus question if someone knows the answer - how to edit the query so that only authors are displayed and not site admins? I tried adding a WHERE clause to the query but it didn't work.

Any help is much appreciated as I am a WordPress n00b.

• wp-query

1 Answer 1

You should be using get_users() - this will perform your query and also allow you to limit by role.

http://codex.wordpress/Function_Reference/get_users

userphoto isn't a WordPress function, but get_avatar() is: http://codex.wordpress/Function_Reference/get_avatar

Just check out the Codex examples and you should be able to modify to suit your needs!

-- UPDATE -- I reread and realized maybe userphoto is coming from another plugin - yes? If so, check if the result of that function echos the result. If so, you will need to change that part to:

echo '<li class="author" id="author-'.$author->ID.'">';
userphoto($author->ID);
echo '</li>';