آموزش بوت استرپ [گام 6] DropDown

دوره بوت استرپ ژوئن 2015 03

ششمین قسمت از آموزش بوت استرپ را تقدیمتان میکنم. در این آموزش نحوه ایجاد منوی dropdown را بهتون آموزش دادم. ویدیو این قسمت را میتوانید زا باکس زیر دانلود کنید :

دانلود فیلم آموزشی
لینک دانلود20 مگابایت11 دقیقه

سورس زیر نمونه کدی است که در این ویدیو توضیح داده شده :

 

و انشالله در قسمت ۸ این دوره اولین قالب بوت استرپی را بصورت پروژه کار خواهیم کرد.

دیدگاه ها
  • ehsan12 گفت:

    سلام آقای برنامه نویس …
    واقعا ممنون از آموزش های خوبتون …
    بی صبرانه منتظر ویدیو های سی پلاس پلاس هستم
    در ضمن با دیدن این ئوره ی بوت استرپت منم به فکر پیاده سازی قالب با بوت استرپ افتادم :دی که کردم
    monister.ir
    پ . ن : بعضی از افراد به همه چی میگن ساده آخرشم نفهمیدم پیجیده ی اینا چیه 😐

    • حسین شفیعیان گفت:

      سلام و تشکر
      بله چشم حتما آموزش ها ادامه خواهد داشت
      قالب جالبی شده تبریک میگم
      😀

  • سیدرضا سیدموسوی گفت:

    سلام حسين جان
    بابت اموزشا ممنون

  • mehran گفت:

    مرسی حسین جان.. من یه مشکلی با بوت استرپ دارم که چطوری میشه استایل دلخواه داد به قالب..میدونم با کلاس میشه استایل داد…اما مثلا وقتی بخوام یه قالب PSD رو به HTML با بوت استرپ تبدیل کنم یه کم سخت میشه. کلا کار با بوت استرپ یه کم مشکله…به نظر من بهتره ریسپانسیو کردن با Media query های css رو اموزش بدین.
    مرسی مهندس

    • حسین شفیعیان گفت:

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

      • mehran گفت:

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

  • amirreza0011 گفت:

    باسلام خدمت شما دوست گرامی
    میشه ازشما بپرسم شما به چه زبان هایی وارد هستید واین اطلاعات خودتون رو چطوری بدست اوردید

    • حسین شفیعیان گفت:

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

  • ali_nilofar گفت:

    خسته نباشی حسین جان،ممنون برا آموزشات

  • amirreza0011 گفت:

    میشه چندتا کتاب و سایت برای اموزش زبان های C++ و PHP و VB و C# معرفی کنی زبانش فرق نمیکنه اما اگه فارسی باشه خیلی خوب میشه

  • danger1875 گفت:

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

  • ali_nilofar گفت:

    برا من dropdown ایجاد نمیشه؟؟؟؟ :((

  • simin گفت:

    سلام و تشکر ویژه از آقای شفیعیان بابت آموزششون
    لطفا قالبی که آموزش می دین و طراحی می کنین یه مقدار کامل باشه و فقط صرف گذاشتن 4 عدد col-lg نباشه .
    بازم ممنون

    • حسین شفیعیان گفت:

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

  • ssss گفت:

    ممنون از اموزشهای خوبتون

  • hamed_z2001 گفت:

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

    • حسین شفیعیان گفت:

      سلام و تشکر
      ورژن جدید انجمن با سیستم IPB بالا آوردم , لطفا در اونجا مطرح کنید : forum.mrprogrammer.net

  • JAMASB گفت:

    دست شما درد نکنه
    منتظر قسمت بعدی هستیم…..

    • حسین شفیعیان گفت:

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

  • hasan.r گفت:

    سلام حسین جان ممنون از سایت خوبت

    یه سوال داشتم با چه افزونه هایی میتونم که واسه سایت یه پنل کاربری و خبر نامه داشته باشم مثله سایته شما.

  • hasan.r گفت:

    یعنی داخله قالب های اماده می تونم ,بدون این که از برنامه نویسی استفاده نکنم این پنل ها رو داشته باشم
    اگه اسمه این افزونه ها رو بگید ممنون میشم

  • hasan.r گفت:

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

    • حسین شفیعیان گفت:

      منظورتون از افزونه چی هست؟
      لطفا سوالات و مشکلات خود را در انجمن مطرح کنید : forum.mrprogrammer.net

  • hasan.r گفت:

    سلام بازم سوال دارم
    چه طور میتونم سایتم وقتی داخله گوگل سرچ شدچند مطلبم زیرش بیاد
    مثله سایته شما که وقتی سرچش میکنیم چندتا مطلبم زیرش میاد

  • hesamred گفت:

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

    • حسین شفیعیان گفت:

      سلام و تشکر
      فکر میکنم حدودا 15 جلسه ای بشه و تا دو ماه آینده تموم میشه

  • hasan.r گفت:

    ممنون از پاسختون

    • حسین شفیعیان گفت:

      دوست گرامی قبلا هم خدمت شما عرض کردم ، سوالات و مشکلاتتون را در انجمن مطرح کنید : http://forum.mrprogrammer.net

  • hamed_z2001 گفت:

    به سلامتی که امتحانات تموم شد …
    منتظر قسمتهای بعدی بوت استرپ هستیممممم مهندس … بی صبرانه

    • حسین شفیعیان گفت:

      مرسی تشکر
      یه برنامه هایی دارم برای تابستون اگر اوکی هر روز حداقل یک ویدیوی آموزشی منتشر خواهد شد 😉

      • hamed_z2001 گفت:

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

      • simin گفت:

        عااالیه

  • danger1875 گفت:

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

    • حسین شفیعیان گفت:

      سلام
      مرسی از شما ، از چند روز آینده روند منتشر شدن آموزش ها شروع میشه 😉

  • lakers گفت:

    با سلام
    لطف کنید یک اموزش به صورت کاربردی مثل قالب خودتان درست کنید!! دارای هدر گرافیکی و منو و ساب منو باشه و همچنین مثل قالب خودتان 3 تا ستون داشته باشه !!! سایدبار چپ و راست و متن و…
    سپاس

  • danger1875 گفت:

    سلامی دوباره …
    اگه اشتباه نکنم امروز تولد بود 🙂
    طبق چیزی که تو وبلاگت نوشتی اگه هست تولدت مبارک

  • behr0z گفت:

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

  • kamal گفت:

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

  • mohamad_sdg گفت:

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

    • حسین شفیعیان گفت:

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

      • hamed_z2001 گفت:

        سلام مهندس. میشه تاریخش رو بگید؟؟
        آخه نمیدونم این نظر مال چه تاریخی بود و جواب دادید و نمیدونم همین هفته ای که توشیم منظورتونه یا هفته آینده؟؟

        • حسین شفیعیان گفت:

          سلام
          انشالله تو همین چند روزه آموزش ها ادامه پیدا خواهد کرد

          • hamed_z2001 گفت:

            خیلی خیلی منتظریم استاد، ایشاله هر چی زودتر شروع کنید مهندس!!

  • JAMASB گفت:

    مهندس منتظر قسمت بعدی هستیم!!! لطفا یه کم زودتر!!

  • danger1875 گفت:

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

  • hamed_z2001 گفت:

    حسین جان قسمت بعد رو کی میذاری دادا؟؟ چشممون به سایتت خشکید از بس هی سر زدیم و منتظر قسمت بعدی موندیم!!

    • حسین شفیعیان گفت:

      قسمت بعدی 100 % هفته آینده ضبط و منتشر میشه و دوره بوت استرپ حدودا تا 50 روز آینده به پایان میرسه 😉

  • danger1875 گفت:

    حسین جان هرچی دیر تر آموزش بعدی رو بزاری واسه سئو سایتت بهتره آخه من و بقیه کاربر های سایت روزی چند بار میایم سر میزنیم ببینیم آموزش جدید گذاشتی یا نه 🙂

  • smrh گفت:

    سلام
    گل پسر چرا آموزشاتو ادامه نمیدی …
    منتظریم …

    • حسین شفیعیان گفت:

      سلام
      گل پسر رو با من بودین ؟ 🙂
      جلسه بعدی رو فردا شب ضبط و منتشر میکنم

      • smrh گفت:

        بله با شما بودم…
        تشکر از زحماتت، انشاالله بقیه دوره ها رو هم زودتر ادامه بدین
        همیشه شاد و سربلند باشید

  • fateme.vaziri گفت:

    سلام.خیلی ممنون از فایلهای اموزشی.خیلی کمک کرد.فقط فایلهای 1و4 دانلود نشد مشکل چیه؟؟؟؟!!!

  • امیر گفت:

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

    • حسین شفیعیان گفت:

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

  • Mohammad گفت:

    سلام ، اگه آموزش ساخت سایت نظر سنجی هم میذاشتید خوب بود !

    • حسین شفیعیان گفت:

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

  • فهیم گفت:

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

  • سینا گفت:

    سلام مهندس
    من همه فیلم همه بخش های بوت استرپ رو دانلود کردم اما قسمت 6 -7 رو که دانلود کردم خرابه، فایلو که استرک میکنم پیغام خطا میده

    • حسین شفیعیان گفت:

      سلام
      دوستان دانلود و استفاده کردند مشکلی نبوده !
      از برنامه 7zip برای اکسترکت استفاده کنید
      بازم یه برسی میکنم اگه مشکلی بود مجددا آپلود میکنم

    • حسین شفیعیان گفت:

      قسمت های 6 و 7 و 8 مجددا با پسوند zip آپلود شد ، متوانید بدون مشکل استفاده کنید…

  • فهیم گفت:

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

  • فهیم گفت:

    ممنون لطف میکنید

    • حسین شفیعیان گفت:

      قسمت های 6 و 7 و 8 مجددا با پسوند zip آپلود شد ، متوانید بدون مشکل استفاده کنید…

  • فهیم گفت:

    با سلام و خسته نباشید
    جناب شفیعیان من وقتی از attributeها استفاده میکنم رنگ اونها به شکل آبی در نمیاد و فعال نیستن و مورد مد نظر رو هم انجام نمیدن،به نظرتون مشکل از کجاست؟

  • پیمان گفت:

    سلام
    در قسمت نظرات همین جایی که شما پاسخ می دهید اگه بتونید مثل خیلی از سایت ها مشخص باشه شما پاسخ چه کسی رو دادید خیلی بهتره
    چون الان مشخص نیست شما دارید جواب کی رو می دهید و یه کم گمه
    ممنون

  • Mohammad reza گفت:

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

  • میلاد گفت:

    با سلام و خسته نباشید
    سایت خیلی خوب و کاربردی دارین…
    اگه امکانش هست ، منوی dropdown رو به جای buttun از ul و li استفاده کنید و آموزشش رو بزارید

    • حسین شفیعیان گفت:

      سلام ، مرسی
      همین اتریبیوت هایی که به دکمه دادیم را باید به li بدید ، اگه مشکلی بود در انجمن مطرح کنید

  • اقایی گفت:

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

  • امیر رضایی گفت:

    اول ممنون از آموزش هاتون
    یه سوالی که در رابطه با منوهای بوت استرپ داشتم اینه که چطوری میشه تو منو ها به جای کلیک برای باز شدن زیر منو ها اینکار به صورت خودکار با رفتن موس روی اون انجام بشه

  • علی گفت:

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

  • محمد رعنایی گفت:

    ممنون بابت آموزش های کاربردیتون
    هیچ جا آموزشی با این کیفیت پبدا نکردم
    لطفا ادامه بدید