PDA

View Full Version : آموزش: استفاده از قالب های حرفه ای!



nice_boy_a
سه شنبه 18 شهریور 1393, 17:26 عصر
با سلام.
این روزا استفاده از قالب های زیبا و حرفه ای مد شده! و اکثر سایت های خارجی با این قالب ها پیاده سازی شدن، هر چند تعداد معدودی از سایت های ایرانی از این قالب ها استفاده می کنن ولی خب انتظار میره که این تعداد معدود رو به افزایش باشه و برنامه نویسا و طراحان قالب خودشونو بروز کنن.
با خوندن پست یکی از دوستان (ایجاد پنل مدیریت زیبا (http://barnamenevis.org/showthread.php?468351-%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-%D9%BE%D9%86%D9%84-%D9%85%D8%AF%DB%8C%D8%B1%DB%8C%D8%AA-%D8%B2%DB%8C%D8%A8%D8%A7)) بر آن شدم که توضیح مختصری در مورد چگونگی استفاده از این قالب ها بدم.
این تریپ قالب ها با فریمورک های معروف پیاده سازی میشن (مثله bootstrap)، و برای توسعه دادن این قالب ها نیاز به دانش css، html و در صورت استفاده ی قالب، javascript یا jQuery می باشد.

قالب های مذکور بیشتر برای پنل های مدیریتی استفاده میشن و معمولا فایلی با نام index.html دارن که صفحه اول یا به قول معروف داشبورد سایت محسوب میشه!

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

خب بریم سر اصل مطلب!
برای استفاده از این قالب ها در پنل مدیریت باید چیکار کرد ؟

فایل index.html رو باز کنید،کد های درون تگ head رو داخل تگ head صفحه ی مدیریت خودتون (Default.aspx) کپی کنید! اگه دقت کنید می بینید که یه سری فایل css و js به صفحه اضافه شده که آدرس اونا توی پروژه شما نیست، زحمت بکشید و اون فایل ها رو هم به پوشه پروژه ی خودتون بیارید و آدرس تگ ها رو درست کنید!
قدم بعدی اضافه کردن کد های درون تگ body به صفحه ی Default پروژمونه، این کد ها رو هم مثل قسمت head به body صفحه انتقال بدین.
کد ها نظم خاصی دارن و با کمی دقت میشه کدهای هر قسمت از صفحه رو تشخیص داد، معمولا زیاد با قسمت Content سر و کار نداریم(مگر در موارد خاص)، می تونید به جای اون نمودار ها و ... کد های خودتون اعم از GridView، DataList یا ... رو اضافه کنید.
منو ها هم که مشخصه، می تونید به راحتی اسم برچسب هر منو رو عوض کنید و یه صفحه واسه اون درست کنید و لینکش رو به صفحه جدید بدید.

نکته : چون پنل مدیریت شامل چندین صفحه میشه، میتونید موارد بالا رو توی MasterPage اعمال کنید، که توی همه ی صفحه ها منو وجود داشته باشه.

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

لازم به ذکره استفاده از این قالب ها ربطی به استفاده از روش برنامه نویسی یا استفاده از تکنولوژی خاص نداره!

چون این دست قالب ها تو اینترنت زیاده من دیگه آپلود نکردم، با یه سرچ کوچیک می تونید کلی از این قالب ها رو ببینید! کافیه عبارت Admin Template Free یا عبارت های مشابه رو بزنید!

دوستان اگه سوالی بود من درخدمتم!

CsharpNevisi
سه شنبه 18 شهریور 1393, 22:19 عصر
داداش یه چیزی بگم ناراحت نمیشی ؟؟؟؟؟
ببین نظر من اینه که این مطلبی که گذاشتی خیلی خیلی پیشه پا افتادش ... !!


فایل index.html رو باز کنید،کد های درون تگ head رو داخل تگ head صفحه ی مدیریت خودتون (Default.aspx) کپی کنید! اگه دقت کنید می بینید که یه سری فایل css و js به صفحه اضافه شده که آدرس اونا توی پروژه شما نیست، زحمت بکشید و اون فایل ها رو هم به پوشه پروژه ی خودتون بیارید و آدرس تگ ها رو درست کنید!
قدم بعدی اضافه کردن کد های درون تگ body به صفحه ی Default پروژمونه، این کد ها رو هم مثل قسمت head به body صفحه انتقال بدین.
کد ها نظم خاصی دارن و با کمی دقت میشه کدهای هر قسمت از صفحه رو تشخیص داد، معمولا زیاد با قسمت Content سر و کار نداریم(مگر در موارد خاص)، می تونید به جای اون نمودار ها و ... کد های خودتون اعم از GridView، DataList یا ... رو اضافه کنید.
منو ها هم که مشخصه، می تونید به راحتی اسم برچسب هر منو رو عوض کنید و یه صفحه واسه اون درست کنید و لینکش رو به صفحه جدید بدید.

نکته : چون پنل مدیریت شامل چندین صفحه میشه، میتونید موارد بالا رو توی MasterPage اعمال کنید، که توی همه ی صفحه ها منو وجود داشته باشه.
خب اینارو که همه میدونن :لبخند:
فک کنم تا الانم همه از پوسته های اماده استفاده کردن ... !!!
کسی که حرفه ای کدنویسی میکنه هیچوقت این کارارو نمیکنه .... اصلا کار خوبی نیست به نظر من ... !!!
قالبای اماده اینترنتو اصلا نمیپسندم ... اگه قرار باشه بقیه کد بزنن شما استفاده کنیم ... دیگه برنامه نویس نمیشیم که .. !!!
من قالبایی که خودم میزنمو ترجیه میدم به قالب های اماده ... !!!
تقریبا هرچی که تو نت میبینمو میتونم پیاده کنم .. هرچی که باشه ... !!!
به نظرم شمام این کارو نکن .. این کار ب هیچ عنوان کار قشنگی نیست ... همچین چیزی تو اصول حرفه ای نمیگنجه ... !!!
مثلا این منوی اماده رو ببین :
http://ijquery.ir/demo.php?page=menu-navigation/accordion
نگا چقد کد براش نوشتن ... خب من با CSS3 تونستم با 20 خط استایل اینو درست کنم ... !!! (منظور این که خودتون میتونید خیلی ساده تر این کارور بکنید و این پنل ها رو خلق کنید (البته رسم نمودار این وسط استثناء ... خودمم حوصله طراحی نمودار ندارم .. کار کسل کننده ایه :لبخند:))

sg.programmer
چهارشنبه 19 شهریور 1393, 17:59 عصر
سلام
من از قالب بوت استرپ استفاده کردم در VS قالب بهم میریزه - چیکار باید بکنم تا قالب صحیح به نمایش درآید در VS ? شکل اولی

بعد از اجرا در browser‌ درست نشون میده شکل دومی

[

sg.programmer
پنج شنبه 20 شهریور 1393, 21:44 عصر
کسی از دوستان نظری نداره؟

nice_boy_a
جمعه 21 شهریور 1393, 10:13 صبح
ویژوال استدیو همین مشکل رو داره و نمیشه کاریش کرد

sg.programmer
جمعه 21 شهریور 1393, 14:14 عصر
ویژوال استدیو همین مشکل رو داره و نمیشه کاریش کرد

خوب اگه اینطور باشه دیزاین و کد نویس با مشکل روبرو میشه؟
راه حلی سراغ دارین؟

Binazir Gharibi
جمعه 21 شهریور 1393, 17:48 عصر
بعضی از کلاس ها و استایلها از طریق فایل جاوا بعد از اجرای برنامه ، اعمال میشن البته اگر این قالب فایل جاوا داشته باشه .

CsharpNevisi
جمعه 21 شهریور 1393, 19:15 عصر
خب محیط VS هم مثل مرورگرها کدهای شمارو میخونه و صفحه رو میسازه و این محیط تو فهم کدها و ساخت شکل صفحه مشکل داره و کاریشم نمیشه کرد .. !!!

rezaee2
سه شنبه 25 شهریور 1393, 10:42 صبح
با سلام.
.......می تونید به جای اون نمودار ها و ... کد های خودتون اعم از GridView، DataList یا ... رو اضافه کنید.

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



داداش یه چیزی بگم ناراحت نمیشی ؟؟؟؟؟
ببین نظر من اینه که این مطلبی که گذاشتی خیلی خیلی پیشه پا افتادش ... !!


سلام
ای مرکز علم.. ای حرفه ای... ای آخرش.

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


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

CsharpNevisi
سه شنبه 25 شهریور 1393, 14:01 عصر
سلام
ای مرکز علم.. ای حرفه ای... ای آخرش.

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

rezaee2
چهارشنبه 26 شهریور 1393, 07:05 صبح
سلام ای مرکز یادگیری ... ای مبتدی ... ای اولش.
شما میخوایی یه قالبه اچ.تی.ام.الو تو پروژه ای.اس.پیت بیاده کنی کدهاشو نگاه میکنی و بعد دعا میکنی ؟؟؟ یا نه مثلا سیستمو به حال خودش میزاری که خودش کارارو ردیف کنه ... !!!
این روشای شما درست نیست ... شما باید کدهای درون تک هد اچ.تی.ام.سو تو تگ های هد ای.اس.پی-ایکست کپی کنی و به همین ترتیبم بادی رو ... !!!
این یه چیزی در جهت اموزش ... یادگرفتی ؟؟؟؟؟؟
دیگه این مطلبو همه میدونن اگه شما نمیدونی بهت پپیشنهاد میکنم برنامه نویسیو ببوسی بزاری کنار ... !!!
من فقط گفتم تایپیک های هرزه درست نکنید .... !!!!

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

CsharpNevisi
چهارشنبه 26 شهریور 1393, 10:45 صبح
بسیار ممنون که من رو از معادن علوم آسمانی و زمینیتون بهرهمند، است... .
خوش باشی.

قابلی نداشت .. !!!

sg.programmer
یک شنبه 30 شهریور 1393, 15:41 عصر
ویژوال استدیو همین مشکل رو داره و نمیشه کاریش کرد

سایت مشترکین مدیرتی مخابرات با همین bootstrap و ASP.net نوشته شده چطوری نوشته شده؟
http://10.8.206.66:8081/index.aspx

اینم محیطش
123736

sun2rise
دوشنبه 31 شهریور 1393, 12:25 عصر
وقتی قراره یه برنامه ای رو شروع به برنامه نویسی بکنم همیشه دقدقه ام این میشه که چطوری قالبش رو طوری طراحی کنم که هم خدا راضی باشه هم خلق خدا با این که باید بیشترین تمرکزم رو روی برنامه نویسی بکنم ولی ذهنم همیشه درگیر ظاهر سایت میشه و این یه مشکلی است که نمیذاره کار ها خوب پیش بره من که تا به حال از پنل مدیریتی آماده استفاده نکردم ولی به نظرم این قالب های آماده همیشه هم بد نیستن زمانی به درد برنامه نویس ها میخورن که وقت کمی برای تحویل پروژه دارن یا این که مشتری عقلش به چشمش هست و فقط میخواد سایتش شبیه فلان سایت خارجی باشه
خلاصه نه میشه اینا رو بد توصیف کرد و نه خوب
با استفاده از قالب های آماده ممکنه به طراحی و کدنویسی ما ضرر بزنه که نباید انقدری پیش بریم که به ما لطمه بزنه قالب های آماده بهترین بستری هستند که ما بتونیم از اون ها ایده طراحی رو یاد بگیریم نه این که همیشه خدا کپی کنیم