JavaScriptやCSSでアプリをカスタマイズする

記事番号:040556

JavaScriptやCSSを利用して、アプリの動作や画面をカスタマイズできます。PC用とスマートフォン用(スマートフォンアプリを含む)とで分けてカスタマイズします。

アプリのカスタマイズは、[アプリの設定][JavaScript / CSSでカスタマイズ]画面からJavaScript/CSSファイルを適用します。
アプリに適用するカスタマイズファイルの作成には、Kintoneが提供するAPIを利用できます。詳細は、次のページを参照してください。
Kintone Developer Program

アプリのカスタマイズが適用される画面

[アプリの設定][JavaScript / CSSでカスタマイズ]画面で取り込んだJavaScript/CSSファイルがどの画面に適用されるかは、次のページを参照してください。
アプリのカスタマイズが適用される画面

JavaScriptファイルやCSSファイルを適用する

JavaScriptやCSSを用いて作成したカスタマイズファイルをアプリに適用する手順を説明します。Kintoneのシステム管理者だけが、アプリにJavaScriptやCSSを適用できます。

  1. [レコードの一覧]画面で、画面右上にある歯車の形をした[アプリを設定]アイコンをクリックします。
    スクリーンショット:[アプリを設定]アイコンが枠線で強調されている

  2. [アプリの設定]画面で、[設定]タブの[カスタマイズ/サービス連携]にある[JavaScript / CSSでカスタマイズ]をクリックします。

  3. [JavaScript / CSSでカスタマイズ]画面で、カスタマイズの適用範囲を次の3種類から選択します。

    • [すべてのユーザーに適用]
    • [アプリ管理者だけに適用]
    • [適用しない]

    すべてのユーザーにカスタマイズを適用する場合は、あらかじめアプリ管理者だけに適用して、正しくカスタマイズされていることを確認してください。
    [すべてのユーザーに適用]を選択すると、カスタマイズはゲストユーザーにも適用されます。

  4. [URL指定で追加]または[アップロードして追加]をクリックし、取り込むファイルを選択します。
    複数のファイルを取り込んだ場合、ファイルは上から順番に読み込まれます。また、ファイルの順番は、ファイル名の左側にある[ドラッグして並び替え]アイコンをドラッグアンドドロップして変更できます。
    スクリーンショット:カスタマイズファイル読み込み画面

  5. 画面右下の[保存]をクリックします。

  6. 画面右上の[アプリを更新]をクリックします。

  7. [アプリを更新]ダイアログで、[アプリを更新]をクリックします。