آموزش bootstrap

[moalla]

bootstrap توسط تویتر نوشته شده و در طراحی وب طی یکسال گذشته توسط طراحان وب زیاد استفاده شده و توی گیت هاب بیشتری فورک رو داشته: اینجا (https://github.com/popular/forked)رو ببینید.
غالب های زیادی بر پایه اون نوشته شده و نوشته میشه. برخیش رو اینجا (https://wrapbootstrap.com/)ببینید
عمدتا این سه بخش رو داره:
1- گریدبندی عناصر صفحه
2- کامپوننت و المنت برای طراحی
3- یکسری پلاگین جی کوئری محدود
ملحقات زیادی هم براش اومده. بتدریج سعی میکنم یکسری آموزش براش قرار بدم.

برای دانلود ورژن راست چین شده و متناسب با فارسی از این لینک (http://rbootstrap.ir/index.html) استفاده کنید

جلسه اول: دانلود و گریدبندی با بوتسترپ (http://quicklearn.ir/?q=node/14)
جلسه دوم: کامپوننتهای بوتسترپ همراه با پیاده کردن مثال عملی (http://quicklearn.ir/?q=node/22)
جلسه سوم: آشنایی با منابع دیگه و کدهای آماده (http://quicklearn.ir/?q=node/33)

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

[سعید کشاورز]

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

[ravand]

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

[سعید کشاورز]

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

ولی توی فیلم قدرت بیان بسیار زیاد هستش...اگه ایشون میخاست توی pdf توضیح بده که بنده خدا باید 3 روز تایپ و تصویر سازی میکرد...
با فیلم خیلی راحت تر میشه مفهوم رو رسوند..

[moalla]

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

[yasharhi]

ممنون دوست عزیز منتظر آموزشهاتون هستیم

[r4hgozar]

ایم خیلی خیلی خوبه ها. خیلی جالبه.
اما نمی دونم چرا من رو ارضاء نمی کنه.
من دلم می خواد کد ها رو خط به خط خودم بنویسم.
مخصوصا تو حالت های خاص خیلی به نظرم تسلط روی کدها به ادم کمک می کنه.
ولی خیلی جالب بود. امیدوارم یه روز خودت و دوستان دیگه نرم افزار ایرانی طراحی کنه که بصورت کاملا گرافیک همچنین کاری رو انجام بده.

[heidarymh73]

توضیحی در مورد این بوت استرپ ها : هر طراح وب تویه یه طراحی سایت کار های مختلفی انجام میده حالا با HTML یا CSS و ... اما این کار خیلی وقت میبره و پس از طراحی بسیار و کسب تجربه طراحی خوب صورت میگره. اما این بوت استرپ در بخش های مختلف نمونه های مختلفی رو ارائه داده که شما با یک کپی ساده میتونید از اون استفاده کنید.
اگر جدید تر این رو داشتید قرار بدید ممنون میشم و یا کار های شبیه به این

[moalla]

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

[moalla]

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

[بهزاد علی محمدزاده]

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

[بهزاد علی محمدزاده]

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

[سعید کشاورز]

سلام ..من همین الان شروع کردم به کار کردن با این فریم ورک ..یه سوال پیش اومد..الان من برای راست به چپ کردن توی صفحه html یه تگ استایل نوشتم که کلاس container رو direction:rtl; بکنه..میخاستم ببینم مشکلی پیش نمیاد؟

[moalla]

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

[بهزاد علی محمدزاده]

البته راست چین شده و ترجمه این فریم ورک و می تونید توی این لینک (http://rbootstrap.ir/) ببینید .

[moalla]

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

[moalla]

دوستان قسمت سوم هم اضافه شد که پیشنهاد میکنم حتما اون رو نگاه کنید تا با منابع جنبی بوتسترپ هم آشنا بشید

[hesam_a110]

سلام
سپاس بابت تاپیک خوبتون
من با bootsratp به یه موردی برخوردم هر چه تلاش کردم که بر طرفش کنم نشد لطفا منو راهنمایی کنید
پروژه بدون URL rewriting درست کار میکنه ولی وقتی که url rewrting میشه منو دیگه کار نمیکنه
اسکریپت و css ها رو هم با ResolverUrl آدرس میدم اینجا یه مثال کوچیک از مشکلم گذاشتم :)
104661

سپاس :)

[moalla]

یعنی بعدش کتابخونه های Js و css لود نمیشن؟
دقیقا نفهمیدم مشکل کجاست

[hesam_a110]

سلام
تمام js , css لود می شند ولی منو به صورت hover کار نمیکنه
توی اینترنت گشتم و این راه رو پیدا کردم
https://github.com/CWSpear/twitter-bootstrap-hover-dropdown
:چشمک::لبخندساده:

[pary_daryayi]

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

[f_talebi]

آموزش ها واقعا عالی بودن . امیدوارم که آموزشش رو حتما ادامه بدین

[mohamad_torabi]

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

[moalla]

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

[badrang]

هر سه فیلم عالی بودن مخصوصا سومی
امیدوارم باز هم ادامه بدین ترجیحا با بوت استرپ 3
بوت استرپ 3 راست به چپ (http://zerox.me/projects/bootstrap3/)

[usb.mini]

ادامه نداره؟

[Mahdi-563]

نه دیگه یه نفر انتقاد می کنه یه نفر دیگه هم از کرده پشیمون میشه