آموزش ASP.Net > تم و Skin در ASP.Net > تعیین تم برای صفحات ASP.Net
مقدمه :
در ویژوال استودیو ، می توانید برای صفحات ASP.Net خود تم ( Theme ) طراحی کرده و سپس
آن را به صفحات مورد نظرتان یا کل وب سایت اعمال نمایید .
تم ها از مجموعه ای از فایل ها مثل استایل شیت ها ( فایل های CSS ) که ظاهر صفحه را مشخص کرده ، کنترل های Skin که ظاهر
کنترل های سرور را تعیین نموده و یا سایر فایل ها و عکس هایی که می توانند نقشی در
یک تم داشته باشند ، تشکیل می شود .
محتوای یک تم در هر حالت یکسان خواهد بود ، چه به صورت تم برای یک صفحه تعیین شده یا
به عنوان تم برای کل یک وب سایت .
تم می تواند توسط خاصیت Theme یا StyleSheetTheme در بخش اعلان صفحه Page @ برای آن
صفحه و یا در المنت Pages فایل web.config سایت ، برای کل یک وب سایت تعیین شود . ویژوال
استودیو فقط تم هایی که توسط خاصیت StyleSheetTheme تعیین شده باشند را در حالت Design
صفحه نمایش می دهد .
نحوه طراحی یک تم برای صفحه :
- در منوی SolutionExplore ، بر روی نام وب سایت کلیک راست کرده و از گزینه Add ASP.NET
Folder ، پوشه Themes را به سایت اضافه نمایید .
- پوشه App_Themes به سایت اضافه می شود . سپس ویژوال استودیو یک پوشه جدید را به عنوان
فرزند برای پوشه App_Themes می سازد .
- برای پوشه جدید ایجاد شده یک نام دلخواه تعیین کنید . این نام همان نام تم بوده و در
سطح برنامه توسط آن شناسایی می شود .
برای مثال اگر پوشه را به صورت App_Themes\MyTheme\ بسازید ، MyTheme به عنوان نام
تم شما تعیین خواهد شد .
- فایل های مورد نظر خود را برای تم از قبیل استایل شیت ها ( فایل های CSS ) ، کنترل های Skin ، تصاویر و ... را به پوشه
آن اضافه نمایید .
اضافه کردن یک فایل Skin و یک Skin به تم :
- بر روی پوشه تم مورد نظرتان در منوی SolutionExplorer ، کلیک راست کرده و گزینه Add
New Item را انتخاب کنید .
- در پنجره باز شده Add New Item ، گزینه Skin File را انتخاب کرده و نامی را برای آن
تعیین نمایید . سپس گزینه Add را بزنید .
نکته : روش معمول این اسنت که برای هر نوع کنترل در صفحه ، یک فایل
Skin بسازید . برای مثال Button.skin یا Calendar.skin و ... . ولی می توانید فقط یک
فایل skin نیز ساخته و ویژگی های تمامی کنترل ها را در آن تعیین کنید .
- در فایل 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 مخصوص تعریف کنید .
- مراحل فوق را برای کنترل های دیگری نیز که در صفحه دارید ، انجام دهید .
اضافه کردن فایل های استایل شیت CSS به تم :
- در منوی SolutionExplorer ، بر روی نام تم کلیک راست کرده و گزینه Add New Item را
انتخاب نمایید . سپس گزینه Style Sheet را کلیک کنید .
- در پنجره باز شده ، نامی را برای فایل CSS تعیین کرده و گزینه Add را بزنید .
- خواص مورد نظر خود را در فایل CSS تعیین نمایید . این خواص به تمامی صفحاتی که از تم
استفاده می کنند ، اعمال خواهد شد .
ایجاد تم های سراسری( Global Themes ) برای تمام یک سایت یا پروژه :
یک تم سراسری ( Global ) به تمام وب سایت های موجود بر روی یک سرور اعمال می شود و
مکانی که برای پوشه تم سراسری انتخاب می کنید ، به این بستگی دارد که شما سایت را براساس
IIS ویندوز اجرا کرده یا سرور مجازی ASP.NET Development Server .
نکته : اگر شما از وب سایت های File System استفاده می کنید ( پیش
فرض ویژوال استودیو و ASP.Net ) ، ویژوال استودیو برای تست و اجرای سایت ها از سرور
مجازی ASP.Net یا ( ASP.NET Development Server ) استفاده می کند . اما در سایر انواع
وب سایت های ASP.Net ، ویژوال استودیو از IIS ویندوز برای اجرای صفحات بهره می گیرد
.
نحوه ساخت یک تم سراسری ( Global ) :
- یک پوشه برای Theme مورد نظر در مسیر زیر ایجاد نمایید :
|
مسیر
|
%windows%\Microsoft.NET\Framework\version\ASP.NETClientFiles\Themes
|
نکته : نام پوشه برای تم های سراسری Themes است ، نه App_Themes ،
برخلاف مثال های قبل .
یک پوشه فرزند را در مسیر تعیین شده بسازید . پوشه ایجاد شده برای نگهداری فایل های
تم به کار می رود . نامی که برای این پوشه تعیین می کنید ، نام تم بوده و در سطح برنامه
از آن استفاده می شود .
برای مثال اگر نام پوشه را \Themes\MyTheme \ بگذارید ، نام تم شما MyTheme خواهد بود
.
- فایل های استایل شیت ( CSS ) ، فایل های Skin ، تصاویر و ... را به پوشه تم خود اضافه
نمایید .
- اگر وب سایت شما از سیستم File System ( سیستم پیش فرض ASP.Net ) برای اجرای صفحات
استفاده می کند ، بنابراین اکنون تم شما برای تست آماده است ( Ctrl + F5 را فشار دهید
. سایت بالا می آید ) .
- اما اگر از IIS ویندوز بهره می گیرد ، در خط فرمان ویندوز عبارت aspnet_regiis -c را
تایپ کرده و اجرا نمایید ، تا بتوانید تم را بر روی سرور نصب کرده و امتحان کنید .
- در نهایت اگر سایت را بر روی یک سرور راه دور ( remote server ) یا FTP اجرا می کنید
، شما بایستی به صورت دستی یک پوشه Themes را از طریق مسیر زیر بسازید :
|
مسیر
|
IISRootWeb\aspnet_client\system_web\version\Themes
|
راجع این مطلب
سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...
>>>>> ورود به انجمن تخصصی
نطر خودتان درباره این صفحه را با ما در میان گذاشته و در صورت تمایل از Developer1
حمایت نمایید :