بهترین فرصت برای یادگیری در قسمت Vip سئو نود هم اکنون برای دانشجوبان عزیز فراهم شده است
جزئیات بیشتربر روی خودت سرمایه گذاری کن
در این پکیج آموزشی به شکلی سازمان دهی شده ، بوت استرپ را از ریشه یاد خواهید گرفت و از سمت بوت استرپ 3 به سوی بوت استرپ 5 در قالب آموزش و همچنین طراحی قالب هایی جذاب و واکنشگرا بر اساس بوت استرپ های نسخه 5 ، 4 و 3 پیش خواهید رفت تا یکبار برای همیشه تسلط 100% در این فریمورک را بدست آورید .
دوستان عزیز در مجموعه سئو 90 ، به یکی دیگر از پکیج های فوق العاده مجموعه ما خیلی خوش آمدید و خوشحالیم که تصمیم گرفتید تا مهارت های خودتان را در زمینه یادگیری بوت استرپ یکبار برای همیشه تضمین کنید . مجموعه ما در این دوره یک سیستم منظم برای شما تنظیم نموده که طی آن شما اول با ریشه بوت استرپ آشنا شده و سپس گام به گام به سمت یادگیری نسخه های پیشرفته تر و بهبود یافته تر بوت استرپ پیش خواهید رفت. در این دوره آموزشی در ابتدا از بوت استرپ 3 شروع خواهیم کرد دلیل هم این است که بوت استرپ تا نسخه 2 زیاد جالب نبود و در این دوره نیز اصلا بر روی آن بحث نخواهیم کرد چرا که در حال حاضر اصلا کاربردی نیست ، اما از نسخه 3 یک تحول بزرگ در بوت استرپ ایجاد شد و میتوان گفت بوت استرپ 2 کلا کنار رفت و همه طراحان به سمت استفاده از بوت استرپ 3 رفتند .
شاید در این بین سوال باشد که اگر در حال حاضر نسخه های بهبود یافته تری همچون بوت استرپ 5 وجود دارد ، پس عملا بوت استرپ 3 نیز کنار رفته و نباید آن را یاد گرفته و بر روی آن زمان گذاشت . اما حقیقت این است که بوت استرپ های نسخه 4 و 5 به نوعی ریشه توسعه یافته از نسخه 3 است و اگر شما مفاهیم بوت استرپ 3 را بخوبی فرا بگیرید سرعت شما در یادگیری بوت استرپ 4 و 5 بسیار بالاتر خواهد رفت که جلسات آموزشی دوره نیز گواه بر این مطلب است .
برای شروع این دوره میتوانید از بالای صفحه وارد بخش دوره های پیشنیاز شده و پس از کسب تسلط مناسب در آموزش های مورد نیاز در دوره بوت استرپ به راحتی شرکت کنید .
تمامی دانشجویانی که به مباحث طراحی در زبان css مسلط شدند میتوانند به راحتی در دوره بوت استرپ شرکت نموده و نهایت مهارت را در زمینه طراحی قالب های واکنشگرا کسب نمایند .
تمامی سرفصل های هر سه نسخه بوت استرپ 3 و 4 و 5 در این دوره پوشش داده شده و به جرات میتوان گفت یکی از کامل ترین دوره های آموزشی در سطح وب می باشد .
پس میتوان گفت این ظهور بوت استرپ 3 نه تنها باعث تحول در دنیای طراحی قالب و رسپانسیو سازی شد ، بلکه چون یک ساختار منظم و کاربر پسند داشت ، یک پشتوانه برای بوت استرپ شد تا بتوان بوت استرپ نسخه 4 و حتی 5 را بر اساس ریشه نسخه بوت استرپ 3 توسعه داد . به همین دلیل برای ورود به دنیای بوت استرپ ، اول از هرچیزی بهتر است بوت استرپ 3 را عمیقا و کامل یاد گرفت . پس اول این نسخه از بوت استرپ را از وب سایت رسمی Bootstrap بررسی خواهیم کرد و شما به مرور به این وب سایت و نحوه درک دستورات شناخت کافی خواهید داشت .
ما قصد نداریم تا قدم به قدم تمامی منو های سایت بوت استرپ را بررسی کنیم . هدف ما همیشه این بوده که شما با یادگرفتن اصلی ترین موارد خیلی سربع تر به هدف مد نظر برسید پس اگر بخشی در این بین وجود داشت که در طراحی قالب به آن نیازی نبود ، از آن بخش عبور کرده و به سراغ موارد عملی و مهم تر خواهیم رفت .
البته که ضمن ارائه آموزش های بوت استرپ به هیچ عنوان بخشی نخواهد بود که دانشجویان آن را آموزش ندیده و بعدا در ذهن آنها علامت سوال باشد . پس تماما با تمرکز کافی بر روی المان های بوت استرپ در هر نسخه پیش خواهیم رفت . اما در این بین ارزش قایل شدن به وقت شما با توجه به تجربه کار بر روی پروژه ها و حاصل شدن نتایج عملی جهت تشویق دانشجویان مد نظر است . در زیر میتوانید بخشی از نمای پروژه های طراحی شده در این دوره را مشاهده کنید .
پس زمانی که وارد سایت بوت استرپ شدیم قصد داریم تا بخش های بسیار کاربردی بوت استرپ را در کنار هم در نمونه مثال های عملی بررسی نموده و خط به خط بخش های مهم را به دانشجویان توضیح دهیم تا یکبار برای همیشه با خیال راحت بتوانید بوت استرپ را به شکلی یاد بگیرید که خودتان در نسخه های بعدی بسیار راحت تفاوت ها را شناخته و با نسخه جدید کار کنید و نیاز به آموزش های دیگر نداشته باشید . در حقیقت همان موضوع آموزش ماهیگیری بجای فروختن ماهی است . پکیج آموزش بوت استرپ 5 ، 4 ، 3 ، از سه فصل اصلی تشکیل شده که در ادامه به توضیح این 3 فصل خواهیم پرداخت . دقت داشته باشید که برای توضیحات بیشتر وارد بخش تکمیل در بالا شوید .
در فصل اول از این آموزش که در قالب 26 جلسه ارائه شده ( که ممکن است بعدا نیز آپدیت شود ) ، اول به سراغ سایت رسمی بوت استرپ 3 رفته و همانطور که اشاره شد المان های مهم را جز به جز تا قسمت 9 با هم بررسی خواهیم کرد . به این ترتیب از قسمت 1 تا قسمت 8 ، در قالب مثال های عملی و همچنین آموزش نکات بسیار مهم و اساسی بوت استرپ با هم آموزش خواهیم دید . از قسمت 9 تا قسمت 26 در فصل اول ، به سراغ پروژه عملی خواهیم رفت . در این پروژه عملی یک وب سایت رستوران را به شکلی بسیار شیک و البته کامل با هم پیاده سازی خواهیم کرد . صفحه اصلی این قالب را میتوانید در تصویر زیر و تصاویری که در ادامه خدمتتان ارائه شده است مشاهده نمائید .
این وب سایت رستوران یک قالب فوق العاده شیک دارد و سعی کردیم تا در داخل این قالب علاوه بر صفحه اصلی ، صفحات داخلی قالب را هم طراحی کنیم ، صفحاتی همچون فروشگاه ، صفحه جزئیات محصولات ، صفحه جزئیات مطالب ، صفحه اخبار و مقالات ، ساخت انواع جدول ها ، ساخت انواع فرم های کامنت و فرم های تماس ، ساخت بخش تب های محصولات ، بخش پست های اینستاگرام ، فرم خبرنامه ، ساخت منوهای رسپانسیو ، صفحه دسته بندی مطالب و … همگی در داخل این قالب و در عنوان یک پروژه سایت رسپانسیو بسیار شیک به شما آموزش داده خواهد شد .
از شما انتظار داریم تا تمامی دقت خود را در فصل اول به دوره متمرکز کنید به این دلیل که اگر بوت استرپ 3 را بخوبی یاد بگیرید ، هنگام یادگیری بوت استرپ 4 و 5 مشکلی نخواهید داشت و به همین دلیل در جلسات آموزش بوت استرپ 3 سعی کردیم تا مباحث را بسیار دقیق به شما تفهیم کنیم .
زمانی که از فصل 1 با موفقیت عبور کردیم به فصل دوم از آموزش خواهیم رسید ( استاد خیابانی ) . در فصل دوم آموزش ، به شکل خیلی کاربردی ، اول به سراغ بررسی تفاوت هایی که در بوت استرپ 4 نسبت به بوت استرپ 3 ایجاد شدند خواهیم رفت که البته در بخش ” تکمیل ” این صفحه ، تفاوت های اصلی در سه نسخه بوت استرپ را برای شما در قالب یک جدول ارائه کردیم . بعد از اینکه تفاوت های بوت استرپ 3 و بوت استرپ 4 را یاد گرفتید ، خواهید دید که خود بخود ، بوت استرپ 4 را تقریبا یاد گرفتید و کار چندان زیادی ندارید . پس به همین ترتیب سراغ طراحی یک قالب به شکل لندینگ پیج خواهیم رفت که شما عملا طراحی قالب با بوت استرپ 4 را نیز تجربه کنید .
نمونه صفحات طراحی شده توسط بوت استرپ 4 و 5 در دوره
از آنجایی که در 2 فصل گذشته به شکل کامل و میتوان گفت سیر تا پیاز بوت استرپ 3 و 4 را به شکل آموزشی و همچنین عملی در قالب پروژه یاد گرفتیم ، در فصل سوم برای آشنایی دقیق با بوت استرپ 5 و همچنین پیش بردن روند صحیح آموزش ، مجدد به سمت سایت بوت استرپ 5 خواهیم رفت و ویژگی های نسخه 5 را در فاز های بسیار مهم همانند بوت استرپ 3 و 4 بررسی خواهیم کرد .
با توجه به پیشروی همین روند در مورد بوت استرپ 3 و 4 ، اکنون شما خواهید دید که خودتان تمامی قسمت های بوت استرپ در نسخه 5 را تشخیص داده و میتوانید بسیار راحت از آن استفاده کنید . سعی خواهیم کرد تا با مثال های عملی ، ویژگی های بوت استرپ 5 را نیز با هم بررسی کنیم و شما پس از این فصل ، از طراحی قالب های رسپانسیو با نسخه های مختلف بوت استرپ لذت خواهید برد .
این دوره همانطور که در بالاتر اشاره شد ، در یک سیستم منظم آموزش داده شده و توصیه می کنیم که اگر قصد شما یادگیری بوت استرپ به شکل کامل و همیشگی است ، همراه ما باشید تا بتوانید بسیار مفهومی از آموزش های این دوره بهره مند شده و یکبار برای همیشه در زمینه بوت استرپ به تخصص لازم دست پیدا کنید .
همانطور که متوجه شدید قالب اول در این دوره یک قالب رستوران است . در داخل قالب اول ، سعی کردیم از المان های بوت استرپ 3 به شکل کامل استفاده کنیم . المان های اصلی که داخل قالب اول به کار رفتند شامل Navbar , Tabs , Tables , Form , Button , List group , Modal و ... هستند که به دلیل پایه بودن بوت استرپ 3 تمامی تلاش و سعی خود را کردیم تا شما در همین ابتدای کار بخوبی بوت استرپ را تفهیم شده و در داخل نسخه های 4 و 5 مشکلی نداشته باشید .
قالب رستوران ضمن اینکه با بوت استرپ طراحی شده اما برای هرچه بیشتر شیک شدن قالب ، کدنویسی های بیشتری نیز انجام داده و قالب را با کدهای Css توسعه دادیم . در حین طراحی قالب رستوران اشاره کردیم که بوت استرپ 3 بعنوان یک تحول در بوت استرپ بود اما بازهم با گذشت زمان کم کم بخش هایی داخل آن احساس نیاز شد که در بوت استرپ 4 این نواقص تا حد زیادی رفع شدند و باهم به آن بخش نیز خواهیم رسید .
قالب رستوران همچنین توام با نکات آموزشی بسیار زیادی برای شما دانشجوهای عزیز است که میتوانید هنر خود در زمینه Css را نیز بسیار افزایش دهید . در این قالب از Bootstrap Tab ها برای بخش صفحه اصلی وب سایت و نمایش آخرین محصولات رستوران استفاده کردیم و بخوبی Tab ها را شخصی سازی کردیم تا شما قواعد اصلاح استایل های بوت استرپ را نیز یاد بگیرید و هدف صرفا بکارگیری المان های آماده نباشد . از بخش جداول برای صفحه جزئیات محصولات و غذاها و از بخش Bootstrap Form ها برای بخش نظرات و سفارش محصول استفاده کردیم .
بخش هایی مثل Listgroup , Panel , Breadcrumb , Tooltip از جمله دیگر المان هایی هستند که در صفحات داخلی قالب استفاده شدند . در این قالب از اسلایدر استفاده نشده اما در قالب بوت استرپ 4 و بوت استرپ 5 از اسلایدر ها بخوبی استفاده کردیم . هدف این بوده که شما در قالب 3 وب سایت کاربردی تمامی بخش ها را فرا بگیرید چراکه گنجاندن تمامی المان های بوت استرپ در یک قالب زمان زیادی از دوره میگرفت و اینکه تمامی المان های بوت استرپ در یک وب سایت عملا نیاز نیست .
در قالب رستوران ، علاوه بر صفحه اصلی ، بسیاری از صفحات داخلی را نیز تکمیل کردیم ، از جمله صفحات مطالب و صفحه محصولات ، اما به این دلیل که در بوت استرپ 4 شما بخش های زیادی از بوت استرپ را یاد گرفتید ، سریعا بخش ها و المان های بوت استرپ 4 را بررسی نموده و قالب نوشیدنی را به شکل لندینگ پیج طراحی خواهیم کرد . قالب لندینگ پیج یک قالب تک صفحه است که البته یکی از شگفتی های این قالب نوشتن تنها 30 خط کد Css در این قالب است و تماما سعی بر این شده است تا قالب با دستورات اصلی بوت استرپ 4 پیاده شود .
در این قالب از بخش هایی همچون Navbar , RowCols , Slider , Card , Borders , Form , Listgroup , ImgClasses و ... استفاده شده است که این المان ها بخوبی و در یک قالب شیک کنار هم قرار گرفتند . ویژگی هایی که بوت استرپ 4 نسبت به نسخه 3 در اختیار ما قرار داد واقعا فوق العاده بود و ما بخوبی قدرت بوت استرپ 4 را به نمایش گذاشتیم . در این قالب از Table ها استفاده نشده به این دلیل که علاوه بر نبود بخشی جهت طراحی در این قالب ، در قالب رستوران بسیار خوب از جداول استفاده کردیم . اسلایدر این قالب به شکل متنی است و اسلایدر قالب بوت استرپ 5 از نوع تصویری و متنی که بخوبی شخصی سازی خواهد شد .
المان های اصلی که در قالب ورزشی با بوت استرپ 5 استفاده کردیم شامل : Navbar , Slider , SerachForm , Card , Table , Forms , FloatingLabels , Listgroup , Menus , Buttons و ... که در این قالب نیز سعی بر این شده است تا اصلی ترین المان ها و همچنین المان های جدید که در جدول زیر مشاهده خواهید کرد و به بوت استرپ 5 اضافه شده است استفاده شود . در کل در قالب بوت استرپ 4 و قالب بوت استرپ 5 اصلی ترین هدف کاهش کدهای استایل اختصاصی و استفاده از جدیدترین المان هایی است که به بوت استرپ اضافه شده است . البته لازم به ذکر است که تنها المان های اصلی در این قسمت ذکر شدند و در داخل قالب المان های بسیار زیادی هستند که نیاز به توضیح در این قسمت ندارند و در پیش نمایش قالب ها و همچنین در ویدئو معرفی خدمتتان ارائه شدند . طراحی قالب رسپانسیو و همچنین شیک هدف اصلی دوره آموزش بوت استرپ بوده است .
این ویدئو از جلسه 3 این دوره برای شما عزیزان قرار داده شده است تا سطح کیفی آموزشی و همچنین کیفیت صدا و تصویر را سنجش نمائید . در تمامی آموزش های سئو 90 سعی بر این بوده است که کیفیت صدا و تصویر بسیار مناسب بوده و همچنین حجم ویدئو نیز متناسب باشد . این جلسه قسمت 3 از دوره آموزش بوت استرپ نسخه سوم می باشد که در آن بخش های تنظیم چیدمان المان ها در داخل صفحات وب را با صبر و حوصله خدمت شما عزیزان تدریس کردیم . بخش چیدمان بندی صفحات و درک نحوه کار بوت استرپ در مورد آن ، بسیار حائز اهمیت است به همین دلیل سعی شده است تا دانشجوی دوره بخوبی در مورد آن تفهیم شود . تمامی جلسات این دوره با همین کیفیت و با همین محتوای آموزشی جامع خدمت شما ارائه شده است . امیدواریم بتوانیم در این دوره به شکل بسیار کاربردی ، مباحث بوت استرپ 5 ، آموزش بوت استرپ 4 و آموزش بوت استرپ 3 را بخوبی به شما دانشجویان محترم ارائه نمائیم .
به عنوان بخش نهایی این دوره قصد داریم تا یک جدول کلی و البته کامل در مورد تفاوت هایی که از نسخه 3 بوت استرپ تا نسخه 5 ایجاد شدند خدمت شما ارائه کنیم که البته در بخش مقالات آموزش طراحی سایت به تفسیر این جدول را مورد بررسی قرار دادیم و به شکل موشکافانه موارد را خدمت شما توضیح دادیم .
دوستانی که در دوره شرکت کردند می توانند از محتوای این جدول استفاده نموده و بخوبی آن را درک کنند . تسلط بر این تفاوت ها در جهت سرعت بخشیدن به کد نویسی شما بسیار موثر خواهد بود . این تفاوت ها را بخوبی در بخش آموزش بوت استرپ 5 احساس خواهید کرد . البته نیازی نیست تا جز به جز این جدول را حفظ کنید ، بلکه با هر بار کدنویسی ، تمامی این موارد ملکه ذهن شما خواهند شد و به راحتی هنگام کدنویسی خواهید فهمید که کدام کلاس ها در نسخه بوت استرپی که استفاده می کنید وجود دارند یا ندارند .
بوت استرپ 3 | بوت استرپ 4 | بوت استرپ 5 |
Body | ||
واحد ها پیکسل هستند | واحد ها به rem تغییر پیدا کردند . هر rem معادل 16 px می باشد . | همانند نسخه 4 |
یکسری فونت های پیشفرض تعیین شده اند | فونت از سیستم کاربر خوانده می شود | همانند نسخه 4 |
فونت پیشفرض 14 px است | فونت پیشفرض 16 px است | همانند نسخه 4 |
کلاس فونت سایز نداریم | کلاس فونت سایز نداریم | کلاس های fs-* , fw-* , fst-* , lh , display اضافه شدند |
text truncate نداریم | text truncate نداریم | text truncate اضافه شد |
Glyphicon داشتیم | Glyphicon ها حذف شدند | Bootstrap Icon ها اضافه شدند |
کتابخانه jQuery نیاز داشتیم | کتابخانه jQuery نیاز داشتیم | نیازمنده به jQuery نیستیم |
کتابخانه RTL نداریم | کتابخانه RTL نداریم | بوت استرپ RTL اضافه شده است |
واحد های فاصله نداریم | واحدی های mb-* , mr-* , ml-* , mt-* , pb-* , pr-* , pl-* , pt-* اضافه شدند | واحد های left , right با توحه به جهت وب سایت به start , end تغییر کردند |
کلاس های عرض و طولی نداریم | کلاس های w-100 , w-50 , mw-100 , mh-100 , h-100 , h-50 و… اضافه شدند | همانند نسخه 4 |
کلاس های نمایشی نداریم | کلاس های d-block , d-inline , d-inline-block , d-none و… اضافه شدند | همانند نسخه 4 |
pull-right , pull-left | float-right , float-left | float-start , float-end |
Grid | ||
float ها دست و پای ما را بسته بود | به کمک تکنولوژی Flex قادر به هر کاری هستیم | همانند نسخه 4 |
کلاس row داریم | کلاس row-cols و row-cols-breakpoint… و align-items داریم | همانند نسخه 4 |
کلاس container داریم | کلاس container-breakpoint داریم | همانند نسخه 4 |
ستون بندی ها 4 تا هستند | ستون بندی ها به 5 افزایش یافته اند | ستون بندی ها به 6 افزایش یافته اند |
xs-sm-md-lg | col-sm-md-lg-xl | col-sm-md-lg-xl-xxl |
مشخصه های عرض موبایل تا 768 هستند | مشخصه های عرض موبایل تا 576 هستند | همانند نسخه 4 |
col-md-offset-* | offset-md-* | همانند نسخه 4 |
Tables | ||
جدول مشکی نداریم | table-dark | thead-light | thead-dark | thead-light | thead-dark => table-dark |
table-condenced | table-sm | table-sm |
table-borderless نداریم | table-borderless اضافه شده | همانند نسخه 4 |
کلاس table-responsive به div داده می شد | table-responsive به همراه breakpoint | همانند نسخه 4 |
Forms | ||
form-horizontal | حذف شده | همانند نسخه 4 |
input-lg | input-sm | form-control-lg | form-control-sm | form-control ها بسیار جذاب تر شدند |
haswarning | ندارد | همانند نسخه 4 |
Floating Label ندارد | Floating Label ندارد | Floating Label دارد |
input از نوع Range و colorpicker نداریم | input از نوع Range داریم | input از نوع Range و colorpicker داریم |
استایل input ها و .. معمولی هستند | استایل Radio و Check بهتر شدند | استایل Radio و Check بهتر شدند و حالت Switch اضافه شده است |
Buttons | ||
کلاس های دکمه | کلاس های btn-light و btn-dark و btn-secondary اضافه شدند | همانند نسخه 4 |
btn-outline ندارد | کلاس های btn-outline اضافه شدند . btn-outline-success | همانند نسخه 4 |
کلاس btn xs-sm-lg | btn-xs حذف شده است | همانند نسخه 4 |
Images | ||
img-responsive | img-fluid | همانند نسخه 4 |
کلاس وسط نداریم | d-block و m-x-auto | همانند نسخه 4 |
DropDowns | ||
دراپ داون ها در داخل ul li هستند | دراپ داون ها در داخل div li هستند | همانند نسخه 4 |
کلاس divider در تگ li هستند | کلاس divider در تگ div قرار دارد | همانند نسخه 4 |
btn-group-justified | ساپورت نمیشه | همانند نسخه 4 |
Navbars | ||
کلاس های navbar-default و navbar-reverse | کلاس های navbar-light و navbar-dark | همانند نسخه 4 |
navbar-fixed-top | navbar-fixed-bottom | fixed-top | fixed-bottom | fixed-top | fixed-bottom | sticky-top |
Pagination | ||
کلاس pagination به ul داده میشه | به li کلاس page-item و به تگ a کلاس page-link داده میشه | همانند نسخه 4 |
previous و next داشتیم | نداریم | همانند نسخه 4 |
list group ها با استایل معمولی | list-group-flush اضافه شده است | همانند نسخه 4 |
Panels | ||
panel , panel-body , panel-header , panel-footer | card , card-body , card-header , card-footer | همانند نسخه 4 |
Slider | ||
item | carousel-item | همانند نسخه 4 |
اسلایدر معمولی داریم | اسلایدر حالت Fade و لمسی اضافه شده است | همان ساختار 4 بعلاوع اسلایدر dark |
Other | ||
Modal ها معمولی هستند | Modal های وسط چین و اسکرول دار آمدند | Modal های فول اسکرین هم اضافه شدند |
کلاس های border نداشتیم | border و border-color اضافه شدند | border-1 تا border-5 اضافه شدند |
بک گراند gradient نداریم | بک گراند gradient نداریم | bg-gradient اضافه شد |
breadcrumb ها معمولی هستند | همانند نسخه 3 | breadcrumb ها استایل بهتری دارند و می توان divider را تغییر داد |
آکاردئون ها معمولی هستند | آکاردئون ها بهتر شدند | آکاردئون با کلاس flush اضافه شدند |
دکمه های Close مشکی هستند | دکمه های Close مشکی هستند | btn-close-white اضافه شده است |
tooltip معمولی | tooltip با خاصیت نوشتن html | tooltip برای svg |
Spinner نداشتیم | Spinner ها اضافه شدند | همانند نسخه 4 |
Toast نداشتیم | Toast ها اضافه شدند | همانند نسخه 4 |
اگر به هر دلیل در درک تفاوت های بوت استرپ مشکل داشتید یا المان هایی که در جدول خدمتتان تنظیم شدند بخوبی برای شما قابل فهم نیستند نشان دهنده این است که شما یا با بوت استرپ کار نمی کنید و یا اینکه کلاس های بوت استرپ را بخوبی درک نکردید . دوستانی که با بوت استرپ کارهای طراحی قالب را انجام میدهند نیازی به بررسی مکرر سایت بوت استرپ جهت استفاده از کلاس ها ندارد و به قدری از کلاس ها و المان های مختلف بوت استرپ استفاده می کنند که تمام کلاس ها ملکه ذهن آنها است .
البته یک نکته مهم نیز در اینجا باید گفت که عملا حفظ کردن همه اسامی کلاس های بوت استرپ ممکن نیست اما از یک طراح ماهر انتظار می رود که حداقل کلاس های اصلی را بخوبی درک کرده و به استفاده مناسب از آنها آگاه باشد . برخی از المان ها همچون کدهای اسلایدر ، مودال ها و در کل کد هایی که حجم آنها کمی زیاد است معمولا امکان حفظ کردن ندارند و نیازی هم به این کار نیست چون می توانیم هر زمان که نیاز به اسلایدر داشتیم همانند دوره ، سریعا کد مد نظر را استفاده کنیم . البته اینجا نکته مهمی داریم که نباید صرفا کار ما کپی و استفاده باشد . زمانی می توانیم با اطمینان خاطر ، خود را یک بوت استرپ کار و طراح بدانیم که از کدهای نوشته شده آگاهی کامل داشه باشیم و بدانیم که در حال انجام چه کاری هستیم . اگر تسلط و شناخت مناسب روی کد ها داشته باشیم دقیقا همانند مدرس دوره به تسلط مناسب خواهیم رسید . امیدواریم که این دوره برای تمامی دانشجویان شرکت کننده در آن بسیار مفید باشد .
خسته نباشید من برای دوره بوت استرپ میخواستم شرکت کنم ولی css که خوندم فکر میکنم خوب نبوده و کمه میخواستم ببینم در این آموزش شما میتونم css هم یاد بگیرم و دوباره نرم از اول یکبار هم css بخونم؟اگر بشه عالی میشه
سلام ممنونم ، شما در دوره بوت استرپ ما خیلی با دستورات css سروکار خواهید داشت ، البته لازمه تا حداقل 50% به مباحث زبان طراحی css آشنایی داشته باشید و دراین دوره قدرت خودتون رو بیشتر کنید
سلام استاد عزیز و توانا من امروز میخواستم نظرم را راجب این آموزش بگم حدود دوماه قبل در این آموزش وارد شدم و هرهفته چند جلسه نگاه کردم همه قالب های شما را خودم تنهایی تونستم بسازم و الان خیلی قالب های دیگه برای خودم ساختم که خیلی لذت بخش هست ساختن قالب با چیزی که یادگرفتی ممنونم از شما و آموزش خوب و بی نظیر شما
سلام استاد عزیز و خوبم امیدوارم تندرست باشید استاد طبق گفته شما تا انتها دوره را مشاهده کردم واقعا لذت بردم هم از نحوه تدریس و هم از روش گام به گام شما الان که دوره به اتمام رسیده میخواستم بدونم برای تمرین قالب شما اون سایت های نمونه را از کجا طراحی می کردید که منم چندتا نمونه پیدا کنم و روشون کار کنم و تمرین بشه برام ممنون
سلام ممنون از لطف شما امیدوارم همیشه رو به رشد و موفق باشید . برای دیدن نمونه های مختلف و الهام گیری از دیزاین ها میتونید از وب سایت خارجی تم فارست کمک بگیرید .
سلام ممنون از آموزش های خوب شما بعد از خریدن 2 تا آموزش از سایت های دیگه که استادش خودش هم تازه کار بود بلاخره با خریدن و دیدن فیلم های شما خیلی خوب تونستم یاد بگیرم بوت استرپ را خیلی عالی درس دادید همه آموزش هاتون خوب و عالی هستش
سلام و تشکر از نظر لطف شما خانوم نژاد مراد ، خوشحالیم که برای شما در دوره آموزش بوت استرپ مفید واقع شدیم
بوت استرپ شما در داخل اینترنت یدونه هست آقا یدونه . اینهمه فیلم هارو دیدم هنوز به یک دونه مشکل هم برخورد نکردم که بابتش بیام سوالی کنم قسمت 29 هستم و عالی تدریس شده این دوره آرزوی موفقیت برای شما و خودم دارم
سلام امیر علی عزیز زنده باشی ، تلاش و پشت کار شما قابل تحسینه دوست من
سلام ممنون از مطالب خوب سایت شما من در آموزش های html و مقدماتی css شرکت کردم برای خرید این دوره نیاز به راهنمایی داشتم ممنون میشم یک توضیح بفرمائید
با سلام ، دقیقا نفرمودین که نیاز به چه راهنمایی هایی دارید ، اما میتونم بگم قبل از شرکت در دوره بوت استرپ باید تسلط به مباحث css داشته باشید ، این دوره کاملا تضمینی و پروژه محور تدریس شده و توضیحات کافی و کامل در متن دوره خدمتتان ارائه شده
سلام حیدری هستم از کرج خدمتتان پیام میدم میخواستم بدونم بعد از یاد گرفتن بوت استرپ امکان داره که زبان هایی مثل متریال را کلا یاد نگرفت و با همین بوت استرپ کار کرد ؟ ممنون میشم به من پاسخ بدید
سلام وفت بخیر ، یادگیری بوت استرپ برای طراحی قالب های بی نقص برای شما کافیه ، یادگیری فریم ورک هایی مثل متریال یا یوآی کیت جهت توسعه مهارت شماست و اجباری نیست .
سلام اساتید خدا قوت برای شما عزیزان قالب هایی که در فیلم نمایش دادید واقعا قشنگ هستند و نتیجه کار مشخص شده اما یک پیشنهاد دارم اگر امکان داشت در نظر بگیرید که صفحه ورود و ثبت نام هم آموزش داده شود تشکر می کنم مجدد
سلام عرض ادب خدمت شما دوست گرامی ، در داخل این دوره و در حین آموزش المان های بوت استرپ ، نمونه های کوچک نیز پیاده شدند که فرم های ورود و ثبت نام نیز داخل آن می باشند .
با عرض سلام خدمت شما مدرس های این سایت بنده در مورد آموزش بوت استرپ دو سوال مهم دارم و تشکر می کنم اگر پاسخ دهید . سوال اول اگر برای ساختن پروژه های که قصد فروش در سایت هایی مثل تم فارست که بین المللی هستند بوت استرپ را یاد بگیرم و فقط با این روش قالب طراحی کنم یعنی از زبان هایی بجز بوت استرپ استفاده نکنم و تمام قالب ها با بوت استرپ باشند مشکلی در پذیرش یا فروش قالب ها بوجود خواهد امد ؟ و سوال دوم امکان شرکت در دوره بصورت اقساطی مثل دوره شرکتی که داشتید امکان پذیر هست یا خیر ؟ ممنون و تشکر
با سلام خدم شما طراحی قالب ها توسط بوت استرپ هیچ مشکلی برای فروش ایجاد نمیکند . برای خرید اقساطی ، دوره هایی این امکان را دارند که هزینه نسبتا بالایی دارند . ممنون
این آموزش که استاد قدیمی تدریس کردند را نمیشه با چند جمله بیانش کرد حتما باید در دوره شرکت کنید تا به تخصص و دانش استاد در زمینه طراحی پی ببرید قبل این دوره حدود 3 تا دوره از سایت هایی که خیلی اسم و رسم دارند ولی همش الکیه خریدم چیزی که منو اذیت کرد این بود که قشنگ احساس میکردم وقتی مدرسش قسمتی رو درس نمیده یعنی بلد نیست و خودشون هم مونده بودن و هیچ پروژه درست و حسابی هم یاد ندادند در این دوره اموزش بوت استرپ قالب رستوران را که دیدم واقعا لذت میبردم که چقدر با سلیقه و حوصله داره طراحی میشه و همینطور قالب های بعدیش از صمیم قلبم از اقای مهندس عزیز تشکر میکنم که باعث شدن راه درست را پیدا کنم و این اموزش را درست و حسابی با خاطری جمع یاد بگیرم بنظرم همیشه برای شناخت اساتید خوب راه درست خودش پیدا میشه که من از مطلبی که برای تفاوت بوت استرپ ها نوشته بودین اومدم تو سایتتون و خوشحالم که میتونم کنار شما باشم
سلام خدمت شما جناب فرخی عزیز ، واقعا برای ما مایه خوشحالی هست که دانشجویانی همچون شما در کنار ما هستند و دوره های ما واقعا برای شما مفید واقع شده . امیدوارم در تمام مراحل یادگیری و همچنین کاری خودتون موفق باشید .
در آموزش بوت استرپ 5 قسمت ساخت فرم من اصلا فرم که میزارم صفحه خراب میشه کلا فرم من میاد زیر اون جدول وقتی ولی چیز دیگه مثل یه عکس میذارم اونطوری نمیشه مشکل چیه منو کلافه کرده ممنون
سلام مشکل کاملا واضح هست که به div های شما مربوطه. حتما داخل کد های شما div هایی کم یا زیاد هستند که چیدمان اصلی قالب به هم میخوره
قسمت آموزش بوت استرپ 5 فوق العاده بود راستش فک کردم اینطوری خوب یاد نمیشه گرفت ولی واقعا چی بگم خدا خیر بده همه سئو 90 را الان هر سه تا بوت استرپم بلدم و واقعا حس ارزشمندی دارم
سلام احسان عزیز برای ما مایه خوشحالی هست که دانشجویانی همچون شما در کنار مجموعه ما هستند . امیدواریم هرروز بهتر از قبل باشی
از این دوره استفاده کردم و حقیقتا لذت بردم از تدریس عالی استاد واقعا معلوم بود که با تسلط کامل تدریس می کنند مهم تر ازهمه جمع کردن همه بوت استرپ های داخل یک دوره بود که قبلا در هیچ سایتی ندیده بودم ارزش دوره و هزینه دوره خیلی عالی بود و یک نکته مهم اینکه خیالتون راحت میشه که اموزش دیگه لازم نیس پول بدید لطفا نظر منو نمایش بدین تا همه ببینند تشکر از استاد عزیزم
سلام خدمت شما میخواستم یک تشکر ویژه داشته باشم از آموزش خوب شما که خیلی به من کمک کردید خیلی علاقه دارم تا از آموزش های بعدی هم استفاده کنم که بتونم به درآمد خوب برسم وقتی که در حال استفاده از دوره شما بودم این احساس را داشتم که توانایی طراحی سایت دارم واقعیت خیلی کامل و بی نقص بود برای من که خیلی در سطح پایین تر بودم ممنونم از شما امیدوارم همیشه در همه جا موفق باشید
برای داشتن یک فرم حرفه ای بوت استرپ امکانات زیادی نداره و از این جهت بنظرم جذاب نیست . خیلی از امکانات داخل بوت استرپ نیستند
سلام خدمت شما دوست خوبم . بوت استرپ یک فریم ورک برای واکنشگرا سازی قالب ها می باشد و در کنار این ، یک سری امکانات هم در اختیار شما قرار داده است که بتوانید قالب هایی استاندارد تر طراحی کنید . شما اگر به طرح های بیشتری نیاز دارید می توانید از کتابخانه های جی کوئری استفاده کنید و یا خودتان دست به کد شوید .
سلام من بوت استرپ 3 را از قبل بلد هستم میخواستم بدونم اگر همین بوت استرپ 3 را بازهم با شما ببینم مشکلی پیش میاد برام ؟ از نظر تداخل تدریس ها
سلام وقت شما بخیر . سرفصل های بوت استرپ 3 در کل تغییراتی ندارند و شما هر چیزی که قبلا یاد گرفتید در همین بخش ها هم وجود دارند با این تفاوت که نکات اموزشی و فنی بیشتری خدمتتان ارائه شده تا هرگز در کار با نسخه های مختلف بوت استرپ دچار مشکل نشوید .
سلام مودال اسلایدر دکمه ها هیچکدوم داخل قالب من کار نمیکنه مشکلشان چیه . اسلایدر میاد اما دکمه هاش کار نمیکنن تصویر ها هم مثل سایت عوض نمیشه
سلام مشخصه که فایل جی کوئری بوت استرپ شما به درستی کار نمیکنه و یا کتابخانه جی کوئری را قبل از کتابخانه بوت استرپ لود نکردید
سلام برای چه مواردی باید از بوت استرپ استفاده کرد ؟ خیلی میبینم که دارن آموزش میدن نمیدونم باید یاد بگیرم یا نه و اینکه نمیدونم میتونم با نه
با سلام شما اگر قصد دارید تا طراحی قالب یاد بگیرید و قالب های واکنشگرا و شیک و استاندارد طراحی کنید حتما باید بوت استرپ را یاد بگیرید . می توان گفت برای یک طراح قالب یادگیری بوت استرپ از الزامات اصلی است .
سلام وقت شما بخیر باشه ممنون از اینکه این آموزش را ضبط کردین قبل از اینکه بخرمش چندتا سوال داشتم اول اینکه میشه بدون بوت استرپ و فقط با css قالب زد ؟ دو اینکه چقدر زمان لازمه تا مثل شما خوب بلد باشم خودم تند تند قالب طراحی کنم و سوال اخر تخفیف نداره دوره شما ؟ مرسی
سلام وقت شما هم بخیر بسیار خوشحالیم که در کنار مجموعه ما هستید . برای طراحی قالب شما می توانید بدون بوت استرپ هم این کار را انجام دهید اما مطمئنا زمان زیادی از شما خواهد گرفت و کد نویسی شما به دلیل نوشتن کلاس هایی با اسامی دلخواه مخصوصا برای قسمت رسپانسیو کردن سایت ، به شکل استاندارد نخواهد بود و پروژه شما جهت توسعه برای سایر طراحان قابل فهم نیست ضمن اینکه سرعت شما در کدنویسی چندین برابر افت خواهد کرد . زمان تسلط شما هم بستگی به میزان تمرین و علاقه شما داره . تخفیف دوره های آموزشی در جشنواره ها قرا داده می شوند اما برای دریافت کد تخفیف می توانید از بخش تیکت ها با مدیریت در ارتباط باشید . با تشکر از شما
یه سوال دیگر هم دارم برای اینکه اسلایدر خود بوت استرپ داخلش 4 تا محصول بزارم چجوری انجام بدمش ؟ میخوام اون قسمت محصول ها که طراحی کردیم چهارتا چهارتا داخل اسلایدر بیان . الان فقط یدونه از اونها نشان داده میشه ممنون
داخل بخش اسلایدر توضیح دادیم که هر item مربوط به یک اسلایدر هست و شما کافیه داخل کلاس item یک row بسازید و داخلش را به چهارتا col تقسیم کنید .
سلام من میخواستم یک بخش اضافه کنم داخل قالب وزرشی که یدونه دکمه باشه بالای سایت با زدنش یدونه فرم بیاد توی صفحه که داخلش یدونه لینک دیگری هم باشه که وقتی روش کلیک شد فرم عوض بشه . اولی برای فرم ورود و دومی را برای فرم ثبت نام میخواستم درست کنم .
با سلام برای بخش اول باید از مودال ها استفاده کنید . دکمه باز شدن مودال را در جای دلخواه قرار بدید و داخل مودال فرم خودتان را بسازید اما برای قسمت دوم باید از جی کوئری استفاده کنید تا فرم ها جایگزین شوند به کمک افکت های hide و ...
سلام داخل قالب رستوران من میخواستم یک نقشه هم باشه که بتونن با نقشه اونجا محل خودشون را مشخص بکنن . برای این کار لطفا راهنمایی کنید ممنون
با سلام خدمت شما وقتتون بخیر ، برای پیاده سازی می توانید از دو دوره آموزشی داخل سایت استفاد کنید که بنظرم بهترین دوره آموزشی برای شما میتونه آموزش طراحی قالب حرفه ای با بوت استرپ باشه که در داخلش بخش نقشه و پیاده سازی اون به شکل کامل توضیح داده شده .
من الان دارم واقعا احساس میکنم که میتونم مثل بقیه طراحی سایت کنم توی این یکسال بیشتر از 5 ملیون فقط خرج آموزش هایی کردم که الان همشونو گذاشتم کنار من نمیدونم واقعا چجوری این پول هارو میخورن و اخرش هیچی تحویل ادم نمیدن . کاش خیلی زود میشد بیام داخل سایت شما خسته نباشین خیلی عالی هستین
استاد سلام و ممنون شرمنده در قالب اول من گام به گام رفتم جلو ولی اعداد انگلیسی تایپ میشه . و حتی index خود تون رو هم باز میکنم اعداد اینگلیسی هست چه کنم ؟؟
سلام وقت بخیر . نمایش اعداد انگلیسی به دلیل این هست که فونت شما اعداد فارسی را پشتیبانی نمیکنه . فونتی که من استفاده کردم فونت فارسی ایران سنس هست و اعداد فارسی را پشتیبانی میکنه اما چون این فونت پولی هست به دلیل قوانین کپی رایت داخل سورس به شما ندادیم و از فونت ساحل استفاده کردیم . شما میتونید در گوگل مثلا سرچ کنید : فونت یکان با اعداد فارسی ، پیدا کنید ، دانلود کنید و داخل پروژه استفاده کنید . با تشکر
سلام استاد ممنون از اموزش خوبتون 3 تا سوال از قالب اول 1. اگه بخوایم در بکگراند یک فیلم قرار بدیم به جای عکس باید چه کنیم ؟؟ 2. اگه بخوایم 2 تا لگو داشته باشم یگی سمت راست و یکی سمت چپ باید چه کنیم ؟؟ 3. اگه بخواییم وقتی میاییم پایین منو هم با ما حزکت کنه بیاد پایین باید چه کار کنیم استاد
سلام و عرض ادب خدمت شما احسان خان عزیز . خسته نباشید . برای اینکه از ویدئو در پس زمینه استفاده کنید باید حتما از تگ video استفاده بشه و با کمک دستورات position ویدئو را به داخل باکس هدایت کنید . باکس اصلی مقدار relative داشته باشه و باکس ویدئو absolute . برای داشتن دوتا لوگو باید دستورات col بندی در بوت استرپ را خودتون به اندازه نیاز تقسیم کنید . مثلا اگر داخل یک row از دوتا col-md-6 استفاده کنید خب مسلما دوتا باکس در کنار هم خواهید داشت و می تونید در هر کدوم یک لوگو قرار بدید . برای اینکه منو همزمان با شما به پایین بیاد بوت استرپ در نسخه 3 یکسری کلاس ها داره که در نسخه 4 و 5 اسم هاشون عوض شده . فک کنم در بوت استرپ 4 به بعد اگر کلاس fixed-top را به بخش nav بدید منو برای شما چسبان میشه . برای مشاهده دقیق تر این مورد میتونید در داخل سایت بوت استرپ در بخش components به قسمت navbar برید و با کمی اسکرول در پایین حالت فیکس را به شما معرفی کرده است . البته در همین صفحه هم می تونید در انتهای مطالب که جدول تفاوت های بوت استرپ 3 و 4 و 5 را گفتیم اسم کلاس fix کردن را دقیقا پیدا کنید . تشکر موفق باشی احسان جان
هیچوقت از امورش هایی که از وب سایت شما خرید کردم پشیمون نشدم یکی از اموزش های فوق العاده ای بود که تهیه کرد و خیلی خیلی زیاد چشم من باز شد تا بتونم همه چیزی طراحی کنم میتونم بگم دستتان درد نکنه کاش تمامی اموزش ها همین مدل باشند و یکبار بشه یاد گرفت و رفت به سراغ مرحله بعدی
سلام متشکریم از نظر لطف شما . خیلی خوشحال شدیم که دوره ما برای شما مفید بوده و مایه دلگرمی ما هستید
سلام میشه دوره رو بصورت جداگانه خرید کرد ؟ یعنی فقط بوت استرپ 5 را بخریم ؟ و میشه برای اینکه یک قالب خوب طراحی کرد بدون خواندن اچ تی امل و سی اس اس فقط همین دوره را خواند ؟ مرسی
با سلام خدمت شما کاربر محترم ، این دوره به نحوی آموزش داده شده است که تمامی بخش ها دوره به هم متصل هستند و شما در این دوره از پایه یعنی بوت استرپ 3 باید شروع کنید تا به بوت ایسترپ 5 برسید . توصیه می کنیم این دوره را از پایه شروع کنید تا بهترین نتیجه راکسب کنید .
با سلام خدمت شما کاربر محترم وب سایت سئو 90 ، هزینه دوره ها متناسب با محتوای آموزشی داخل دوره تعیین می شوند . کیفیت آموزش و همچنین جامعیت دوره و مطالبی که از این دوره قرار هست یادبگیرید باید برای شما ملاک باشه نه صرفا قیمت . و یادتون باشه خرید آموزش هزینه نیست بلکه سرمایه گذاری روی خودتان هست .
سلام بوت استرپ 5 هم اضافه شد بهش یا نه هنوز ؟ گفته بودید که بوت استرپ 3 و 4 اموزش هاش گذاشتین ولی 5 هنوز اماده نشده .اگر کامل شده من میخواستم خرید کنم
با سلام دوره به شکل کامل به اتمام رسیده است . آموزش بوت استرپ 5 ، بوت استرپ 4 و آموزش بوت استرپ 3 به شکل کامل در داخل پکیج برای شما قرار داده شده است . با تشکر از شما دوست عزیز
سلام بله دقیقا مسیر درست همین هست ، داخل صفحه نقشه راه فرانت هم میتونید مسیر کامل رو ببینید