Webパーツよ、もっと目立て!!

久々ですね。相変わらずSharePoint2010が対象です。
SharePoint2007を使ったことがあるユーザーが2010を見ると色のメリハリがなく見難くなったとのご意見をよくいただきます。2013になったらもっと色は薄いですよ~って見せると、フォントサイズと余白のメリハリがしっかりしていて意外と好評。


ってことで、SharePoint 2010の画面を見やすくするためのチョイカスタマイズを紹介します。今回はWebパーツのタイトル部分の背景に色を付けてパーツの始まりを目立つようにしたいと思います。


結構ありふれたカスタマイズなので、一工夫して設定したテーマに合わせて色が変わるようにしてみました。方法はいろいろあると思うけど、パッと見のわかりやすさということで、jQueryを使っています。


<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
_spBodyOnLoadFunctionNames.push("getbgcolor");
function getbgcolor(){
var color = jQuery('div.s4-title').css('background-color');
jQuery('TR.ms-WPHeader').css('backgroundColor',color);
};
</script>

とりあえず、採用したい色を設定しているタグを探し、背景色を取得することから始めます。取得する方法はいくつかあると思うのですが、s4-titleクラスから取得することにしました。
次に取得した色をタイトルのセルを含むテーブルの行の背景 tr.ms-WPHeaderに設定します。


最後に適当な場所にコンテンツエディタWebパーツを設置し、このスクリプトを入力すればOK。


これで設置後にテーマを変更されても大丈夫ですね!!


Webパーツに影を付けたらかっこいいかも!!とか思ってるのですが、これについてはもうちょっと研究が必要なようです。



コメント

このブログの人気の投稿

SharePoint2010のカレンダーをカテゴリ別に色分けする

メールの整理

ガーデンライト買ったけど…