جعبه درباره نویسنده در وردپرس

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

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

نوشتن متن درباره نویسنده

در وردپرس به قسمت کاربران رفته و هر کاربر گزینه ویرایش پروفیل خودشه انتخاب کنه.قسمت نام را تکمیل کند همچنین در انتها یک قسمتی هست به نام “زندگی نامه” که این همون خلاصه اطلاعات نویسندس که باید برای خودتان پرش کنید.

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

به قالب خود رفته و در انتهای شیوه نامه خود (style.css) استایل زیر را اضافه کنید.

.meetauthor
{
 margin-top: 20px;
 padding: 10px;
 background-color: #4599f0;
 border: 1px solid #B9B9B9;
 color: white;
 border-bottom:3px solid #0a60b8;
}

.meetauthor img
{
 width: 100px;
 height: 100px;
 margin-left:15px;
 padding: 3px!important;
 float: right;
}

اضافه کردن به انتهای نوشته

برگه single.php را انتخاب کنید و در هرجایی که مایلید این کادر به نمایش دربیاد این کدها رو کپی کنید.بهتره که در انتهای نوشته بزارید.


درباره نویسنده :
<div class="meetauthor">

<div id="ContentPlaceHolder1_meetauthor_image"><?php echo get_avatar (get_the_author_email(), '100'); ?></div>

<div id="ContentPlaceHolder1_meetauthor_content" class="meetcontent"><strong><?php the_author_meta('display_name'); ?></strong><br/>
<?php the_author_meta('user_description'); ?>
 </div>

</div>

در این کادر اون آواتار شما هم که درسایت گراواتار هست به نمایش درخواهد آمد مثل آواتار شما در قسمت نظرات.برای تغییر عکس خودتون به اون سایت برید.در ضمن اون عدد 100 اندازه تصویر شما هست.به هر مقدار که مایلید تغییر بدید.

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

امتیاز شما برای این مقاله
64 نظرات
  1. علی می گوید

    من می خوام این بخش حذف کنم باید چیکار کنم

  2. اشکان می گوید

    چطور این جعبه متن رو از قالب حذف کنیم

  3. حسن می گوید

    با سلام ، وقت بخیر

    ما میخوایم توی صفحه اصلی سایت یه قسمت متنی باشه که از پنل مدیریت بتونیم هر هفته یه مقاله بذاریم توی این قسمت و بازدیدکنندگان فقط یه محیط متنی ببیند که مقاله ما داخلشه و نتونن هیچ تغییری توی متن ایجاد کنند ، مثل بقیه صفحات سایت

    میخوایم به صورتی باشه که بشه سایز و رنگ نوشته هاشو عوض کرد و … بقیه کارای ویرایشی روی متن رو انجام داد

    visual composer دارم روی قالبم اما از المان متن که استفاده میکنم ، نمیشه ارتفاع و پهناش رو تنظیم کرد ، نمیشه اسکرول بهش داد که مثلا اگر مقاله 100 تا خط بود

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

    ممنون میشم راهنماییم کنید

    با تشکر

  4. morteza yung می گوید

    سلام
    خواستم بگم که آی دی user-description
    در وردپرس نسخه جدید عمل نمکنه لطفا از description استفاده کنید و پست رو ویرایش کنید
    مچکرم

  5. محمّد باقری می گوید

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

    1. عباس صادقی می گوید

      سلام، استایل رو ویرایش کنید و از خاصیت important استفاده کنید برای اندازه ها و..

  6. amir می گوید

    بسیار مطلب جالب و بدرد بخوری بود.
    متشکرم!

  7. REZA می گوید

    بابا دمت گرم؛ کلی چرخیدم همه کدهایی که تو سایتای دیگه بود مشکل داشت تا اینکه این کد عالی بود!
    موفق باشی

  8. دانلود آهنگ می گوید

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

  9. محمد می گوید

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

    ای ول

  10. ندا می گوید

    سلام
    من کد رو طبق فرمایشات شما در سایتم قرار دادم اما هر کاری میکنم نمی تونم عکسی واسش قرار بدم میشه بیشتر توضیح بدید منتظرم ممنون

  11. رضا می گوید

    مرسی واقعا .
    خیلی دنبال این آموزش میگشتم.

  12. رحمت می گوید

    با عرض سلام وخسته نباشید امید وارم حالت خوب باشه آقا آرش یه چند تا سوال داشتم نمی دونستم ازکی بپرسم گفتم بد نیست از شما بپرسم 1-چطور می تونم یه لوگو برای سایتم بسازم منظورم رو که می فهمید2- چه طوری می تونم در فوتر سایتم محبوب ترین مطالب و آمار بازدید کننده ها رو قرا بدم ؟
    3- چطور می تونم یه چت روم درست کنم چند وقت پیش یه چت روم با سیستم {ایت چت } ساختم ولی زود هک شد می خواستم بدونم سیستم دیگری نیز هست که به وسیله ی اون یه چت روم ساخت ؟
    با تشکر امید وارم در تمامی مراحل زندگی موفق باشی

    1. آرش حیدری می گوید

      سلام ، خواهش می کنم
      لوگو رو با فتوشاپ می سازند
      برای قرار دادن محبوب ترین ها ، قبلا آموزش اینکار رو برای وردپرس آموزش داده بودیم.
      doctorwp.com/255
      راستش در ارتباط با چت روم هم زیاد اطلاع ندارم
      موفق باشید

  13. دانلود آهنگ جدید می گوید

    سلام…ممنون ازم مطالب خوبتون

  14. مدیر اندرویدسرا می گوید

    درود بر شما
    بسیار سپاسگذارم از شما بابت مطلب آموزشی خوبی گه قرار دادید.

  15. سید مرتضی طهماسبی لاریمی می گوید

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

    1. آرش حیدری می گوید

      سلام
      دوست عزیز حتی بدون شیوه نامه اگر اون کدهای php رو درست کپی کرده باشید باید نمایش داده بشه ، لطفا یکبار کدها رو کامل کپی کنید و بعدش هر قسمت رو که خواستین تغییر بدید.

  16. محسن می گوید

    سلام خسته نباشيد من ميخوام رنگ پس زمينه به جاي آب بشه طوسي بايد چيكار كنم؟كدوم قسمت شيوه نام رو ويرايش كنم؟

    1. آرش حیدری می گوید

      سلام
      برای ویرایش رنگ زمینه در شیوه نامه ها باید کد رنگ رو عوض کنید برای مثال
      background-color:#eeeeee;
      سپاس

  17. سجادآذرباد می گوید

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

  18. djmostafa می گوید

    سلام ارش جان
    من رفتم به سايتي كه گفتي ولي نميشه ثبت نام رد براچي؟
    و چطور ميشه رنگ ابي رو عوش كرد؟

    1. آرش حیدری می گوید

      سلام
      دوست عزیز قطعا قسمت ثبت نام داره ، در واقع همون اکانت وردپرس شما میشه
      برای تغییر رنگ باید کد رنگ مورد نظر در قسمت شیوه نامه وارد کنید

      1. djmostafa می گوید

        درود
        قسمت ثبت نام داره يه جايي هست اون بالا سمت رست ولي روش كليك ميكنم يه صفحه ي ديگه باز ميشه يكم طول ميكشه بعدهم ارور ميده
        درباره رنگ هم ميدونم بايد رنگ رو بذارم تو استايل ولي منظورم اين بود كجاي استايل كدو قسمت مربوط به رنگه

      2. آرش حیدری می گوید

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

  19. تارخ می گوید

    سلام داداش آرش
    تشكر بابت زحماتت
    لطفا بگو عكسشو چجوريعوش كنم چون من وارد نيستم
    با تشكر

    1. آرش حیدری می گوید

      سلام
      داخل سایت gravatar ثبت نام کنید و برای ایمیل خودتون تصویر پروفایل انتحاب کنید ، این میشه تصویر شما !

  20. djmostafa می گوید

    سلام چه طور ميتونم درباره نوسنده رو ببرم پايين الان بالا است جلوي كلمات كليدي نوشته ها

    1. آرش حیدری می گوید

      سلام
      دوست عزیز داخل فایل single.php محل کدها رو به مکان مورد نظر تغییر بدید !
      متن درباره نویسنده هم خوندم ! یکم شبیه سایت ما نیست ؟!؟!؟!
      سپاس

  21. djmostafa می گوید

    سلام خسته نباشيد من قسمت تغيير اواتار رو متوجه نشدم
    يعني ميشه ادرس عكي بچاش بذاري

    1. آرش حیدری می گوید

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

  22. حامد می گوید

    سلام آرش خان
    میشه لطفا راهنمایی کنید از کجای کد باید ارتفاع و طول جعبه رو تنظیم کنم ؟ ظاهرا طول جعبه اتوماتیک هستش
    و چطور میتونم گوشه های پایین جعبه رو به شکل خم شده در بیارم مثله گوشه های بالا ؟

    1. آرش حیدری می گوید

      سلام ، باید شیوه نامه ها رو ویرایش کنید تا گوشه هایش گرد شه ، از شیوه نامه همون قسمت بالا استفاده کنید ، البته یکم کاره سختیه.
      بله ارتفاعش با توجه به متن شما تغییر می کنه.

      1. حامد می گوید

        آرش خان ارتفاعش رو میدونم سوالم این بود که طول افقی جعبه رو چطور میتونم دستی وارد کنم ؟

      2. آرش حیدری می گوید

        هیچ عرضی فکر نکنم داخل شیوه نامه براش تعریف شده باشه ، بنابراین عرض برمیگرده به قالب خودتون ، اینجوری بهترم هست کد برای هر سایت و قالبی قابل استفاده هستش.

      3. حامد می گوید

        حالا چطوری خودم میتونم براش عرض تعریف کنم ؟

      4. آرش حیدری می گوید

        امتحان نکردم ولی خوب شیوهنامه رو ویرایش کنید ، width:.. px; رو امتحان کنید !

  23. hamed می گوید

    ممنون عالی بود

  24. محمدرضا می گوید

    مرسی خوب بود

  25. محمد می گوید

    ممنون دوست عزیز حرف نداشت
    راستی چطوری می تونم قبل از اسم نویسنده بنویسم “نویسنده:”
    ممنون

    1. آرش حیدری می گوید

      سلام
      قبل از کد به فارسی بنویسید ” نویسنده : “

  26. مهدی می گوید

    سلام
    من هم کد و هم سی اس اس رو گذاشتم و توضیحات و عکس نویسنده اومد ولی بدون هیچ استایلی!
    یعنی هیچ کادری دورش نداشت.

    1. مهدی می گوید

      درست شد!

  27. پيروز می گوید

    سلام
    با تشكر از مطلب مفيدتون
    اگر ممكنه يه كد به من بگيد كه بتونم از طريق اون
    1. فهرست 10 نويسنده‌اي كه اخيراً توي سايت مطلب نوشته‌اند را استخراج كنم
    2. تصوير نويسنده را نمايش بدهم (اگه تصوير رو از توي يك پوشه از داخل هاست بخونه خيلي بهتره. مثلاً نام تصوير با نام نويسنده يا آي.دي اون يكي باشه)
    3. عنوان 3 يا 4 تا از آخرين پست‌هاشون رو كنار عكس نمايش بدهم.
    مي‌خواهم هر نويسنده يك باكس باشه و مجموع اين باكس‌ها را توي قسمتي از صفحه ايندكس قبل شروع لوپ درج كنم.
    من احتياج به كدهاي پي اچ پي دارم. تأكيد زيادي روي سي.اس.اس لازم نيست.
    قبلاً از كمكي كه به من مي‌كنيد تشكر مي‌كنم.
    موفق باشيد.

  28. amir می گوید

    ایول سایت خوبتون مرسی از مطالبتون

  29. باشگاه عکس می گوید

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

  30. باشگاه عکس می گوید

    شرمنده من تازه واردم به وردپرس زیاد وارد نیستم.
    فونتی که دادید چطور و کجای استایل اضافه کنم؟

    1. آرش حیدری می گوید

      سایتتونو دیدم ، خوب الان درسته دیگه فونتش مثله ماله منه فقط فاصله خطوط با من فرق داره که باید مقدار
      line-height:22px;
      را اضافه کنی به قسمت مورد نظر ،
      ساده تر نمیتونم بگم چون این css هستش اصلا ربطی به وردپرس نداره باید یه کم اطلاعات داشته باشین !!
      موفق باشی دوست عزیز ، مرسی سر زدی باز اگه سوالی بود در خدمتیم

  31. باشگاه عکس می گوید

    راستی گراواتار از کجا فعال کنم؟فقط توی سایتش ثبت نام کنم حله؟

    1. آرش حیدری می گوید

      بله توی همون سایت ایمیل خودتون رو ثبت کنید و برای خودتون عکس آپلود کنید !

  32. باشگاه عکس می گوید

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

    1. آرش حیدری می گوید

      سلام
      نوع فونت مربوط میشه به شیوه نامه قالب شما ولی میتونید خودتون مقدار
      font-fce:Tahoma;
      را اضافه کنید.

  33. حسین می گوید

    سپاس. کارت درسته داداش.

  34. شهاب ضیائی می گوید

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

    1. آرش حیدری می گوید

      شما اول استایل را به شیوه نامه خود اضافه می کنید بعدش هرجای قالب که دوست داشتید اون کده مربوط به نمایش جعبه رو قرار میدید !
      همین دوتا کار بعلاوه نوشتن خلاصه ای از خودتون در قسمت گفته شده در بالا !
      باز اگر مشکلی بود دقیق تر بگید بررسی کنیم

      1. شهاب ضیائی می گوید

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

      2. آرش حیدری می گوید

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

  35. مصطفائی فر می گوید

    درود بر شما. توضیح بفرمایید نوشته های داخل کادر را چگونه وسط چین کنیم؟

    1. آرش حیدری می گوید

      اگر وب سایتتون تک نویسنده هستش توصیه می کنم بجای نوشتن دربازه نویسنده در قسمت بیوگرافی تنظیمات وردپرس اون متن را بجای کد php قرار بدید.دیگه اینطوری دستتون باز میشه و می تونید از html کمک بگیرید.
      اگر نه با نوشتن شیوه نامه میشه انجام داد.

      1. مصطفائی فر می گوید

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

      2. مصطفائی فر می گوید

        جناب حیدری نازنین درود برشما. بنده متوجه فرمایش شما شدم و متن داخل کادر را درست کردم . به پاس محبت شما بابت معرفی این کد بسیار خوب و کاربردی ، سایت شما را با افتخار لینک کردیم .
        سپاس از مهرتان

      3. آرش حیدری می گوید

        خواهش می کنم خوشحالم مشکل حل شد
        موفق باشید و سپاس بابت لینک

  36. وهاب سید چورته می گوید

    خیلی زیباست آرش جان
    خیلی خوشم اومد
    منم میتونم ازش استفاده کنم ؟ :x
    راستی شیوه نامه با نام style.css هست . ی غلط املایی تو نوشتن استایل داشتی اونو درست کن تا دوستان ی وقت اشتباه نیافتند
    خیلی ممنون از طرحت زیبات
    واقعا عالی بود
    دمت گرم

    1. آرش حیدری می گوید

      مرسی یادآوری کردی الان درستش می کنم.
      قابله تورو نداره وهاب جان همه سایت برای خودته اصلا !!!

ارسال یک پاسخ

آدرس ایمیل شما منتشر نخواهد شد.