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.
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>';