• illustrator Curse
  • 7Learn Android Course
  • 7Learn SEO Course
  • 7Learn WP Theme Course

    حرفه ای ترین دوره آموزش طراحی قالب وردپرس



  آیا می دانید دوره های آموزشی سون لرن از جامع ترین و کاربردی ترین آموزش های موجود در سطح وب فارسی است!

آموزش پیاده سازی اسلاید شو با PHP و MYSQL

22019 ۱ شهریور ۹۲

دوستان سلام،توی انجمن های سایت بعضی از دوستان درخواست داده بودن که آموزش نحوه استفاده از اسلاید شو رو توی سایت به صورت داینامیک قرار بدیم،توی این آموزش قراره ما این اسلاید شو زیبا و معروف رو توی PHP و MYSQL پیاده سازی کنیم.پس با ما همراه باشید.

اول از همه باید بگم برای ارتباط با دیتابیس و عملیات واکشی و ذخیره اطلاعات،یه کلاس نوشتیم که توی پوشه config پروژه موجوده،خوب برای شروع یه جدول توی دیتابیس ایجاد میکنیم (این جدول همون جدول اخبار یا مطالبه که استفاده می کنیم).

ایجاد جدول

برای ساختن جدول می تونید از این کد SQL استفاده کنیم.

خوب ما اینجا ستون id برای ایندکس کردن جدول،title عنوان مطلب،sm برای خلاصه مطلب،body برای متن مطلب،slider برای اینکه مشخص کنیم این مطلب باید توی اسلایدشو نشون داده بشه یا نه،img برای ذخیره آدرس تصویر برای نمایش توی اسلاید شو.

ایجاد صفحه ارسال مطلب

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

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

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

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

یه نکته  اینکه اینجا زیاد بحث امنیتی رو لحاظ نکردیم چون این صفحه در اختیار مدیر یا نویسنده سایت هست،حالا اگه شما خواستین خودتون قسمت امنیتی رو اضافه کنید،اول از همه فایل کار با دیتابیس رو اضافه کردیم،بعدش چک کردیم که فرم ارسال شده یا نه و بعدش هم چک کردیم که مقادیر عنوان و خلاصه و متن اصلی مطلب ست شده باشه و اونارو توی یه سری متغییر ریختیم،یه متغییر هم ایجاد کردیم به اسم is_slider که باهاش چک میکنیم که کاربر اون چک باکس رو انتخاب کرده یا نه و براش مقدار پیش فرض 0 رو قرار دادیم،بعدش چک می کنیم که کاربر چک باکس رو انتخاب کرده و عنصر فایل هم مقداری گرفته باشه،اگه اینطوری باشه یه سری مقادیر دیگه ست می کنیم،is_slider اینجا ست شده با مقدار 1 یعنی این مطلب به صورت اسلایدره،متغییر prename برای ایجاد یک عدد تصادفی که قبل از اسم فایل برای ذخیره به صورت منحصر به فرد و جلوگیری از ایجاد فایل های هم نام ایجاد می کنیم،filename رو برای دریافت نام فایل ارسالی و tmp_name برای دریافت نام موقت فایل ارسالی،برای ذخیره فایل ها هم یه مسیر مشخص میکنیم که تصاویر اسلایدر رو اونجا ذخیره میکنیم،خوب با استفاده از متغییر های قبلی متغییر path رو ایجاد میکنیم و بعدشم فایل رو به مسیر ایجاد شده منتقل کردیم.

خوب حال چک میکنیم که مقادیر ارسال شده خالی نباشن (فضای خالی نداشته باشن) و بعدش یه کوئری ایجاد کردیم و مقادیر رو توی دیتابیس ذخیره کردیم و اگه موفق ثبت شد یه پیغام که میگه مطلب با موفقیت ثبت گردید نشون داده میشه(برای دیتابیس ما از متد connect برای اتصال  و query برای پردازش کوئری و disconnect برای قطع ارتباط استفاده کردیم،این متد ها توی فایل database موجوده).

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

صفحه نمایش اسلاید شو

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

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

فایل database رو الصاق کردیم و با متغییر count تعداد اسلایدی که باید نشون داده بشه رو مشخص کردیم،خوب کوئری خودمون رو می نویسیم  و تعداد 4 مطلب آخری  که مقدار فیلد slider اونها یک (true) هست رو واکشی میکنیم و توی result قرار میدیم.

خوب حالا کد های HTML لازم رو می نویسیم.

اون قسمت تگ a که یه تگ img داخلشه ،کد تکراری ما هست که توی حلقه گذاشتیم و تا زمانی که result، مقدار داشته باشه اونو تکرار می کنیم و در هر بار اجرا مقادیر لازم هر سطر  رو توی این قسمت قرار میدیم (آدرس تصویر و مقدار title مطلب).

نکته : برای تنظیم اندازه دلخواه اسلایدر، داخل فایل style.css کلاس slider-wrapper ،خاصیت width اش رو به اندازه دلخواه تنظیم کنید.سعی کنید تصاویر رو همه به یک اندازه برای اسلایدشو آپلود کنید

خوب اینم از این اسلایدر داینامیک ما.توی مطلب بعدی این اسلایدر رو توی ASP.NET پیاده سازی می کنیم.

دانلود فایل های پروژه برای PHP

:: مطالب جدید سون لرن را از طریق ایمیل دریافت کنید :

دیدگاه ها 45 دیدگاه برای این مطلب ارسال شده است. نظردهی برای این مطلب بسته شده است .

  • ‏‏

    ممنون عالی بود بازم از این کارا بکن.

  • ‏‏

    سلام
    دوستان میشه راهنمایم کنید؟؟
    میخوام وقتی کاربر روش کلیک میکنه بره تو صفحه ایی دیگه تا بتونه مطلب این عکس رو بخونه
    یه راهنمایی میکنید؟؟
    ممون میشم 😳

    • ‏‏
      کیوان علی محمدی(۲ شهریور ۱۳۹۳)

      سلام در خاصیت href تگ های a شما لینک مطلب رو قرار بده و این بستگی به آدرس نمایش مطالب در سایتتون داره.

  • ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

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

    ورود به سایت

    ورود سریع با :
    در حال اتصال ...

    جستجو در سون لرن

    عبارت :
    7LearnTelegram