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

مطالب نمایش داده میشه. پس باید کدهای مربوط بهش رو داخل فایل single.php قرار بدیم

ساخت باکس درباره نویسنده

اول از همه قبل از شروع کد نویسی باید ببینم باکس درباره نویسنده چی هستش و از کجا میشه تغییرش داد. پس از پنل مدیریت وردپرس  به قسمت کاربران بروید و نام کاربریتونو انتخاب و دکمه ویرایش رو بزنید. یک سری تنظیمات خواهید دید. از قبیل نام شما ایمیل شما و….

یک قسمت دیگه ای هم هستش  با عنوان درباره خودتان

about

که در این قسمت هم توضیحاتی درباره نویسنده درج میشه ( همونطور که توی سایت خودم هستش ) بسیار خب حالا شروع می کنیم

فایل single.php تم رو در حالت ادیت باز کنید. بعد از کد

یک div با کلاس author-box ایجاد کنید. خب حالا باید نام نویسنده و تصویر آواتار و همچنین توضیحاتی درباره نویسنده داخل آن قرار بدیم

get_avatar()  = این تابع همونطور که از اسمش پیداست آواتار رو بر میگردونه. اما اگر این  تابع رو به تنهایی در فایل قرار بدیم و ذخیره کنیم تصویری بهمون نمایش نمیده. چرا که این تابع آرگومان هایی دارد که یکی از آنها id نویسنده هستش و از اونجایی که نویسنده ممکنه هر شخصی باشه و id مشخصی نداره پس با استفاده از

آی دی نویسنده رو هم بهش میدیم. پس کد زیر را داخل div قرار میدیم.

عدد 80 هم که گذاشتیم اندازه تصویر آواتار هستش و می تونیم تغییرش بدیم.

حالا باید نام نویسنده رو نمایش بدیم.

the_author(): این تابع هم نام نویسنده رو بر میگردونه. حالا کد زیر رو در ادامه کد بالا قرار بدهید:

حالا نوبت به نمایش توضیحاتی هستش که در قسمت “درباره خودتان” وارد می کنیم. این هم ساده س

باید با استفاده از the_author_meta() توضیحات رو بگیریم.  پس این کد رو هم در ادامه کد بالا قرار میدیم

در نهایت باید کد زیر رو داشته باشیم:

حالا فایل رو ذخیره می کنیم. از پنل مدیریت وردپرس قسمت کاربران، برای حساب کاربریتون توضیحاتی وارد کنید و ذخیره کنید. حالا یکی از مطالب سایت رو باز کنید.باید باکسی شبیه به تصویر زیر در ادامه مطلب اضافه شده باشد

author

بسیار خب حالا باید بهش استایل بدیم تا مرتب دیده بشه

فایل style.css رو هم باز کنید و کد زیر را قرار دهید

 

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

author-final

آموزش امروز طراحی قالب وردپرس – ساخت باکس درباره نویسنده هم به اتمام رسید. امیدوارم که خوشتون اومده باشه

موفق باشید

4 دیدگاه برای “آموزش طراحی قالب وردپرس – ساخت باکس درباره نویسنده

دیدگاه خود را بیان کنید