如何在WordPress中顯示帶有照片的作者列表


如果您正在運行一個多作者WordPress博客,並且想要通過顯示帶有照片的作者列表來突出顯示作者,那麼您來對地方了。 之前,我們向您展示瞭如何在WordPress中顯示作者列表,但是這種方法需要大量代碼。 然後,我們向您展示瞭如何在WordPress中創建簡單的人員列表,但這需要您在單獨的部分中重新創建作者個人資料。 在本文中,我們將介紹如何在WordPress中顯示照片的作者列表,而無需編寫任何代碼。

影片教學

訂閱WPBeginner

如果您不喜歡該視頻或需要更多說明,請繼續閱讀。

您需要做的第一件事是安裝並激活Author Avatars插件。 激活插件後,您將獲得一個小部件和兩個短代碼,可用於顯示作者列表及其照片。

使用小部件顯示帶有照片的作者列表

如果要在側邊欄或其他窗口小部件區域中顯示作者列表,則需要使用窗口小部件方法。 去 外觀»小部件 並將AuthorAvatars小部件拖放到側邊欄。 該小部件帶有各種選項,可讓您以所需的方式自定義列表。

添加作者頭像小部件

在窗口小部件的配置屏幕中,您可以設置作者頭像的圖像大小,選擇要顯示的作者信息,設置所需的最少帖子數,選擇用戶角色等等。

使用簡碼顯示帶有照片的作者列表

該插件帶有兩個簡碼。 要在帖子或頁面中添加帶有照片的作者列表,可以使用簡碼 [authoravatars]。 但是,僅添加簡碼將僅顯示作者的化身。 該簡碼還有其他參數,您可以添加這些參數以顯示其他信息。 例如:

[authoravatars avatar_size=44 link_to_authorpage=true show_name=true show_biography=true]

您還可以通過覆蓋主題的style.css文件中的樣式來修改列表的外觀。 我們將此CSS添加到了演示中以自定義顯示:

.shortcode-author-avatars .avatar { 
float:left;
text-align:left;
padding:3px;
margin:3px;
border: 1px solid #EEE;
}
.shortcode-author-avatars div.author-list .user {
text-align: left;
}

這是應用上述自定義CSS之後的作者列表的樣子:

WordPress中帶有照片的作者列表

在WordPress中顯示帶照片的未註冊作者

該插件還允許您通過使用未註冊用戶的電子郵件地址來顯示他們。 這對於在您的站點上可能沒有用戶帳戶的來賓作者特別有用。 您還可以使用此方法通過使用其用戶ID或電子郵件地址突出顯示您網站的任何用戶。 顯示單用戶頭像的簡碼是 [show_avatar]。 它還具有可以像這樣使用的參數:

[show_avatar [email protected] avatar_size=25 align=left]

您還可以通過覆蓋主題的style.css文件中的插件樣式表來修改頭像的外觀。

.shortcode-show-avatar {
  padding: 3px;
  border: 2px solid #EEE;
}

允許作者在WordPress中上傳個人資料照片

默認情況下,此插件使用gravatar,但在某些情況下,您的作者可能不希望顯示其gravatar。 在這種情況下,您可以允許他們在WordPress中上傳自己的個人資料照片。

您需要做的第一件事是安裝並激活Simple Local Avatars插件。 激活後,插件會在用戶個人資料頁面上添加頭像上傳部分。 用戶可以去 用戶»您的個人資料 頁面上載自己的照片,以用作您網站上的頭像。

在WordPress中將用戶個人資料照片添加為本地頭像

如果作者俱有自定義頭像,則作者頭像將僅顯示自定義圖像,而不顯示圖形頭像。

我們希望本文能幫助您在WordPress網站上添加帶有照片的作者列表。 如果您有任何疑問和反饋,請在下面發表評論。 也別忘了跟隨我們 推特