kintoneプラグイン（拡張機能）は開発できる？ 必要なファイルや手順を紹介

サイボウズ社が提供する業務改善プラットフォーム「kintone（キントーン）」は、ローコード・ノーコードでのアプリ作成やコミュニケーションツールなどの基本的な機能だけでなく、プラグインによる機能追加、JavaScriptによるカスタマイズという、優れた拡張性を持っています。
これらを利用すれば、自社固有の機能を追加したり、目的に合わせてアプリを設定したりするなど可能です。

本記事では、プラグイン開発に焦点をあて、機能拡張の方法を詳しく解説します。

kintoneの開発について、関連記事をご用意しております。
▼kintoneの開発でさらに便利に！ メリット・デメリットや注意点を解説

プラグインとは、kintoneの追加機能のことです。メーカーやkintoneベンダーが開発したもので、必要なファイルがすでにzip形式でパッケージングされているため、誰でも簡単に組み込むことができます。プラグインは無料のものと有料のものがあります。

kintoneは標準機能だけでも十分に業務改善を実現するツールですが、顧客管理や営業管理、在庫管理など様々な管理業務に適応するにはプラグインの活用がおすすめです。
例えば、予実管理をkintoneで行う際、予算管理アプリと実績管理アプリを作成します。それぞれのアプリに数値を入力して月・年ごと集計しなければなりませんが、kintoneの標準機能ではアプリをまたがる集計はできないのです。kintoneに集計機能はありますが、同一アプリのフィールド同士の集計のみに対応しています。
そのため、標準機能でまかなえない機能はプラグインによるカスタマイズで、機能を拡張するのがkintoneの有効的な使い方だといえます。

kintoneをカスタマイズするには、プラグインのインストールとJavaScriptによる開発の2つの方法があります。まず、この2つのカスタマイズ方法の違いや、プラグインによるカスタマイズの方法について紹介します。

JavaScriptによるカスタマイズは、独自の機能や設定をkintoneに直接追加できます。JavaScriptは広く利用されているプログラミング言語であるため、関連情報も多く、身につけるまでの学習コストが比較的低いというメリットがあるでしょう。
しかし、JavaScriptによるカスタマイズのほうがより自由な拡張ができる半面、プログラミングの経験がない人にとっては敷居が高いことがデメリットだといえます。

両者の特性から「簡単にカスタマイズできるプラグイン」と「自由にカスタマイズできるJavaScript」と理解するとよいでしょう。それでは早速、実際にプラグインを追加していく流れを解説します。

kintoneに自社開発したプラグインや、既にkintoneで用意されているプラグインを追加する場合は、次の手順で行います。

1. kintoneシステム管理画面を開く
2. メニュー「その他」の［プラグイン］をクリック
3. 画面左上にある「読み込む」をクリック
4. ［参照］をクリックし、読み込むプラグインのファイル「xxx.zip」を選択
5. ［読み込む］をクリック

読み込むプラグインは、100MBまでのファイルを選択できます。読み込んだ後「読み込んだプラグイン」の中に選択したプラグインが表示されていれば、追加は完了です。新しいバージョンのプラグインを読み込む場合は、同じ手順を行います。

プラグインは、プラグインストアから目的のプラグインをダウンロードして追加することも可能です。次の手順で行います。

1. kintoneシステム管理画面を開く
2. メニュー「その他」の［プラグイン］をクリック
3. インストールしたいプラグインを選択し、［インストール］をクリック
4. ［OK］をクリック

画面に表示されているプラグインのステータスが「インストール済み」となっていれば、プラグインの追加が完了しています。また、プラグインストアから追加したプラグインは、常に最新のバージョンに自動でアップデートされます。

ここまででプラグインを追加できるようになりました。続いては、プラグインを開発する流れをご紹介します。

プラグイン開発に必要な次のファイルを準備します。この中で必須のファイルはアイコンファイルのみで、その他は必要に応じて用意しましょう。

※1 スマホ専用のプラグインの場合、省略可能
※2 スマホで利用しないプラグインの場合、省略可能

マニフェストファイルは、プラグイン開発に必要な情報をまとめたファイルです。プラグインの名前やプラグイン内のファイルを記載します。以下がマニフェストファイルの例です。

{
    "manifest_version": 1,
    "version": 1,
    "type": "APP",
    "name": {
        "ja": "サンプル",
        "en": "sample"
    },
    "description": {
        "ja": "これはサンプルです。",
        "en": "This is a sample."
    },
    "icon": "image/icon.png",
    "homepage_url": {
        "ja": "https://sample.com/jp/",
        "en": "https://sample.com/en-us/"
    },
    "desktop": {
        "js": [
            "js/customize.js",
            "https://sample.com/js/customize.js"
        ],
        "css": [
            "https://sample.com/css/customize.css",
            "css/customize.css"
        ]
    },
    "config": {
        "html": "html/config.html",
        "js": [
            "https://sample.com/js/config.js",
            "js/config.js"
        ],
        "css": [
            "css/config.css",
            "https://sample.com/css/config.css"
        ],
        "required_params": ["Param1", "Param2"]
    }
}

参照：https://cybozu.dev/ja/id/76c0f6daa0367b055a444f93/#manifest

「plugin-packer」は、プラグイン開発に必要なファイルをzipファイルにまとめるツールです。マニフェストファイルの内容を基に、必要なファイルとマニフェストファイルを配置後、コマンドを実行すると自動でパッケージングされます。
なお、このツールを使用するには「Node.js」が必要です。あらかじめNode.jsのインストーラーを入手しておきましょう。

パッケージングが完了すると、zip形式のプラグインファイルと、ppk形式の秘密鍵ファイルが生成されます。秘密鍵ファイルは2回目以降のパッケージングでも利用するため、大切に保管しておきましょう。

作成したプラグインファイルをkintone環境にインストールするには、前述の「ファイルからプラグインの読み込み」の手順を行います。なお、同じプラグインIDを持つプラグインをアップロードした場合、自動的に上書きされ、プラグインを利用しているアプリにも即時適用されます。
また、複数のプラグインを指定した場合、プラグインが競合する場合もあります。事前に運用に支障がないことを検証しておくことをおすすめします。

kintoneの開発環境について、下記記事にて解説しています。
▼kintone開発のために用意する環境は？ 必要なライセンスについて解説

プラグイン開発ではパッケージングツール「plugin-packer」を使用しましたが、他にも開発に役立つツールがあります。ここでは3つ紹介します。

• plugin-uploader
  開発したプラグインzipファイルをkintoneにアップロードするためのツールです。kintone環境にプラグインファイルのインストール作業を自動化したい場合に便利です。
• create-plugin
  プラグインのひな型を作るツールです。初めてプラグイン開発を行う場合や、一から開発する場合に利用します。plugin-packer、plugin-uploaderも入っています。
• webpack-plugin-kintone-plugin
  webpackを利用したプラグインファイルをパッケージングする場合に利用します。

ここでは、プラグイン開発でよくつまずくポイントから、役立つTipsなどをご紹介します。

プラグイン設定画面で初期値を設定しても、再度プラグイン設定画面を再表示すると、設定した初期値がデフォルト値に戻ってしまいます。そうなると、最初に設定した初期値が何であったかを確認できません。

そうならないために、プラグイン設定画面のJavaScriptファイル内で、以下のように記述すると、プラグイン設定画面で初期値を設定できます。

jQuery.noConflict();

(function($, PLUGIN_ID) {
    "use strict";

    $(document).ready(function() {
        // プラグインIDの設定
        var conf = kintone.plugin.app.getConfig(PLUGIN_ID);

        //既に値が設定されている場合はフィールドに値を設定する
        if (typeof (conf['elm']) !== 'undefined') {
            $('#element').val(conf['elm']);
        }
    });

})(jQuery, kintone.$PLUGIN_ID);

参照：https://cybozu.dev/ja/id/7e085dd549c5a1b8104a8097/

プラグインには、新規アプリ作成が前提のものもあります。その際、以下のコードを記載すれば、プラグインで使用するフィールドを自動的に追加できます。

// 初回プラグイン設定時のみ必要なフィールドを自動追加する
kintone.api(kintone.api.url('/k/v1/preview/app/form/fields', true), 'POST', {
    "app": kintone.app.getId(),
    "properties": {
        "Name": {
            "code": "Name",
            "label": "名前",
            "type": "SINGLE_LINE_TEXT"
        },
        "ID": {
            "code": "ID",
            "label": "ID",
            "type": "NUMBER"
        }
    }
}, function(resp) {
    location.reload();
});

参照：https://cybozu.dev/ja/id/7e085dd549c5a1b8104a8097/

ここまで一例としてプラグインの開発方法を説明しましたが、自社独自のプラグインを開発しようとすると、かなり難易度が上がると予想されます。
社内に対応できるエンジニアがいない場合は、サイボウズ社公認のkintoneオフィシャルパートナーに相談することをおすすめします。適切なプラグインの選定やシステム開発など、お客様の要望に沿ってノウハウと経験が豊富なkintoneエンジニアが解決してくれます。

テクバンもkintoneオフィシャルパートナーです。お客様のお悩みを解消するために開発・カスタマイズに対応するだけでなく、解決に向けて必要な業務システムやプラグインを提案するコンサルティングも実施しております。
ぜひお気軽にご相談ください。

kintoneは非常に拡張性が高く、プラグインを利用すれば簡単にカスタマイズできます。また、JavaScriptを使えるなら、さらに自由度の高いカスタマイズも可能です。プラグイン開発の詳細については、cybozu developer networkにも詳しく情報が掲載されています。そちらもご確認ください。

既成のプラグインを利用するだけでなく、今回ご紹介した手順でプラグイン自体の開発にもぜひチャレンジしてみてください。

※本記事の内容は2025年8月時点のものです。kintoneの仕様や利用環境は変更する場合があります。