تبدیل Theme در ASP.Net MVC
دوشنبه 12 مهر 1395این مقاله در مورد چگونگی تبدیل یک صفحه HTML به ASP.NET MVC میباشد . با ارائه یک مثال و توضیح و شرح آن بصورت مرحله به مرحله ، این کار را به شما آموزش خواهیم داد .
اساسایک صفحه Asp.Net همانند یک صفحه HTML است . یک صفحه HTML دارای پسوند html. است در صورتی که صفحات ASp.Net دارای پسوند aspx. میباشند . در ادامه چگونگی تبدیل صفحه HTml را به ASp.Net بصورت مرحله به مرحله توضیح خواهیم داد :
1. در مرحله اول Visual Studio 2015 را باز کنید .
2. ASP.NET Web Application را انتخاب کنید و نام پروژه را به دلخواه انتخاب کنید .
3. حال در پنجره ای که باز شده است ، Empty را انتخاب کنید ، تیک MVC را بزنید و در انتها Ok کنید .
4. روی نام پروژه خود در قسمت Solution Explorer کلیک راست کرده و یک New Folrder با نام Scripts به پروژه خود اضافه کنید . فولدر Scripts بصورت پیش فرض دارای یکسری فایل های Javascript و VBScript میباشد .
با همین روش فولدر دیگری با نام Content به پروژه اضافه کنید که شامل فایل های Css پروژه خواهد بود . همچنین شما نیاز به اضافه کردن دو فولدر دیگر برای images و fonts ، دارید . این فولدر ها را نیز به پروژه اضافه کنید . به فولدر HTML Template رفته و عکس های صفحه Html خود را در فایل images پروژه کپی کنید . این کار را برای دیگر فولدر ها هم نیز انجام دهید .
5. اضافه کردن HomeController :
روی فولدر Controller کلیک راست کرده و Add Controller را بزنید .
6. MVC 5 Controller - Empty را انتخاب کرده و Ok را بزنید .
در مرحله بعد شما باید نامی برای Controller انتخاب کنید . نام آن را HomeCotroller بگذارید . توجه داشته باشید که پسوند Controller همراه نام Controller هست و جز نام کنترلر محسوب نمیشود . در واقع نام کنترلر ما Home است .
8. HomeController.cs در برنامه ما شامل دو کنترل Index و About باید باشد .
فایل HomeController.cs را باز کنید ، با راست کلیک بر روی ActionResult میتوانید View اضافه کنید .
ActionResult>RightClick> Add views ...
فولدر Views فایل های (فایلهای HTML) مربوط به نمایش برنامه به کاربر (User Interface) را در خود دارد . این فایل ها ممکن است بسته به زبان محتوای ما دارای پسوند های html, asp, aspx, cshtml, و vbhtml باشند .
9. نام آن را دست نزنید . برای شروع فعلا Empty(Without model) template را انتخاب کنید . تیک
Use a layout page را بزنید .
بعد از add کردن ، در فولدر Views دو فولدر با نام های Home و Shared ساخته میشود . در Home ، فایل های View مربوط به HomeController ذخیره میشود و در Shared ، فایل هایی که در بین تمامی Controller ها به اشتراک گذاشته میشود ، قرار میگیرد .
10. در فایل Index.cshtml شما تمامی محتوای dynamic را در اینجا قرار میدهید .
اینجا قسمت RenderBody میباشد .
11. در فایل Layout.cshtml_ ، شما تمامی قسمت های Static پروژه را اضافه میکنید . همانند header و footer و ... .
تمامی لینک های موجود در بالای صفحه در تگ head را کپی کنید .
12. و در درون تگ header , footer ، body را قرار دهید . در بین تگ header و footer کد زیر را قرار دهید .
<div> @RenderBody() </div>
13. در اینجا یک چیز بسیار مهم دیگر نیز وجود دارد . شما باید یه جابجایی ای نیز انجام دهید .
ctrl +alt +h را بزنید و تغییرات بالا را به کمک این اعمال کنید .
بعد از اتمام این جابجایی ها کار ما به اتمام رسیده است و ما یک صفحه HTML را به یک صفحه ASP.Net تبدیل کردیم .
آموزش asp.net mvc
- ASP.net MVC
- 1k بازدید
- 5 تشکر