WordPressで見積もりシュミレーションを作りたい

知恵を貸してください。
見積もりのシュミレーションを
ビジュアル的で、分かりやすく作りたい要望があり
参考のサイトを下記のアドレスで指定をされました。

ベースWordPressなのですが、
シュミレーションとして下記のプラグインを見つけましたが
イマイチ要望には沿わない気がしました。

全く同じとまでは言いませんが、
近いところでWordPressのプラグインもしくは
テンプレートで出来そうなことは有りますでしょうか？

宜しくおねがいします。

■WorｄPressの見積もり
プラグイン「Calculated Fields Form」

■トヨタの見積もシュミレーション
https://toyota.jp/service/estimate_simulation/dc/top?padid=not_tjptop_menu_cv_estimate

行動規範の内容に同意します

回答1件

ベストアンサー

なければ作りましょう。

HTMLとJavaScriptの技術さえあれば同等のものは作れるかと。

###追記
デザイン性もへったくれもないコードです。
もっと短く簡単にできると思うので頑張ってください。

HTML
1<div class=plans>
2  <div class=plan id=plan1>Plan1 (10000yen)</div>
3  <div class=plan id=plan2>Plan2 (20000yen)</div>
4</div>
5<div class=options1>
6  <div class=option1 id=option1_1>Option1 (50000yen)</div>
7  <div class=option1 id=option1_2>Option2 (10000yen)</div>
8</div>
9<div class=options2>
10  <div class=option2 id=option2_1>Option1 (1100yen)</div>
11  <div class=option2 id=option2_2>Option2 (500yen)</div>
12</div>
13<div id=value></div>

CSS
1.options1, .options2 {
2  display: none;
3}

jQuery
1$('.plan').on('click', function() {
2  var plan_id = $(this).attr('id');
3  var plan = {plan1:10000, plan2:20000};
4  var next_option1 = {plan1:".options1", plan2:".options2"};
5  $("#value").html(plan[plan_id]);
6  $(next_option1[plan_id]).css('display','inline-block');
7  $(".plans").css('display','none');
8});
9$('.option1').on('click', function() {
10  var option1_id = $(this).attr('id');
11  options1 = {option1_1:50000, option1_2:10000};
12  var value1 = $("#value").html();
13  var value2 = options1[option1_id];
14  var value = parseInt(value1) + parseInt(value2);
15  $("#value").html(value);
16  $(".options1").css('display','none');
17});
18$('.option2').on('click', function() {
19  var option2_id = $(this).attr('id');
20  options1 = {option2_1:1100, option2_2:500};
21  var value1 = $("#value").html();
22  var value2 = options1[option2_id];
23  var value = parseInt(value1) + parseInt(value2);
24  $("#value").html(value);
25  $(".options2").css('display','none');
26});