【2026年版】kintoneカスタマイズビューとは|作り方と“戻せない”制約

2026年版 kintoneカスタマイズビューとは 作り方と“戻せない”制約

本記事は、kintoneの構築・カスタマイズ支援とプラグイン開発の実務経験を持つ筆者が、実際に検証環境でカスタマイズビューを作りながら整理したものです。画面はすべて実機のスクリーンショットです。

この記事でわかることは、次の4点です。

  • カスタマイズビュー(カスタマイズ形式の一覧)でできること、できないこと
  • 作成の手順と、つまずきやすい3つの仕様
  • 採用してしまうと元に戻せないという制約と、その影響範囲
  • JavaScriptを書かずに同じ見た目・操作性を得る方法

カスタマイズビューは「一覧の3つ目の表示形式」

kintoneのレコード一覧には表示形式が3種類あります。一覧を新規に作るとき、この3択から選びます。

kintoneの一覧設定画面。「レコード一覧の表示形式」で表形式・カレンダー形式・カスタマイズの3つから選択できる

表形式とカレンダー形式は、kintoneが用意した見た目にデータを流し込むものです。列を選び、絞り込みと並び順を決めれば完成します。

これに対してカスタマイズ形式は、表示そのものを自分のHTMLとJavaScriptで作るという選択肢です。kintoneは「ここに好きに描いてください」という空の領域を用意するだけで、中身には関与しません。

そのぶん自由度は高く、標準の一覧では組めないレイアウトが作れます。たとえば同じ12件のデータでも、表形式ならこう並びます。

kintoneの標準的な表形式の一覧。案件名・会社名・担当者・フェーズ・確度・金額・次回アクション日が行ごとに並ぶ

カスタマイズ形式にすると、フェーズごとの列に案件カードを振り分けて、列ごとの件数と金額まで出せます。今回の記事のために実際に作ったものです。

カスタマイズビューで作った案件ボード。ヒアリング・提案・見積・クロージングの4列に案件カードが振り分けられ、列ごとに件数と合計金額が表示されている

同じデータでも、見え方はここまで変わります。「一覧が表でなければならない理由はない」というのが、カスタマイズビューの発想です。

作り方:4つのステップ

手順そのものは短いのですが、途中に仕様の落とし穴が3つあります。順に見ていきます。

1. kintoneシステム管理権限を用意する

最初の関門がここです。カスタマイズ形式の一覧を作成・編集するには、アプリ管理権限ではなくkintoneシステム管理権限が必要になります。

権限がないユーザーの画面には、そもそも「カスタマイズ」という選択肢が表示されません。グレーアウトして理由が示されるわけではないので、「手順どおりにやっているのに項目が見当たらない」という形でつまずきます。

「一覧の設定画面にカスタマイズが出てこない」ときは、まず自分の権限を疑ってください。アプリ管理者であっても、kintoneシステム管理者でなければ出てきません。

2. 一覧の表示形式で「カスタマイズ」を選ぶ

選択すると、設定項目が入れ替わります。表形式のときにあった「表示するフィールド」の選択欄は消え、代わりに次の画面になります。

カスタマイズ形式を選んだあとの設定画面。一覧ID・一覧を表示する範囲(PC版のみ/PC版とモバイル版)・HTMLの入力欄が並ぶ

ここで押さえておきたいのが入力欄はHTMLだけという点です。カスタマイズビューという名前から「ここにJavaScriptも書く」と思われがちですが、そうではありません。

HTML欄に書くのは、描画先となる器だけです。上の例では次の1行しか入れていません。

<div id="deal-board"></div>

3. JavaScriptは「JavaScript / CSSでカスタマイズ」から入れる

実際の描画処理は、アプリ設定の「カスタマイズ/サービス連携 > JavaScript / CSSでカスタマイズ」にファイルをアップロードして読み込ませます。設定する場所が分かれているので、初見だと迷いやすいところです。

JavaScript側では、一覧画面を表示したときのイベントを受けて、HTML欄に置いた器の中を埋めていきます。

kintone.events.on('app.record.index.show', function (event) {
  var el = document.getElementById('deal-board');
  if (!el) return event;          // ほかの一覧では何もしない
  // event.records を使って el の中身を組み立てる
  return event;
});

複数の一覧がある場合、event.viewId を見て対象の一覧かどうかを判定します。一覧IDは、先ほどの設定画面に表示されています。上のように「器のIDが存在するか」で判定してもかまいません。

4. ページネーションの設定に注意する

3つ目の落とし穴がここです。設定画面の下のほうにある「ページネーションを表示する」は、見た目の設定に見えてJavaScript側の挙動を変えます

kintone公式のドキュメントには、app.record.index.show イベントの records プロパティについてこう書かれています。

「custom」で、ページネーションがtrueのとき:レコードのデータの配列 「custom」で、ページネーションがfalseのとき:空配列

つまり、ページネーションをオフにすると event.records は常に空になります。実際、今回の検証でも最初はカードが1枚も出ず、列の見出しだけが並ぶ状態になりました。原因はこの設定でした。

対処は2つあります。ページネーションを有効にするか、event.records に頼らず自分でREST APIからレコードを取得するかです。1ページに収まらない件数をまとめて集計・描画したいなら、どのみち自前で取りに行くことになります。

採用する前に知っておきたい3つの制約

自由度と引き換えに手放すものがあります。ここを知らずに進めると、あとから困ります。

保存したら、表形式には戻せない

カスタマイズ形式で保存した一覧は、あとから表形式やカレンダー形式に変更できません。実際に作成済みのカスタマイズビューを開くと、表形式とカレンダー形式が選べなくなっています。

保存済みのカスタマイズビューの設定画面。表形式とカレンダー形式がグレーアウトして選択できない

戻したい場合は、その一覧を削除して作り直すことになります。絞り込み条件や並び順もやり直しです。まずは複製した一覧で試すのが安全策になります。

編集にも管理者権限が要り続ける

作るときだけでなく、直すときにもkintoneシステム管理権限が必要です。アプリ管理者に運用を任せている組織では、カスタマイズビューだけは現場で直せない状態になります。

「作った人が異動して、誰も触れなくなった」という属人化は、ここから起きます。運用体制まで含めて決めてください。

標準の一覧向けプラグインが動かなくなる

見落とされがちですが、影響がいちばん大きいのはここです。多くのプラグインは、kintoneが描画した表形式の一覧のDOMを前提に動いています。表そのものが存在しないカスタマイズビューでは、当然ながら何も起きません。

自社で公開しているプラグインだけを数えても、次の製品が「カスタマイズビューでは動作しません」と明記しています。

製品カスタマイズビューでの扱い
一覧スタイラー動作しない(表形式の一覧専用)
かんたんCSV出力「CSV出力」ボタンが表示されない
ステータス一括実行動作しない
添付ファイルプレビュー動作しない
付箋ボード件数バーが表示されない
経過計算アシスト動作しない
エクセル一括貼り付け動作しない

他社製のプラグインでも事情は同じです。一覧に何かを足すタイプのプラグインを使っているなら、カスタマイズビューへの切り替えはそれらを全部捨てる判断になります。

判断の順番としては、「やりたい表示がプラグインで実現できないか」を先に確認するほうが安全です。カスタマイズビューは、それでも足りないときの最後の手段と考えてください。

JavaScriptを書かずに、同じ結果を得る

ここまで読んで「開発リソースがない」と感じたら、カスタマイズビューの枠だけを借りて、中身はプラグインに描かせるという手があります。仕組みとしてはカスタマイズビューを使いますが、書くコードはゼロです。

表計算のように一覧上で直接編集する

シート編集 for kintoneは、一覧(カスタマイズビュー)をExcelのような表計算グリッドに置き換えます。表示中のフィールドをその場で編集して保存でき、コピペ・範囲一括編集・オートフィルにも対応しています。

シート編集 for kintone。レコード一覧をカスタマイズビューで表計算風のグリッドに置き換え、表示中のフィールドをその場で編集して保存できる

1件ずつ詳細画面を開いて直す往復が多いなら、まずこちらを検討する価値があります。無料で使えます。

集計ダッシュボードを一覧に常設する

ダッシュボード for kintoneは、グラフ・数値カード・クロス集計表を1枚のボードに集約し、一覧のカスタマイズビューに常設します。標準グラフのように1画面1グラフではなく、見たい数字を並べて一望できます。

ダッシュボード for kintone。グラフ・数値カード・クロス集計表を1枚のボードにまとめてレコード一覧のカスタマイズビューに常設した画面

期間セレクタで全ウィジェットを連動して再集計でき、アプリをまたいだ集計にも対応します。

カンバン表示なら、標準一覧のまま実現できる

なお、記事の冒頭で作ったようなカード表示が目的なら、カスタマイズビューを使わない選択肢もあります。カードボード for kintone標準の一覧画面に「表/カード」の切り替えを足す方式なので、カスタマイズビューの制約を受けません。

カンバン運用そのものを検討している方は、kintoneでカンバン方式のタスク管理を実現する方法もあわせてご覧ください。

どれを選ぶか

目的から逆算すると、判断はそれほど難しくありません。

やりたいこと現実的な手段
列を並べ替える・色を付ける・見やすくする表形式+プラグイン
一覧のまま複数レコードを編集したいシート編集(カスタマイズビュー利用・コード不要)
一覧に集計値やグラフを出したいダッシュボード/集計サマリーバー
カンバンで案件を動かしたいカードボード(標準一覧のまま)
上記のどれにも当てはまらない独自UIが要るカスタマイズビュー+自社開発

最後の行に当てはまる場合だけ、カスタマイズビューを選んでください。作れることと、作り続けられることは別です。 kintoneのアップデートでDOM構造が変われば、自作のコードは自分で直す必要があります。設定画面にも「kintoneのアップデートにより、適用したJavaScript / CSSファイルが動作しなくなる場合があります」という注意書きが出ています。

まとめ

  • カスタマイズビューは一覧の表示形式の3つ目で、HTMLとJavaScriptで表示そのものを作る選択肢
  • 作成・編集にはkintoneシステム管理権限が必要。権限がないと選択肢自体が表示されない
  • 設定画面で入力するのはHTMLだけ。JavaScriptは「JavaScript / CSSでカスタマイズ」から別途読み込ませる
  • ページネーションがfalseだと event.records は空配列になる。レコードは自分で取得する必要がある
  • 保存後は表形式・カレンダー形式に戻せない。試すときは複製した一覧で
  • 標準の一覧向けプラグインは動かなくなる。切り替えは既存の資産を捨てる判断になる
  • 表計算のような編集や集計ボードが目的なら、コードを書かずにプラグインで実現できる

よくある質問

Q. 一覧の設定画面に「カスタマイズ」が表示されません

kintoneシステム管理権限がないアカウントでは表示されません。アプリ管理権限だけでは足りないので、システム管理者に依頼してください。

Q. カスタマイズビューにJavaScriptを書く欄はどこですか

設定画面にあるのはHTML欄だけです。JavaScriptはアプリ設定の「カスタマイズ/サービス連携 > JavaScript / CSSでカスタマイズ」からファイルをアップロードします。

Q. カードが1枚も表示されません

「ページネーションを表示する」がオフだと event.records が空配列になります。オンにするか、REST APIでレコードを自分で取得してください。

Q. 表形式に戻したいのですが

保存後の変更はできません。一覧を削除して、表形式で作り直すことになります。

Q. 使っているプラグインはカスタマイズビューでも動きますか

一覧の表に対して動くタイプのプラグインは、ほぼ動きません。各製品のFAQで対応画面を確認してください。

kintoneの一覧表示でお困りではありませんか?

KIZUNA Worksでは、kintoneの構築・カスタマイズ支援や、業務効率化のためのプラグイン開発を行っています。「カスタマイズビューまで踏み込むべきか」「プラグインで足りるのか」の切り分けからご相談いただけます。

お問い合わせはこちら

関連記事・サービス

← ブログ一覧に戻る