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

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

روش اول: استفاده از افزونه WP User Manager

این روش بسیار آسان می‌باشد و برای تمامی کاربران مناسب است. اولین کاری که باید انجام شود نصب افزونه WP User Manager می‌باشد. پس از نصب، برای فعال‌سازی باید به قسمت Users » WPUM Settings وارد شوید و از قسمت تنظیمات، افزونه را پیکربندی کنید.

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

در مرحله بعد روی تب پروفایل کلیک کنید.

در این قسمت می‌توانید برای کاربران مهمان نیز صفحه پروفایل فعال کنید. این کار باعث می‌شود هرکس بتواند پروفایل کاربران را مشاهده کند. تنظیمات می‌تواند به‌صورتی باید که تنها کاربران سایت بتوانند پروفایل یکدیگر را مشاهده کنند. اگر این گزینه را غیرفعال کنید هر کاربر تنها صفحه پروفایل خویش را می‌تواند مشاهده کند. امکان آپلود تصویر و توضیحات دلخواه می‌تواند برای کاربران سایت فعال‌سازی شود. پس از اتمام پیکربندی، فشردن دکمه ذخیره تغییرات را فراموش نکنید. 

در مرحله بعد باید برای صفحه پروفایل نویسنده لینک یکتا ایجاد کنید. در قسمت Settings » Permalinks وارد شوید و صفحه را اسکرول به سمت پایین کنید تا به آخرین بخش برسید.

 این افزونه امکان استفاده از آی دی کاربر، نام کاربری یا نام مستعار در URL یکتا را فراهم کرده است. استفاده از نام کاربری و نام مستعار در URL بهتر است و پیشنهاد می‌شود یکی از این دو گزینه انتخاب شود. دکمه ذخیره تغییرات را فشار دهید. تقریبا کار به پایان رسیده است و باید کاربران این صفحه را در وبسایت پیدا کنند و اطلاعات خود را وارد کنند.  به قسمت Appearance » Widgets وارد شوید و ویجت WPUM] Login Form] را به منوی کناری اضافه کنید.

در این لحظه صفحه پروفایل در سایت ایجاد شده است.

کابرانی که از حساب کاربری سایت خارج شده‌اند در منوی کناری ویجت لاگین را مشاهده می‌کنند.

روش دوم: استفاده از روش دستی

 این روش با اضافه کردن شبه کد به صورت دستی در فایلهای پوسته سایت امکان ایجاد صفحه دلخواه پروفایل کاربران را فراهم می‌کند. اول از همه باید با استفاده از FTP client به وبسایت وصل شوید و به پوشه /wp-content/themes/your-current-theme/ هدایت شوید. در این فولدر فایلی با نام author.php بسازید و محتویات فایل archive.php را داخل فایل جدید انتقال دهید. اگر فایلی با نام author.php از قبل داشتید، کافیست تغییراتی که در ادامه گفته می‌شود را در آن اعمال کنید. در این فایل چیزهایی که بین get_header و get_sidebar هستند قابلیت اعمال تغییرات را دارند.

<?php
// Set the Current Author Variable $curauth
$curauth = (isset($_GET['author_name'])) ? get_user_by('slug', $author_name) : get_userdata(intval($author));
?>
    
<div class="author-profile-card">
    <h2>About: <?php echo $curauth->nickname; ?></h2>
    <div class="author-photo">
    <?php echo get_avatar( $curauth->user_email , '90 '); ?>
    </div>
    <p><strong>Website:</strong> <a href="<?php echo $curauth->user_url; ?>"><?php echo $curauth->user_url; ?></a><br />
    <strong>Bio:</strong> <?php echo $curauth->user_description; ?></p>
</div>
    
<h2>Posts by <?php echo $curauth->nickname; ?>:</h2>


		 <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<h3>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link: <?php the_title(); ?>">
<?php the_title(); ?></a>
</h3>
<p class="posted-on">Posted on: <?php the_time('d M Y'); ?></p>

<?php the_excerpt(); ?>

<?php endwhile; 

// Previous/next page navigation.
the_posts_pagination();


else: ?>
<p><?php _e('No posts by this author.'); ?></p>

<?php endif; ?>

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

<?php

.author-profile-card {
    background: #eee;
    border: 1px solid #ccc;
    padding: 20px;
    margin-bottom: 20px;
}
.author-photo {
    float: left;
    text-align: left;
    padding: 5px;
}

?>

پس از این تغییرات دموی سایت بدین صورت خواهد بود.