Bootstrap3 スキン

この「Bootstrap3」は、レスポンシブデザインに対応したスキンです。タブレット端末やスマートフォンなどのモバイル端末で快適に使えることを考えて設計されていますが、デスクトップでも利用可能です。

Bootstrap3スキンのイメージ

このスキンは、標準ではTeamPageに含まれていませんが、TeamPageのサポートサイトからプラグインとしてダウンロードできます。お使いのTeamPageにインストールしてご利用ください。

シンプルにも複雑にも

シンプルな標準設定

外出先でスマートフォンを使う場面では、最新の状況をすばやく確認し、簡単に返信ができることが重要です。

そこで、すべてのスレッドが最新順(コメントの付いた順)に並ぶ画面を初めに表示し、TeamPage内の「動きのあったスレッド」を見つけて読んだり、必要に応じてコメント等の次のアクションを起したりできるように設定されています。これは、jQuery モバイル スキンと同じ動作・設定です。

シンプルな、最新スレッド確認用画面

カスタマイズして多機能に

後述するカスタマイズ設定で、「最新スレッド」「最新投稿」「タスク」「プロジェクト」「近況」などのタブを表示し、画面に表示する内容をタブで切り替えられるようにできます。

タブを表示して切り替え

例えば、自分が担当する案件(プロジェクト)一覧の中から目的のものを見つけ、タスクにコメントしたり近況アップデートを投稿したりして、案件の最新状況を更新することも簡単にできます。

レスポンシブ デザイン

アクセスするデバイスやブラウザの解像度(横幅)によって、スキンのデザインが自動的に変化します。

横幅が長い場合

画面の広いデスクトップやiPadなど、横幅が768ピクセル以上ある場合は、サイドカラム(サイドバー)が表示されます。下図はiPadのSafariで表示した例です。

iPadのSafariで表示

横幅が短い場合

iPhoneなどの横に短いデバイスで表示すると、サイドカラム(サイドバー)は画面の下(メインカラムの下)へと移動します。また、画面上部のナビゲーションバーが簡略表示されます。下図は iPhone5S の Safari で表示した例です。

iPhone5Sで表示した例

メールとの連携

メールで投稿する

モバイル端末用のブラウザではリッチテキストエディタが動作しないなど制限が生じることがあるため、このスキンでは、記事、コメント、タスク、予定などをメールで投稿できるように設計されています。(フォームを使用しての投稿もできます)

コメント投稿するボタンをタップまたはクリックすると、メールのアプリが起動します。送信先アドレスや投稿先スペースは自動的に判別され、メールに適用されます。

コメントをメールで投稿する

メールで通知を受ける

自分宛の @メンション が投稿されたとき、自分が投稿した記事に誰かがコメントしたとき、自分が担当するタスクにコメントやタグが追加されたとき、自分が参加予定の予定が変更されたときなど、メールで通知を受けられます。

通知メールに返信する

通知メールにメールで返信すると、その返信メールは元記事のコメントとして投稿されます。

カスタマイズ

管理者やユーザーは、スキンの表示や動作をカスタマイズできます。以下、カスタマイズ項目の一部を紹介します。

色テーマの変更

色テーマを変更

サイドバーの位置

サイドバーの位置を左へ変更

サイドバーのボックス表示

サイドバーに表示される「通知」「検索」「タグ」などのボックスを表示するかどうかを設定できます。

タブ設定

上述のように、タブの表示/非表示や順番を設定できます。

CSS 設定

色テーマ毎に追加のCSS設定ができ、画面デザインの細かなところまで変更できます。

メール投稿タイトル設定

メールで投稿するときのタイトル(件名)のテンプレートを設定できます。

関連記事

TeamPage iOS アプリ ... iPhone や iPad 用のアプリです。モバイルに最適化された画面をスクロールして、自分宛の通知を確認したり、最新のスレッドやコメントを読んだりできます。このアプリは、Appleの iOS App Store から無料でインストールして使用できます。

jQuery モバイル スキン ... iPhone や Android など、画面の狭いスマートフォン用のスキンです。最新スレッドをチェックするのに適しています。

Page Top