ITのえんぴつ

Google Blockly開発者ツールやIT・プログラミングを研究して発信するブログ

④フィールド1列目を設定しよう


こんにちは、ITのえんぴつです。

こちらは、計算ツールの作り方連載全9回の第4回の記事となります。

 

計算ツールの作り方連載全目次はこちら

 

eigo-gayomenai-engineer.hatenablog.com

 

前回は、③フィールド種類をご紹介しました。

本記事では、④フィールド1列目を設定してみましょう。

1. 最初のフィールドをすべて削除します

右下のゴミ箱マークを押すと、削除できます。

f:id:eigo-gayomenai-engineer:20220418143154p:plain

2.  タイプ「Div」を追加します

項目
4列

WordPressのプラグイン『Calculated Fields Form』のフィールドタイプ「Div」を設定しているスクリーンショット

3.  タイプ「概要」を追加します

項目
フィールドラベル ふるさと納税

WordPressのプラグイン『Calculated Fields Form』のフィールドタイプ「概要」を設定しているスクリーンショット

4.  タイプ「1行のテキスト」を追加します

項目
フィールドラベル 商品名
フィールドサイズ 大きい
事前定義された値 鶏肉もも
事前定義された値をプレースホルダーとして使用します

WordPressのプラグイン『Calculated Fields Form』のフィールドタイプ「1行のテキスト」を設定しているスクリーンショット1

WordPressのプラグイン『Calculated Fields Form』のフィールドタイプ「1行のテキスト」を設定しているスクリーンショット2

5.  タイプ「通貨」を追加します

項目
フィールドラベル 価格
フィールドサイズ 大きい
最小 0
最大 999999999
通貨記号  
通貨
セントを許可しない
動的にフォーマットして
事前に定義された値 10,000

WordPressのプラグイン『Calculated Fields Form』のフィールドタイプ「通貨」を設定しているスクリーンショット1

WordPressのプラグイン『Calculated Fields Form』のフィールドタイプ「通貨」を設定しているスクリーンショット2

6.  先程のタイプ「通貨」を複製して、ラベル「サイズ」を作ります

項目
フィールドラベル サイズ
通貨  
セントを許可しない  
小数点以下2桁
事前に定義された値 3,000

WordPressのプラグイン『Calculated Fields Form』のフィールドタイプ「通貨」を設定しているスクリーンショット3

WordPressのプラグイン『Calculated Fields Form』のフィールドタイプ「通貨」を設定しているスクリーンショット4

以上、④フィールド1列目を設定してみました。

 

前はこちら

③フィールド種類のご紹介

次はこちら

⑤フィールド2列目を設定しよう