Så här visar du en författarlista med avatarer på sidan WordPress Bidragsgivare

Samtidigt som vi arbetade på en kunds hemsida insåg vi att den inbyggda funktionen för att lista upphovsmän inte var tillräckligt. Vi visade dig hur du visar alla författare från din webbplats, men den här metoden var bara bra om du vill ha en enkel lista att visa i din sidofält. Om du vill skapa en mer innehållsrik och användbar bidrags sida, är den funktionen värdelös.

I den här artikeln kommer vi att visa dig hur du kan skapa en sida med bidragsgivare som visar en lista över författare med avatarer eller userphoto och annan information du vill ha. Denna handledning är en mellannivå handledning.

Det första du behöver göra är att skapa en anpassad sida med den här mallen.

Då måste du öppna functions.php filen i mappen Teman och lägg till följande kod:

 funktion bidragsgivare () global $ wpdb; $ authors = $ wpdb-> get_results ("SELECT ID, user_nicename från $ wpdb-> användare ORDER BY display_name"); foreach ($ författare som $ författare) echo "
"echo" ID; echo "\"> "; echo get_avatar ($ author-> ID); echo" "; echo"; echo "ID; echo "\"> "; the_author_meta (" display_name ", $ author-> ID); echo" "; echo" ";
"; 

Genom att lägga till den här funktionen säger du att WordPress ska skapa en funktion som visar författarens namn och författarens avatar. Du kan ändra avataren till userphoto plugin-inställningen genom att helt enkelt ändra följande rad:

echo get_avatar ($ author-> ID);

och ersätta den med:

echo userphoto ($ author-> ID);

Du kan lägga till fler funktioner i den här funktionen, som att visa författaradress och annan information från profilen genom att följa den använda strukturen.

Du skulle också behöva lägga till följande rader i din CSS-fil:

 #authorlist li clear: left; flyta till vänster; marginal: 0 0 5px 0;  #authorlist img.photo width: 40px; höjd: 40px; flyta till vänster;  #authorlist div.authname margin: 20px 0 0 10px; flyta till vänster;  

När du är färdig med att lägga till funktionen, behöver du nu ringa den i din sidmall. Öppna filen contributors.php eller vad du än namnger filen. Följ samma sidmall som din page.php och i loopen, lägg bara till den här funktionen istället för att visa innehållet:

Detta ger dig en mer innehållsrik sida med bidragsgivare. Detta trick är utmärkt för Multi-Author bloggar.

Nu här är ett exempel på hur vi använde det:

Om du vill ha en sida med bidragsgivare med information som visas i exemplet ovan måste du göra några ändringar i den ursprungliga funktionen. Vi har ett exempelkod som får dig precis allt som visas i bilden ovan.

funktion bidragsgivare () global $ wpdb; $ authors = $ wpdb-> get_results ("SELECT ID, user_nicename från $ wpdb-> användare WHERE display_name 'admin' ORDER BY display_name"); foreach ($ författare som $ författare) echo "
"echo" ID); echo "/ \"> "; echo get_avatar ($ author-> ID); eko" "; eko"; echo "ID); echo "/ \"> "; the_author_meta (" display_name ", $ author-> ID); echo" "; echo"
"echo" Website: ID); echo "/ \" target = "_ blank"> "; the_author_meta (" user_url ", $ author-> ID); echo" ";
"; eko" Twitter: ID); echo "\" target = "_ blank"> "; the_author_meta (" twitter ", $ author-> ID); echo" ";
"echo" ID); echo "/ \"> Besök "; the_author_meta (" display_name ", $ author-> ID); echo" s profilsida "; echo" "; echo" ";
";

Denna kod använder användarfoto plugin. Twitter-fältet visas med hjälp av det trick som vi nämnde i artikeln Hur man visar författarens Twitter och Facebook på profilsidan.

CSS skulle till exempel se ut som:

#authorlist ul list-style: none; bredd: 600px; marginal: 0; vaddering: 0;  #authorlist li margin: 0 0 5px 0; listestil: none; höjd: 90px; vaddering: 15px 0 15px 0; border-bottom: 1px solid #ececec;  #authorlist img.photo width: 80px; höjd: 80px; flyta till vänster; marginal: 0 15px 0 0; vaddering: 3px; gränsen: 1px solid #ececec;  #authorlist div.authname margin: 20px 0 0 10px; 

Du kan visa mer information om du vill använda den avancerade koden som din guide.

Källa till denna funktion