CookBook

Formaでスクリプトアイテムを使い、ボタン・見出し等の色やサイズを変更する方法

投稿日:

このCookBookでは、Formaでスクリプトアイテムを使い、デザインを変更する方法をご紹介します。
サンプルでは、「ボタンアイテム」の背景色の変更・「見出し」の背景色の変更・「ラジオボタン」のボタンのサイズ変更を実現します。

完成イメージ

レシピ

  1. 変更をかけたいアイテムとスクリプトアイテムを追加してください。
  2. スクリプトアイテムを追加し、プロパティにコードを記述してください。(jQueryのセレクタは一例です)

1. 変更をかけたいアイテムとスクリプトアイテムを追加してください。

2. スクリプトアイテムを追加し、プロパティにコードを記述してください。(jQueryのセレクタは一例です)

変更したいボタンのIDをbuttonIdsに設定してください。複数選択も可能です。

アイテムのIDは、実行画面を開き開発者ツールで確認できます。
スクリプトアイテムによってかかった変更は、Forma管理画面では確認できません、Formaアプリから確認できます。

その他:同様にスクリプトアイテムを使うことにより、見出しの色やラジオボタンのサイズを変更してください。

以下のコードをスクリプトアイテムのプロパティに記載してください。

-CookBook
-

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

関連記事

no image

SAMLユーザマッピングのジョブを作成する

標準機能では、IdPユーザとintra-martユーザを紐付けるには以下の方法があります。・SAMLユーザマッピング画面からユーザ毎に登録する。・SAMLユーザマッピング画面からCSVファイルを利用し …

no image

IM-BloomMaker リッチテーブルで大量のデータを扱う時に読み込みを速くする方法

このCookBookでは、リッチテーブルエレメントで大量のデータを扱う時にデータの読み込みを速くする方法について紹介しています。 intra-mart Accel Platform 2023 Autu …

no image

IM-BloomMaker ページのトップに戻るボタンの作り方

このCookBookでは、IM-BloomMaker でページのトップに戻るボタンの作り方について紹介しています。 今回紹介する方法は、intra-mart Accel Platform 2022 S …

BloomMakerでワークフローの添付ファイルを直接編集する画面を作成する

このCookBookでは、BloomMakerで、ワークフローの添付ファイルを直接追加や削除する画面を作成してみました。 本稿で紹介のサンプルのように、BloomMakerを利用することで、ちょっとし …

no image

スクリプト開発した画面にバリデーション(入力チェック)を実装する

このCookBookでは、作成した画面項目に対してバリデーション(入力チェック)を設定する方法をご紹介します。 今回はスクリプト開発で登録フォームを作成するで作成した画面項目に対して、クライアントサイ …