kintoneポータルにアイコンを配置しよう！
2024.7.5
Share!
本記事では、こだわり kintone プラグインでアイコンを配置するための操作方法と、アイコンの表現パターンをご紹介します。
使用頻度の高いkintoneアプリや、社内で活用しているツールへのリンクをポータルに設置することで、複数のツールを効率的に活用できます！
▼目次
まずは、配置したいアイコンをダウンロード！
アイコンの入手は、おなじみの以下サイトがおすすめです！
ICONE
https://icone.unique-work.com/
KUMA ICON
今回は、サンプルとしてICONEからダウンロードした素材を使用します。
ダウンロードする際は、「SVGダウンロード」の選択がオススメです。
拡大表示したときや解像度が高いモニターでもキレイに表示されます（※設定自体はPNGでも可能です）。
こだわり kintone プラグインで設定しよう！
アイコンを配置します
①まずは、こだわり
kintoneの設定画面を表示してください。
(【ポータル】デザイン設定 アプリ> アプリの設定 > プラグインです)
②ショートカットアイコンを選択して「+Widget追加」をクリック！
③「ショートカットアイコン」ウィジェットが生まれるので、右上の歯車アイコンをクリック！
④「ショートカットアイコン設定画面」が表示されたら、ダウンロードしたアイコンファイルをクリックもしくはドラッグ＆ドロップ！
⑤枠内にアイコンが表示されたら、右下の「保存ボタン」をクリック！
⑥ポータル画面にアイコンが表示されました！👏
アイコンにリンクを設定しよう！
よく使うkintoneアプリへのリンクを設定しましょう！
リンクの設定方法
①まずはWebブラウザでリンク先に設定したいアプリを開き、URLをコピーします。
こだわり kintone
プラグイン設定画面とは別ウィンドウで開くと操作がしやすいですよ！
②こだわり kintone プラグイン設定画面に戻り、リンク先URLを設定します。
先ほど設定したアプリの歯車アイコンをもう一度クリックし、ショートカットアイコン設定画面を開きます。
「リンク先URL」内にコピーしたURLをペーストし、「保存」ボタンをクリック！
アイコンにリンクを設定することができました！
アイコンのリンク先を新規タブで開きたい時
アイコンをクリックしたとき、ポータル画面は残して新規タブで開きたい場合は、リンク先URL下部にある「リンク先を別タブで開く」にチェックを入れ、保存してください。
（ポータル画面での動作が変わります。設定画面での動作は変わりません。）
アイコンの表現パターン
①アイコン下にラベルを設定する
「アイコン下のラベル」欄にアプリ名を入力すると･･･
アイコン下部にラベルが表示されます！
各アプリそれぞれに専用のアイコンをデザインしなくとも、配布されているフリーのアイコン素材からイメージに近いものを選んでラベルをつければ、誰でも簡単に素敵なポータルが作成できます！
②枠なしデザインにする
「ウィジェット表示設定」欄の「ウィジェット枠を表示」のチェックを外します。
背景が透明になり、アイコンとラベルのみの枠なしデザインに！
③アイコンの幅を調整したくさん配置する
アイコン右下にあるハンドルをドラッグすると、アイコン幅を拡大縮小することができます。
このように、幅を調整するとたくさんアイコンを配置することが出来るようになります。
1行に9個まで、最大30個までお好きなウィジェットを配置可能です（現在上限アップ検討中）。 →2024/7/29リリースのv1.2.0からは100個まで置けるようになりました。
様々な大きさのウィジェットを組み合わせることで、より見やすいポータルにできます。
スマホ対応しよう！
PCでの画面レイアウトが出来上がったら、スマホ用の画面レイアウトも設定しよう！
①画面上部の「画面レイアウト」欄にある「スマホ」をクリックすると、スマホ用のレイアウト設定画面に切り替わります。
②初期はバラバラに表示されていますが、お好みのレイアウトに配置してみてください。
PCとスマホはそれぞれ別々のレイアウトを設定することができます。順番を入れ替えることも可能です。
スマホでは、横一列に最大4つのアイコンが配置できます。
アイコンの下のラベルが2行になると位置がずれるので、短いラベル設定がおすすめです。
まるでiPhoneのようなポータル画面に！
最後は必ず保存！
設定ができたら、最後に保存を押してください。
作業中はこまめに押しておくと安心です！
次回は、別のウィジェットの利用方法をご紹介します。ご期待ください！
最新記事を見る
活用事例集一覧へ
keyboard_arrow_right