kintoneのお知らせ掲示板のカスタマイズ方法を解説！ポータル・スペース画面をより便利に！

kintoneを長く利用していくと、使用するアプリが増えていき、日報や案件管理、顧客管理のような頻繁に使うアプリを探すことが手間になってしまいますよね。
そんな時は、kintoneのトップページであるポータルの「お知らせ掲示板」をカスタマイズすることで、頻繁に使うアプリのリンクをポータルに集約することができ、アプリを探す手間を省くことができます。

また、売上や予実管理など、重要なデータをお知らせ掲示板に表示させることで社内のメンバーに常に共有することも可能になります。
そこで本記事では、ポータルの使い勝手を向上させるための「お知らせ掲示板のカスタマイズ方法」について解説いたします。

「ポータル画面をもっと綺麗に整えたい！」という方はぜひこちらの記事を参考にカスタマイズしてみてください！

この記事でわかること

• kintoneのお知らせ掲示板によく使うアプリのショートカットを作る方法
• kintoneのお知らせ掲示板にグラフを表示させる方法

こんな人に向いている記事です

• kintoneのお知らせ掲示板に頻繁に使うアプリに集約し、利便性を高めたい方
• お知らせ掲示板にグラフ表示をさせ、重要なデータの共有を行いたい方

ポータルとは、kintoneの入り口の役割を持つページ

ポータルとはkintone(キントーン)を開くと最初に表示されるページのことで、kintoneの入り口の役割を担っています。
ポータルには、使用したいアプリやスペースへの遷移、レコードの更新・チャットなどの通知確認、タスク確認、社内への情報共有、などの多くの機能があります。

また、kintone内のアプリ・レコード・スペースなどのデータを検索することができる検索ボックス機能もついています。

また、ポータル画面はスペースごとに持つこともできます。
例えば、営業部のスペースであれば、お知らせ掲示板で売上予算の達成度合いを表示させる、といったように部門やチームごとに合わせたポータルの構築をすることで、重要な情報を常に表示させることができます。

このように、ポータル画面はkintone利用者がkintone内でも開く回数の多いページの1つとなっているため、毎日使う勤怠アプリの設置やタスクの納期表示など、ポータルのコンテンツを充実させることが、業務効率の改善に繋がります。

しかし、kintoneのポータル画面は、やや無機質であるため使いづらいという方もいらっしゃるかと思います。
そこで、次のセクション以降では、ポータル画面にある「お知らせ掲示板」をカスタマイズすることで、kintoneの使い勝手を良くする方法をご紹介します。
本格的にポータルの見た目をカスタマイズするとなると、JavaScriptなどのプログラミング言語の知識が必要ですが、今回ご紹介する方法であれば、非エンジニアの方であっても簡単に行うことができます。

※お知らせを編集するためには、kintoneのシステム管理権限または各スペースの管理権限が必要です。

kintoneのお知らせ掲示板に、よく使うアプリ一覧を表示させる方法を紹介！

このセクションでは、お知らせ掲示板に、日報や案件管理など頻繁に利用するアプリへのリンクをアイコン付きの直感的なデザインにカスタマイズする方法をご紹介します。

標準機能のみでアプリのリンクを貼ってしまうと、下記の画像の通りリンクの羅列になってしまい、少々使いづらい見た目となってしまいます。

kintoneの使い方を工夫すれば、プラグインやプログラミングの必要なく、このようなアイコン付きの直感的にアプリへアクセスすることができるリンクを作成することが可能です。

では、詳しい設定方法を見ていきましょう。

お知らせ掲示板にワードで作成した表を挿入

では早速、ポータルのお知らせ掲示板のカスタマイズ方法を解説していきます。
通常は、テキストの文字色・背景色の変更くらいしかできないため、テキストのみの見づらい画面となってしまいますが、なんとマイクロソフトの「ワード」を利用することで、お好みのアイコンを使用した使いやすいアプリリンクが作成できてしまうのです。

まずワードを開き、挿入タブから表を選択して、行×列を必要数選択します。
また、必要であれば、表のスタイルを変更していただいても構いません。

表示したいアイコンを挿入し、よく使うアプリのリンクを設定

①お知らせ掲示板の編集画面を開きます。

②ワードで作成した表をコピーし、お知らせ掲示板の編集画面に貼り付けます。

③クリップアイコン(添付ファイル)から、表の中にアイコンにしたい画像を添付します。

kintoneアプリのアイコンはこちらのサイトから取得するのがおすすめです！
任意のアプリ名でアイコンを作成することもできます。

④添付したアイコンにカーソルを合わせるとサイズ変更のメニューが表示されますので、アイコンのサイズを任意の大きさに変更します。
今回は100pxにしました。

⑤アイコンを選択した状態で、リンクアイコンをクリックし、表示させたいアプリのリンクを設定します。

この時、タイトルは入れずに「リンク先のWebサイトのアドレス」にアプリのURLを入力してください。
「リンク先を新しいタブで開く」にチェックを入れておくと、ポータル画面とは別のタブでアプリを開けます。

リンクを編集したいときには、アイコンをクリックするとメニューが表示されます。

⑥必要であれば、アイコンの下に文字のリンクも追加してください。

これで、リンクアイコンが設定できました！

たったこれだけで、よく使われるアプリのリンクが集約された、綺麗なお知らせ掲示板を作成することができます。

ひとつポイントとして、例えば日報等の「毎日入力をしてもらうアプリ」の場合には、リンクのアドレスの末尾を「/edit」にするとアプリを開いたら直接入力画面になります。
アプリに遷移してプラスボタンを押して……という手順を踏まなくてもよくなりますので、「日報登録」のリンクの場合には是非/editのURL指定しましょう！

グラフや一覧表で、重要なデータを常に社内共有

部門やチームごとのスペースにおけるお知らせ掲示板では、アプリのリンク集約だけでなく、重要なデータが共有されていることも、利便性の向上に繋がるかと思います。
営業部であれば、その月の売上のグラフを常に表示させる、など常に共有しておきたいデータを表示させることで、部門の状況をすぐに把握することができます。

本セクションでは、kintoneアプリのグラフや一覧表をお知らせ掲示板に表示させる方法を紹介します。

お知らせ掲示板にグラフや一覧表を表示する方法

①ポータル内のお知らせ掲示板の編集ボタンをクリックします。

②編集画面内の「アプリ貼り付け」をクリックします。

③アプリを選択し、アプリであらかじめ作成して置いたグラフもしくは一覧表を選択し、OKをクリックします。

④アイコン同様、表示幅を調整することができますので、任意の大きさを指定しましょう。

④その後「保存」をクリックします。

⑤これでお知らせ掲示板に表示されます。

アプリ内のグラフ同様、集計結果をクリックすることで集計対象のレコード一覧に遷移できます。

お知らせ掲示板にグラフや一覧表を表示させるには、事前にアプリ内で作成しておく必要があります。
一覧の絞り込み条件を工夫することで、例えば「未対応の問い合わせをお知らせに表示して対応漏れが無いようにする」等が可能です。

具体的なグラフの設定方法はこちらの記事で解説しています！
▼kintoneで売上管理を実現！アプリの作り方やグラフ設定方法を解説

ポータルカスタマイズ番外編：ポータルにアラートを表示したい！

kintoneでは、標準機能で通知を出すことができます。
例えば、契約期間が過ぎているにも関わらずステータスが契約中のままになっているレコードや、最終対応日から2週間以上そのままになっている問い合わせ等、「次の対応が必要なもの」を「対応すべき人」に通知することができるのです。

通知はポータルページのお知らせ掲示板の下に表示されますが、kintoneのアプリが増えてくるにつれて通知も増え、もはや通知が通知として機能していない……そんな企業さまも少なくないのではないでしょうか？

そんな時におすすめしたいのが「絶対に対応しないとまずいものだけ、お知らせ掲示板のさらに上、kintoneに入れば目につくところに表示する」カスタマイズです。
このカスタマイズを行うと、ポータルページに点滅するアラートを表示することができます。

画像では伝わりませんが、点滅しています！

このカスタマイズは、コムデックラボおなじみのTIS社製「ポータル内アプリ表示プラグイン」を活用します。
具体的な設定方法をご紹介しますので、「絶対に見逃したくないアラート」をkintoneポータルに表示したい方は試してみてください！

1．プラグインを入れる空のアプリを作る

ポータル内アプリ表示プラグインは、アラートを出す対象のアプリにインストールするのではなく、別途空のアプリを用意する必要があります。
フィールドは必要ありませんので、「はじめから作成」で、アプリ名だけ変更したら「設定」タブを開きます。

2．アプリにポータル内アプリ表示プラグインを追加

ポータル内アプリ表示プラグインをアプリの設定画面から追加し、設定画面を開きます。

3．出したいアラートの詳細設定

対象のアプリと一覧、ボタンに表示したいメッセージとアラート条件を指定します。
今回は、「問い合わせ管理」アプリの未対応の問い合わせ一覧の中で、受付日が先週より前のレコードがあればポータルに「未対応の問い合わせがあります」とボタンを表示し、なおかつ赤色で点滅するように設定しました。

4.jsファイルを書き出す

ここまで設定できたら、「ファイルを書き出し」をクリックしてjsファイルを書き出します。
zipファイルがダウンロードされるので、保存してください。書き出したzipファイルは解凍しておきましょう。

5.kintoneシステム管理からjsを登録

右上の歯車アイコンから「kintoneシステム管理」を選択し、「JavaScript/CSSでカスタマイズ」をクリックします。

PC用のJavaScriptファイルに、先ほどダウンロードして解凍したjsファイルを「アップロードして追加」し、保存しましょう。

ポータルにアラートが表示されました！

矢印の部分をクリックすると、アプリ画面に遷移するのではなく、あくまでポータル上で該当のレコードを確認・編集することが可能です。

お知らせ掲示板をカスタマイズして見やすいポータル作りを

今回は、kintoneのお知らせ掲示板のカスタマイズ方法について解説いたしました。
kintoneのポータル画面は、全ての機能の入り口となり、業務の中で何度も訪れるページであるため、見た目の良さや使い勝手が重要です。

しかし、通常の方法では、文字色や背景色の装飾しかできません。
とはいえ、JavaScriptを利用した本格的なカスタマイズはプログラミングの知識が必要であるため、敷居が高いものとなっております。

今回ご紹介した方法は、ポータルの中でも「お知らせ掲示板」のカスタマイズに留まりますが、ワードを利用するだけで、想像以上に簡単にリッチな見た目に変更することが可能です。
ポータル画面のカスタマイズの第一歩として、ぜひ試してみてはいかがでしょうか？