فروشگاه فیگووب

نحوه نمایش لیست نویسندگان با آواتار در صفحه همکاران سفارشی وردپرس

در سایت های دیگه مشاهده کردید که نمایش لیست نویسندگان را دارند که خیلی جالب است کاربران قدیمی در بالا و کاربران جدید در پایین . ما هم گفتیم یک آموزش ایجاد کنیم که بتوانید شما هم صفحه نمایش لیست نویسندگان را ایجاد کنید و به کاربران سایت نشان دهید که چند نفر نویسنده هستتند.

هنگام کار در سایت مشتری ، متوجه شدیم که عملکرد داخلی برای لیست کردن نویسندگان کافی نیست. ما به شما نشان دادیم که چگونه همه کاربران سایت خود را نمایش دهید ، اما این روش فقط در صورتی خوب است که بخواهید یک لیست ساده در نوار کناری شما نمایش داده شود. اگر می خواهید یک صفحه با محتوای مفید و مفیدتر ایجاد کنید ، این عملکرد بی فایده است و باید این آموزش نگاه کنید که می توانید نمایش لیست نویسندگان با آواتار در صفحه جدا درست کنید.

در این مقاله ما به شما نشان خواهیم داد كه چگونه می توانید صفحه نمایش لیست نویسندگان دارای آواتار یا userphoto و هر اطلاعات دیگری را كه دوست دارید فراخانی کنید. این آموزش دقت کنید این آموزش سطح متوسط ​​است.

آموزش نمایش لیست کاربران

اولین کاری که باید انجام دهید ایجاد یک صفحه سفارشی که می توانید آموزش را تماشا کنید است.

سپس باید فایل functions.php را در پوشه قالب فعال خود باز کرده و کد زیر را به اخر ان اضافه کنید اضافه کنید:

function contributors() {
    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 ) {
        echo "<li>";
        echo "<a href=\"".get_bloginfo('url')."/author/";
        the_author_meta('user_nicename', $author->ID);
        echo "/\">";
        echo get_avatar($author->ID);
        echo "</a>";
        echo '<div class="figuweb-content">';
        echo "<a href=\"".get_bloginfo('url')."/author/";
        the_author_meta('user_nicename', $author->ID);
        echo "/\">";
        the_author_meta('display_name', $author->ID);
        echo "</a>";
        echo "<br />";
        echo "Website: <a href=\"";
        the_author_meta('user_url', $author->ID);
        echo "/\" target='_blank'>";
        the_author_meta('user_url', $author->ID);
        echo "</a>";
        echo "<br />";
        echo "</div>";
        echo "<a class='author-page-figuweb' href=\"".get_bloginfo('url')."/author/";
        the_author_meta('user_nicename', $author->ID);
        echo "/\"> بازدید ";
        the_author_meta('display_name', $author->ID);
        echo " صفحه پروفایل";
        echo "</a>";
        echo "</li>";
    }
}

با افزودن این تابع به وردپرس می گویید تا تابعی ایجاد کند که نام نویسنده و آواتار نویسنده را نشان دهد. با تغییر خط زیر می توانید آواتار را به تنظیمات افزونه userphoto تغییر دهید:

echo get_avatar($author->ID);

و جایگزین کردن آن با:

echo userphoto($author->ID);

با دنبال کردن ساختار استفاده شده ، می توانید ویژگی های بیشتری مانند نمایش URL نویسنده و سایر اطلاعات از نمایه را به این عملکرد اضافه کنید.

همچنین باید خطوط زیر را به پرونده CSS خود اضافه کنید:

#authorlist li {
    width: 50%;
    max-width: 300px;
    clear: left;
    float: left;
    list-style: none;
    margin: 0 0 10px 0;
    padding: 10px;
    border: 1px solid #dcdcdcee;
    border-radius: 5px;
	box-shadow: 0 0 1px #000;
}
#authorlist a {
    text-decoration: none;
    display: inline-block;
}
#authorlist .figuweb-content {
    display: inline-block;
    line-height: 25px;
}
#authorlist img.photo {
    width: 50px;
    height: 50px;
    float: left;
    margin-right: 10px;
    border-radius: 100%;
}
#authorlist .authname {
	margin: 20px 0 0 10px;
	float: left;
}
#authorlist .author-page-figuweb {
    border: 1px solid #ff9800;
    padding: 5px;
    border-radius: 3px;
    color: #ff9800;
    margin-top: 15px;
    display: block;
    text-align: center;
}
#authorlist .author-page-figuweb:hover{
    background: #ff9800;
    color: #fff;
}

پس از اضافه کردن عملکرد ، اکنون باید آن را در الگوی صفحه خود فراخوانی کنید. فایل contributor.php یا هر نام دیگری را که نام فایل قرار دهید باز کنید. الگوی صفحه مشابه page.php خود را دنبال کنید و در حلقه قرار دهید ، فقط این عملکرد را به جای نمایش محتوا اضافه کنید:

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

با این کار صفحه همکاران بیشتری با محتوای غنی در اختیار شما قرار می گیرد. این ترفند برای وبلاگهای چند نویسنده بسیار عالی است.

اکنون در اینجا مثالی از نحوه استفاده از آن آورده شده است:

اگر از شکل بالا خوشتان نمی اید می توانید خودتان با کد های css می توانید شفارسی کنید

امیدواریم با این آموزش توانسته باشید لیست کاربران را نمایش دهید. اگر می خواهید اطلاعات پیشرفته شر شود و امکانات دیگر به آن اضافه شود در بخش دیدگاه ها برای ما نظر ارسال کنید. موفق باشید

راستی! برای دریافت مطالب جدید در کانال تلگرام یا پیج اینستاگرام فیگووب عضو شوید.

نظر شما در این‌باره چیست؟

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *