Title: ダッシュボード最大 4 セクション サポート プラグイン

Proteus スキンのダッシュボード画面には、セクションの幅を [小] に設定しても、実際の画面には幅が 50% （つまり [中] と同じ）で表示されてしまうという制限事項があります。

この制限を回避するには、Forum1196 を使用して記事の中に 4 つのセクションを作り、その記事をダッシュボードに表示する、という手間のかかる方法を採る必要がありました。

当プラグインを使用すると、幅が [小] に設定されたセクションは 25% 幅で表示されるようになり、幅 [小] のセクションを最大で 4 つ横に並べて表示できるようになります。



インストール



下のリンクをクリックしてプラグインの .zip ファイルをダウンロードします。



サーバー管理者として TeamPage にログインし、サーバーセットアップ > プラグイン ページ下部の [新規プラグインのインストール] で .zip ファイルを選択してアップロードします。

アップロードされると、インストール済みプラグイン一覧に「@dashboard4sections#plugin_display_name」と表示されます。これは、プラグインの中の日本語ファイルがまだ読み込まれていないために表示されているだけで、TeamPage を再起動して日本語ファイルを読み込むことで解消されます。



[サーバーセットアップ] > [一般] > [サーバー管理] の [TeamPage の再起動] をクリックして TeamPage を再起動させます。TeamPage クラウド環境では再起動が 2 回必要ですので、1 回目の再起動が完了後にもう一度再起動を行ってください。

再起動が完了したら、サーバーセットアップ > プラグイン のインストール済みプラグイン一覧に [ダッシュボード最大 4 セクション サポート] と表示されることを確認します。



以上でインストールは完了です。

使い方



基本動作



4 列表示



サーバーセットアップ > フロントページ や スペースセットアップ > ダッシュボード などのセクション設定の [幅] 設定で [小] を選択します。

参考記事: FAQ2066: セクション設定ガイド

セクションの幅を「小」に変更

ここでは、下図の 4 つのセクションの幅を [小] に変更します。





ダッシュボードの 1 行に入れられる最大のセクション数は「小が 4 つ」なので、4 等分した 25% がそれぞれのセクションに幅になり、下図のように、横に 4 つのセクションが並んで表示されます。

1行に4つのセクションを表示

3 列表示



4 番目のセクションの幅を [中] にしてみます。

4番目のセクションの幅を「中」に変更

1 行に収まるセクションの最大数は「小が 4 つ」なので、4 番目の幅 [中] のセクションは最初の行に収まらず、次の行に収まることになります。

4番目のセクションの幅を「中」に変更

ブラウザーのウィンドウ幅が狭いときの動作



幅 [小] セクションが幅 [中] で表示される場合



既定で、ブラウザーのウィンドウ幅が 1024px 以下になると、幅 [小] のセクションは幅 50% 表示（つまり [中] と同じ）になります。

例えば、ウィンドウ幅が 1024px 以上の場合、幅 [小] のセクションは横に 4 つ並びます。



ウィンドウ幅を 1024px 以下にすると、幅は [中] と同じ 50% になり、各行に 2 つずつ収まります。（3 番目と 4 番目のセクションが 1 行目に収まらず、2 行目に落ちます。）



幅 [小] セクションが幅 [大] で表示される場合



下図のように、幅 [小] のセクションを 3 つ置き、その次に幅 [大] のセクションを置くとします。



ブラウザーのウィンドウ幅が 1024px 以上の場合、下図のように、1 行目に [小] が 3 つ、2 行目に [大] が 1 つ表示されます。



ウィンドウ幅を 1024px 以下にすると、幅 [小] のセクションの幅は 50% （つまり [中] と同じ）になります。そのため、3 番目の幅 [小] のセクションは 1 行目に収まらず、下の行に落ちます。

しかし、下の行には幅 [大] のセクションが幅 100% で収まっており、そこ落ちてきた 3 番目セクションを収める余裕がありません。

したがって、1 行目に収まらず下の行にも収まることのできない 3 番目セクションは、新たな 2 行目に幅 100% に広がって（つまり幅 [大] と同じ）表示されます。



すべてのセクションが幅 [大] で表示される場合



既定で、ブラウザーのウィンドウ幅が 768px 以下になると、すべてのセクションの幅が 100% （つまり [大] と同じ）になり、横いっぱいに広がって表示されます。



プラグイン設定



プラグイン設定画面を表示するには、サーバーセットアップ > プラグイン のページで、当プラグインの [設定] リンクをクリックします。



[ウィンドウ幅でセクションのレイアウトを自動変更する] で [いいえ] を選択すると、上述の、ウィンドウ幅による自動レイアウト変更が無効になります。

自動レイアウト変更を無効にすると、幅 [小] のセクションはブラウザーのウィンドウ幅を狭めても 25% 幅で、幅 [中] のセクションは幅 50% で表示されます。

また、[ウィンドウ幅でセクションのレイアウトを自動変更する] で [はい] が選択されている場合（自動レイアウト変更が有効な場合）の、レイアウト変更が行われる閾値を [ウィンドウの幅の閾値 (1)] と [ウィンドウの幅の閾値 (2)] で設定できます。



関連記事



Forum1196

FAQ156: 記事の中にセクションを作るにはどうすればよいですか

FAQ2066: セクション設定ガイド

FAQ2161: Proteus スキンで、セクションを3列や4列で表示するには



Attachments:
i18n_error.png
installed_ja.png
dashboard_01.png
dashboard_02.png
dashboard_03.png
dashboard_04.png
dashboard_05.png
dashboard_06.png
dashboard_07.png
dashboard_08.png
dashboard_09.png
dashboard_10.png
dashboard_11.png
configure_ja.png
dashboard_12.png
関連記事
参照している (3)
FAQ2161: Proteus スキンで、セクションを3列や4列で表示するにはFAQ2066: セクション設定ガイドFAQ156: 記事の中にセクションを作るにはどうすればよいですか
Article: Download2369 (permalink)
Categories: :DocJp:プラグイン, :Visitor:お知らせ
Date: 2019/10/25; 2時17分49秒 JST

Author Name: TeamPage サポート
Author ID: jpbo