مهدي شيخي (Mahdi Sheikhi)

ترفندی برای کار بر روی کلاسهای CSS در شیرپوینت

اين روزها طراحي  گرافيكي صفحات در شرپوينت بسيار گسترش يافته و اكثر سايتهاي شرپوينتي ديگر صورت قديمي استاندارد شرپوينت را ندارند .در اين خصوص ميتوانيد پست آرش را در زمينه سايتهاي برتر طراحي شده با شرپوينت را اينجا بخوانيد . 
همانطور كه ميدانيد استفاده از CSS در طراحي گرافيكي سايتها بسيار متداول است در اين پست چند ترفند در خصوص دستكاري كردن كلاسهاي خود شرپوينت عنوان ميكنم .

ابتدا با قرار دادن تكه كد زير در صفحه ASPX ميتوانيد متوجه شويد كه اسم كلاس مورد نظر هر كدام از اجزاء صفحه چيست ؟

<script language="jscript">
function ClassInfo()
{
    if (window.event.srcElement.className != null)
    {
        stsclass.innerText = window.event.srcElement.className;
    }
    else
    {
        stsclass.innerText = "";
    }
}
 
window.document.body.onmouseover = ClassInfo;
 </script>
<div style="border-style:solid;border-width:1px; width: 281px; height: 34px; 
position: absolute; left: 286px; top: 41px; z-index:15; padding-left:4px; 
padding-right:4px; padding-top:2px; padding-bottom:2px; background-color:#EEEEF4">
position: absolute; left: 286px; top: 41px; z-index:15; padding-left:4px; 
padding-right:4px; padding-top:2px; padding-bottom:2px; background-color:#EEEEF4">
<p id="stsclasstitle"><font face="Tahoma" id="stsclasstitle">Classname: </font>
<font face="Tahoma"id="stsclass">&#xa0;</font>
</p></div>

بعد از انجام اين كار با بردن ماوس روي هر يك از اجزاء نام كلاس CSS آنها طبق شكل زير نمايش داده ميشود.

نكته مهمي كه ميتوان اشاره كرد اين است كه تغيير مستقيم در كلاسهاي CSS شرپوينت موجب ميشود كه اين تغييرات در كل سايتها و زير سايتها اعمال شود حال براي جلوگيري از اين تاثير ميتوان با استفاده از ترفند CSS  اين تغييرات در بصورت موقتي در سطح يك صفحه انجام داد.  اين كار با استفاده از keyword !important در CSS انجام ميشود استفاده از  اين keyword به شما اين امكان را ميدهد كه تعاريف قبلي اين كلاسها را به نوعي رونويسي كنيد . براي نمونه در زير فونت CSS كلاسي با نام SampleClass تغيير پيدا كرده است.

<style type="text/css">
 .SampleCSSClass
{
    font-family:Tahoma !important;
}
</style>

حال ميتوانيد كلاسهاي مورد نظر را تغيير دهيد . اگر خواستيد فايلهاي CSS شرپوينت را تغيير دهيد يا ببينيد ميتوانيد در مسيرهاي زير آنها را پيدا كنيد :

Drive:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\1033\STYLES

Drive:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\FEATURES\PublishingLayouts\en-us

اطلاعات كاملي در خصوص كلاسهاي CSS در WSS را ميتوانيد در اين آدرس مطالعه كنيد.
http://msdn.microsoft.com/en-us/library/ms438349.aspx

موفق باشيد.