مطالب مرتبط در وردپرس بدون افزونه

daskhatmin فواد طهماسبی
6,688 بازدید
مطالب مرتبط در وردپرس بدون افزونه

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

این کار تجربه شیرینی از سایت شما را در ذهن کاربر به جای میگذارد. در وبسایتهای وردپرسی این کار به آسانی توسط افزونه های موجود قابل اجراست و نیازی به دانش کد نویسی ندارد. ولی در مواردی کاربران وردپرس ترجیه میدهند که بنا به دلایلی (مثلا تمام امکانات افزونه را نیاز ندارند و نمیخواهند بار اضافی پردازش کل افزونه بر روی وبسایت آنها باشد.) از افزونه استفاده نکنند و خودشان کد نویسی کنند.

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

توجه کنید که کپی کردن کد بالا در پوسته وردپرس شما، شاید نتیجه مطلوب را نداشته باشد (از لحاظ ظاهری) تگهای Html  بکار رفته در کد بالا مخصوص ویجت های پوسته سایت ما هست و شما باید آنها را طبق نیاز خودتون تغییر بدید. در هر جای کد که احساس شده نیاز به راهنمایی هست لینک به مرجع همراه با راهنمایی ارائه شده است.

در کد بالا علاوه بر لینک و عنوان مطلب مرتبط تصویر شاخص (همان تصویر نوشته) نیز نمایش داده میشود. میتوانید نمونه کاربردی کد بالا را در وبسایت خودمان در قسمت سایدبار مشاهده کنید:

http://daskhat.ir/118/security-tips-php-third

daskhatmin

فواد طهماسبی

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

18 دیدگاه برای “مطالب مرتبط در وردپرس بدون افزونه”

  1. hassan گفت:

    سلام
    ۲ تا سوال دارم
    افزونه top author که معرفی کردین نصب کردم اما نمی دونم چطوری باید از اون استفاده کنم!!!(کمک)
    بعد این مطالب مرتبط اصلا تصویر نشون نمیده!!!!!!

  2. روزبه گفت:

    اینم کدش :

    1. فؤاد طهماسبی گفت:

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

  3. روزبه گفت:

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

  4. ليلا گفت:

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

  5. ليلا گفت:

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

    1. فؤاد طهماسبی گفت:

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

  6. رضا گفت:

    سلام اقای فواد
    بابت مطالب اموزشی و مفیدتون تشکر میکنم ،
    ٢تا سوال دارم از خدمتتون
    ١- جایی ، فایلی ، چیزی هست بشه فهمید هر کدوم از class های bootstrap برای چی هست ؟ شما از چه فریم ورکی استفاده میکنید؟
    ٢- چجوری میشه در هدر سایت یک عکس گذاشت ، و روی عکس سوشیال ایکون و منو قرار داد ؟
    از زحمان فراوان با ارزش شما سپاسگزارم

    1. فؤاد طهماسبی گفت:

      سلام، خواهش میکنم
      جواب ۱: http://getbootstrap.com/components و http://getbootstrap.com/customize که اینجا هم توضیح کامپوننتها هست و هم سفارشی سازی bootstrap که هر کامپوننتی میخواهید اونو بردارید (فک کنم کنظورتون این بود) اگر منظورتون از اینکه من چه فریم ورکی رو استفاده میکنم، برای این سایت هست، من این پوسته رو از Html به وردپرس تبدیل کردن و نویسنده اصلیش من نیستم ولی این پوسته هم فریم ورک bootstrap رو استفاده میکنه. و اگر هم منظورتون کلا در پروژه هام هست، من به شخصه استفاده از فریم ورک رو دوست ندارم و همیشه سعی ام این هست که مثل فریم ورکها اصولی خودم کار کنم. (اینطوری مطالب بیشتری هم یاد میگیرم 🙂 ) ولی در کل من هم فریم ورک bootstrap رو توصیه میکنم.

      جواب ۲: در Html:

      و کد css:

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

  7. امید گفت:

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

    1. فؤاد طهماسبی گفت:

      امید جان، من الان یک تاپیک زدم برای سوال شما.یکی یکی راه حل هایی رو که به نظرم میرسه رو براتون مینویسم. (شما هم چون عجله داری اینطوری زیاد منتظر نمیمونی 🙂 )
      دسته بندیهای مختلف در صفحات مختلف

  8. امید گفت:

    سلام
    سایتتون خیلی مفید بوده ، لااقل برای من خیلی مفید بوده و هست
    سوالی از خدمت شما داشتم
    سایت من در پیرامون ۲ موضوع هست ۱- مباحث درسی ۲-مباحث کمک درسی
    هر چند روز یک بار چند پست مربوط با هر کدوم از این مطالب میزارم و مسلما پست های جفت مطالب باهم در یک صفحه هستند.
    سوالی که از شما بزرگوار دارم این هست که ، میشه کاری کرد که پست هر مطلب به طور مجزا باشه ؟
    یعنی پستهای مطلب A در یک صفحه و پستها ی مطلب B در یک صفحه مجزا ؟
    اگر بتونید کمکم کنید ممنون میشم
    با حق

    1. فؤاد طهماسبی گفت:

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

  9. حمید گفت:

    سلام
    یه سوشیال آیکون با تگ a گذاشتم توی صفحه ، وبا margin جاشو درست کردم
    اما تو IE چاشو درست نشون نمیده
    یا اگه جاشو نسبت با IE درست کنم توی chrome یا Mozila یه جا دیگه نشون میده
    راه حلی پیشنهاد دارید ؟ ممنون میشم

    1. فؤاد طهماسبی گفت:

      سلام،
      ای کاش سوالاتی که مربوط به مطلب نیست رو در انجمن مطرح کنید. 🙂
      مساله عادی هست این. دلیلش هم پشتیبانی ضعیف IE های نسخه های قبل از CSS هست.
      قبل از اینه که css هاتون رو بنویسید باید تمام المنت ها رو ریست کنید.
      این کار قبلا توسط برنامه نویسان ماهر و خبره به صورت پروژه انجام شده و شما میتونید استفاده کنید.
      یعنی این فایل css رو قبل از کدهاتون لود کنید.

      بهترین css reset که من همیشه ازش استفاده میکنم Normalize هست که توصیه میکنم شما هم استفاده کنید.
      http://necolas.github.io/normalize.css/

  10. امین گفت:

    داداش من قالبو دارم فارسی شازیشو تموم میکنم فقط یه وشکل دارم میشه فایل sidebar.php قالب رو بدی؟بلد نیستم بسازم آموزشی هم که گذاشته بودی جواب نداد!

    اگه میشه sidebar.php رو میل کن

  11. امین گفت:

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

    1. فؤاد طهماسبی گفت:

      براتون ایمیل زدم.

کد HTMLCSSJavaScriptPHP