آموزش برنامه نویسی ، پایگاه داده sql server
آموزشگاه برنامه نویسی تحلیل داده : دوره های آموزشی برنامه نویسی و طراحی وب ASP.Net , C# , HTML , CSS , SQL Server


آموزشگاه برنامه نویسی مجتمع فنی تهران میرداماد : دوره های آموزشی برنامه نویسی و طراحی وب ASP.Net , C# , HTML , CSS , SQL Server

آموزش ASP.Net > تم و Skin در ASP.Net > تعیین تم برای صفحات ASP.Net

مقدمه :

در ویژوال استودیو ، می توانید برای صفحات ASP.Net خود تم ( Theme ) طراحی کرده و سپس آن را به صفحات مورد نظرتان یا کل وب سایت اعمال نمایید .
تم ها از مجموعه ای از فایل ها مثل استایل شیت ها ( فایل های CSS ) که ظاهر صفحه را مشخص کرده ، کنترل های Skin که ظاهر کنترل های سرور را تعیین نموده و یا سایر فایل ها و عکس هایی که می توانند نقشی در یک تم داشته باشند ، تشکیل می شود .
محتوای یک تم در هر حالت یکسان خواهد بود ، چه به صورت تم برای یک صفحه تعیین شده یا به عنوان تم برای کل یک وب سایت .
تم می تواند توسط خاصیت Theme یا StyleSheetTheme در بخش اعلان صفحه Page @ برای آن صفحه و یا در المنت Pages فایل web.config سایت ، برای کل یک وب سایت تعیین شود . ویژوال استودیو فقط تم هایی که توسط خاصیت StyleSheetTheme تعیین شده باشند را در حالت Design صفحه نمایش می دهد .

نحوه طراحی یک تم برای صفحه :

  1. در منوی SolutionExplore ، بر روی نام وب سایت کلیک راست کرده و از گزینه Add ASP.NET Folder ، پوشه Themes را به سایت اضافه نمایید .
  2. پوشه App_Themes به سایت اضافه می شود . سپس ویژوال استودیو یک پوشه جدید را به عنوان فرزند برای پوشه App_Themes می سازد .
  3. برای پوشه جدید ایجاد شده یک نام دلخواه تعیین کنید . این نام همان نام تم بوده و در سطح برنامه توسط آن شناسایی می شود .
    برای مثال اگر پوشه را به صورت App_Themes\MyTheme\ بسازید ، MyTheme به عنوان نام تم شما تعیین خواهد شد .
  4. فایل های مورد نظر خود را برای تم از قبیل استایل شیت ها ( فایل های CSS ) ، کنترل های Skin ، تصاویر و ... را به پوشه آن اضافه نمایید .

اضافه کردن یک فایل Skin و یک Skin به تم :

  1. بر روی پوشه تم مورد نظرتان در منوی SolutionExplorer ، کلیک راست کرده و گزینه Add New Item را انتخاب کنید .
  2. در پنجره باز شده Add New Item ، گزینه Skin File را انتخاب کرده و نامی را برای آن تعیین نمایید . سپس گزینه Add را بزنید .
    نکته : روش معمول این اسنت که برای هر نوع کنترل در صفحه ، یک فایل Skin بسازید . برای مثال Button.skin یا Calendar.skin و ... . ولی می توانید فقط یک فایل skin نیز ساخته و ویژگی های تمامی کنترل ها را در آن تعیین کنید .
  3. در فایل skin مورد نظرتان ، خواص لازم را برای کنترل های موجود تعیین نمایید . کد هر کنترل بایستی شامل خواص مورد نظر برای آن به همراه خاصیت runat = " server " بوده و نباید شامل خاصیت DI باشد .
    برای مثال ، کد زیر ، نحوه تعریف خواص برای کنترل Button را نشان می دهد :
    کد
    VB
    <asp:Button ID="Button1" runat="server"
         BackColor="Red"
         ForeColor="White"
         Font-Name="Arial"
         Font-Size="9px" />

    کد skin فوق برای تمام کنترل های Button موجود در صفحه یا سایت که از تم استفاده می کنند ، اعمال می شود . مگر اینکه برای یک کنترل خاص توسط خاصیت SkinID یک Skin مخصوص تعریف کنید .
  4. مراحل فوق را برای کنترل های دیگری نیز که در صفحه دارید ، انجام دهید .

اضافه کردن فایل های استایل شیت CSS به تم :

  1. در منوی SolutionExplorer ، بر روی نام تم کلیک راست کرده و گزینه Add New Item را انتخاب نمایید . سپس گزینه Style Sheet را کلیک کنید .
  2. در پنجره باز شده ، نامی را برای فایل CSS تعیین کرده و گزینه Add را بزنید .
  3. خواص مورد نظر خود را در فایل CSS تعیین نمایید . این خواص به تمامی صفحاتی که از تم استفاده می کنند ، اعمال خواهد شد .

ایجاد تم های سراسری( Global Themes ) برای تمام یک سایت یا پروژه :

یک تم سراسری ( Global ) به تمام وب سایت های موجود بر روی یک سرور اعمال می شود و مکانی که برای پوشه تم سراسری انتخاب می کنید ، به این بستگی دارد که شما سایت را براساس IIS ویندوز اجرا کرده یا سرور مجازی  ASP.NET Development Server .
نکته : اگر شما از وب سایت های File System استفاده می کنید ( پیش فرض ویژوال استودیو و ASP.Net ) ، ویژوال استودیو برای تست و اجرای سایت ها از سرور مجازی ASP.Net یا ( ASP.NET Development Server ) استفاده می کند . اما در سایر انواع وب سایت های ASP.Net ، ویژوال استودیو از IIS ویندوز برای اجرای صفحات بهره می گیرد .

نحوه ساخت یک تم سراسری ( Global ) :

  1. یک پوشه برای Theme مورد نظر در مسیر زیر ایجاد نمایید :

    مسیر %windows%\Microsoft.NET\Framework\version\ASP.NETClientFiles\Themes

    نکته : نام پوشه برای تم های سراسری Themes است ، نه App_Themes ، برخلاف مثال های قبل .
    یک پوشه فرزند را در مسیر تعیین شده بسازید . پوشه ایجاد شده برای نگهداری فایل های تم به کار می رود . نامی که برای این پوشه تعیین می کنید ، نام تم بوده و در سطح برنامه از آن استفاده می شود .
    برای مثال اگر نام پوشه را \Themes\MyTheme \ بگذارید ، نام تم شما MyTheme خواهد بود .
  2. فایل های استایل شیت ( CSS ) ، فایل های Skin ، تصاویر و ... را به پوشه تم خود اضافه نمایید .
  3. اگر وب سایت شما از سیستم File System ( سیستم پیش فرض ASP.Net ) برای اجرای صفحات استفاده می کند ، بنابراین اکنون تم شما برای تست آماده است ( Ctrl + F5 را فشار دهید . سایت بالا می آید ) .
  4. اما اگر از IIS ویندوز بهره می گیرد ، در خط فرمان ویندوز عبارت aspnet_regiis -c را تایپ کرده و اجرا نمایید ، تا بتوانید تم را بر روی سرور نصب کرده و امتحان کنید .
  5. در نهایت اگر سایت را بر روی یک سرور راه دور ( remote server ) یا FTP اجرا می کنید ، شما بایستی به صورت دستی یک پوشه Themes را از طریق مسیر زیر بسازید :
    مسیر IISRootWeb\aspnet_client\system_web\version\Themes


راجع این مطلب سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...         >>>>>  ورود به انجمن تخصصی


نطر خودتان درباره این صفحه را با ما در میان گذاشته و در صورت تمایل از Developer1 حمایت نمایید :

آیا مطالب این صفحه برای شما مناسب و مفید بوده است :

نام :                 
آدرس Email :    
 
نظر شما :  
 
سوال امنیتی : پایتخت ایران ؟      
حمایت از سایت Developer1