モデルルーム予約管理アプリ サイト設計・構築③
SPIRAL ver.2では内覧の予約受付から内覧後のアンケート、検討状況の確認対応やメール配信を行うモデルルーム予約管理アプリの構築が可能です。 アプリ(DB)設計・構築 / サイト設計・構築 / ユーザ・アプリロール・グループ設定 に各工程を分け、ポイントやおすすめ機能・
入力体験を劇的に向上。SPIRALフォームにCSSだけで実装する次世代フローティングラベル
フローティングラベルを使用してSPIRALのフォームの入力体験を向上させる方法をご紹介します。 フォームのデザインテンプレートも用意いたしましたので、ダウンロードして試してみてください。 フローティングラベルとは?実装するメリット まずはデモサイトを
パスワード変更時に現在のパスワードと重複していないかチェックするサンプルプログラム
SPIRALのフォームでパスワードを変更する際に、新しいパスワードが現在のパスワードと重複していないかをチェックするサンプルプログラムを紹介します。 SPIRAL APIのレコード認証機能を利用することで、サーバーサイド(PHP)で安全にチェッ
一つのフォームを使いまわして複数店舗などでアンケートを取りたい
同じアンケート項目で、ユーザーが回答時にどの店舗から登録したのかを自動で判断できるようにしたいケースなどはないでしょうか? 店舗などの登録経路を自動的に判断したい場合、アンケート項目が同じであればフォームを店舗分用意することなく、 一つのフォームでパラメータと
サンクスメールを利用して登録通知メールを振り分ける設定方法
問合せフォームなどで、入力された支店コードごとに登録通知メールを振分け配信したい場合があります。 本記事では登録通知メールの振分け機能では対応できない場合の設定案をご案内します。 登録通知メール フォーム登録時に担当者宛に登録されたことを通知メールとして即時で配信
暗い場所でも快適に。OS設定に連動するダークモードでUXを向上させるCSS
フォームを入力するユーザーのPC、ブラウザの環境によってライトモードとダークモードを自動で切り替える方法をご紹介します。 デモサイトをご用意しました。 デモサイト フォームのデザインテンプレートも用意いたしましたので、ダウンロードして試してみてください。 ダークモー
確認ページでマルチセレクトの選択項目を並び替える方法
マルチセレクトの項目を登録フォームブロックの「確認ページ」にて、選択されたラベルを横並び・カンマ区切りで表示させる方法について紹介いたします。 Thymeleafの記法や動作についてはSPIRAL ver.2 サポートサイト Thymeleaf記法をご参照ください。 関連
SPIRALフォームのUXを劇的改善!入力・確認ページ間の遷移をCSSだけで滑らかにする方法
View Transition APIを使用してSPIRALのフォームでスムーズなページ遷移をする方法をご紹介します。 View Transition APIとは View Transition APIはLPのような単一ページアプリケーションにおけ
フィールド間の重複選択を不可にするサンプルプログラム
アンケートフォームなどで、「第一希望」「第二希望」のように複数の項目を選択してもらう際に、 同じ項目が選ばれるのを防ぎたい場合があります。 このページでは、JavaScriptを使用して、フィールド間の重複選択を動的に不可にする方法を、 プルダウンメニューとラジオボタンの2
フィールド間の重複選択を不可にするサンプルプログラム
アンケートフォームなどで、「第一希望」「第二希望」のように複数の項目を選択してもらう際に、 同じ項目が選ばれるのを防ぎたい場合があります。 このページでは、JavaScriptを使用して、フィールド間の重複選択を動的に不可にする方法を、 プルダウンメニューとラジオボタンの2
メールアドレス入力時にドメインをサジェスト表示し入力補完する機能
SPIRALフォームにおけるメールアドレス入力欄にドメイン部分のサジェスト機能を追加する方法について紹介いたします。 はじめに メールアドレス入力欄にドメインのサジェスト機能を実装する方法として、以下の2種類の方法があります。 1. サジェストするドメインを全てソース内で管理
テキストをカレンダー形式で表示させるサンプルプログラム
フォームの日付入力欄は、ユーザーにとって入力が煩雑になりがちな要素です。 特に、年月日が別々のテキストフィールドになっている場合、UI/UXの低下を招くことがあります。 本記事では、既存の年月日入力欄を、 直感的に操作できるカレンダーピッカーに置き換えるJavaScrip