local」に変更します。
Proteus.addHandler("load", function() {
$('#body a').each(function() {
var oldHref = $(this).attr('href');
if (oldHref) {
var newHref = oldHref.replace('electra.local','nadia.local');
$(this).attr('href', newHref);
}
});
});
画像のソースも同様に変更できます。
Proteus.addHandler("load", function() {
$('#body img').each(function() {
var oldSrc = $(this).attr('src');
if (oldSrc) {
var newSrc = oldSrc.replace('electra.local','nadia.local');
$(this).attr('src', newSrc);
}
});
});
JavaScript (2) タブ メニューの文字を画像に置き換える
画面上部に表示される [ダッシュボード] [近況] などのタブの文字を画像（アイコン）に置き換えます。
まずは画像を用意する必要があります。ここでは Icon Archive で公開されている Small-n-Flat Icons を利用することにします。
TeamPage がインストールされている「server」フォルダ下の「images」フォルダに「small-n-flat」フォルダを作成し、ダウンロードした画像ファイルを置きます。
サーバーセットアップ > 一般 > サーバー管理 ページの [キャッシュクリア] ボタンをクリックして、設置した画像ファイルを TeamPage に認識させます。
次のコードをプラグインの [JavaScript] 欄に記入します。
Proteus.addHandler("load", function() {
$('#primary-tabs li.tab-dashboard a').html('<img src="/images/small-n-flat/dashboard-alt-icon.png" height="32" width="32" alt="ダッシュボード">');
$('#primary-tabs li.tab-activity a').html('<img src="/images/small-n-flat/sign-down-icon.png" height="32" width="32" alt="アクティビティ">');
$('#primary-tabs li.tab-status a').html('<img src="/images/small-n-flat/bubbles-alt-icon.png" height="32" width="32" alt="近況アップデート">');
$('#primary-tabs li.tab-tags a').html('<img src="/images/small-n-flat/tag-icon.png" height="32" width="32" alt="タグ">');
$('#primary-tabs li.tab-tasks a').html('<img src="/images/small-n-flat/sign-check-icon.png" height="32" width="32" alt="タスク">');
$('#primary-tabs li.tab-cal a').html('<img src="/images/small-n-flat/calendar-icon.png" height="32" width="32" alt="カレンダー">');
$('#primary-tabs li.tab-docs a').html('<img src="/images/small-n-flat/folder-document-icon.png" height="32" width="32" alt="共有フォルダ">');
});
画面を最読み込みすると…じゃん！この通り！
CSS 通知の未読数バッジを赤くする
画面右上に表示される通知の未読数バッジ。デフォルトで背景と同系色なので、ちょっと目立ちにくいですよね。
これを赤くしてみましょう。次の CSS を記入します。
#hd .notifications-count {
background-color: crimson;
}
これでよく目立つようになりました。
まとめ
この他にも色々なカスタマイズ例をサポートサイトの「FAQ」スペースや「フォーラム」スペースで公開しています。
「こんなカスタマイズをしたいけど、方法がわからない」といったご質問や「こんなカスタマイズしたら便利だった」といった事例がありましたら、ぜひサポートサイトの「フォーラム」までお寄せください。
関連記事
バックスラッシュ記号を円記号として表示するには ... 日本語キーボードの「日本円」キーを押して入力される文字は、既定でバックスラッシュ記号として表示されます。その背景と解決方法を紹介します。
