設計情報

投稿者:SPIRERS ナレッジ向上チーム 2022年9月9日 (金)

MKupdate vol.12「SPIRAL ver.2の機能キャッチアップ サイト管理編」

SPIRAL ver.2は、2022年10⽉と2023年1⽉に⼤きなアップデートが控えています。
そこで、改めてver.2の特徴や基本機能について体感できる機会を提供したいと思い、

MKupdate vol.12は、
SPIRAL ver.2の機能キャッチアップ サイト管理編
をキーワードとして、アプリ/アカウント管理の機能をご紹介します。

SPIRAL ver.2のアップデートについて

今期のアップデート予定
今後10月、1月とアップデートを予定しており、設定の幅が広がるような新機能が続々と追加されていく予定ですので、このタイミングでSPIRAL ver.2の基本機能を押さえていきましょう。

サイト管理

ブロックに関して
ブロック機能では、ページに設置できるフォームや一覧などのパーツを作成することができます。

作成することができるブロックの一覧は下記です。
ブロック名 利用箇所
登録フォームブロック
更新フォームブロック
削除フォームブロック
各種フォーム
ログインフォームブロック
パスワード再登録フォームブロック
レコード照合フォームブロック
認証エリア
レコード検索ブロック
レコードリストブロック
レコードアイテムブロック
一覧
フリーコンテンツブロック 様々な利用用途あり

注目ポイント
登録フォームブロック
登録フォームブロックはビジュアル設定とソース設定の2つの設定を選べます。
ビジュアル設定はHTMLなどを一切いじらずにデザインなどの変更が可能であり、HTMLなどのマークアップ言語に詳しくない人でも簡単にフォームを作成できます。
一方、ソース設定ではHTML編集が行えるため、独自にカスタマイズして使用することも可能です。
フィールドのグループ化
姓・名の2フィールドに分かれているフィールドもグループ化することで、ソース編集なしで横並びに表示することができます。
フォームのステップ設定
入力項目が多く入力ページを2ページに分けたいケースなどで、ステップ設定を使用できます。
ステップ設定で入力ステップ・確認ステップを追加することで、複数ページに項目を分けたステップフォームを作成することが可能です。
フォームの Thymeleaf 制御
表示は Thymeleaf で制御しているため、ソース設定の場合でも DB の項目名などを書き換えると即時反映されるようになっています。
フォームを発行後に項目名を変更したい場合やセレクトを1個追加したいなどの要望があった場合に、フォームブロックの作り直しやソース修正なく即時で変更が反映されます。
登録フォームブロックのソースに関してはこちらの記事で詳しく解説されていますのでご参照ください。
フォームに reCAPTCHA 追加
reCAPTCHA とはスパムや bot などによる悪質なアクセスからWebサイトを保護するための仕組みで、
フォーム入力の際に下記画像のようなチェックボックスをクリックすると bot か人かを判定する画像診断のようなものを表示する機能になっています。
ver.2 ではプログラムなどを書かなくても簡単に reCAPTCHA をフォームに追加することができます。
reCAPTCHA に関してはこちらの記事でも解説しておりますのでご参照ください。
フリーコンテンツブロック
このブロックは汎用的に利用できるもので、例えばサイトパーツを置いたり、
Googleタグマネージャーのタグ設置に使えたりするなど様々な利用用途があります。
またブロックは複数のページで使用できるので、共通で使用する内容をフリーコンテンツブロックに設置し、ページ側で読み込むことでメンテナンス性を向上させることも可能です。

フリーコンテンツブロックを使ったGoogleタグマネージャーのタグ設置方法に関しては、こちらの記事で解説しておりますので、ご興味のある方はご覧ください。
ページに関して
ページはブロックを組み合わせて作成することができるようになっています。
またブロックは複数のページで使いまわして使用することができるため、
例えばヘッダーといった共通で使用するサイトパーツをフリーコンテンツブロックで作成しておくことで、
フリーコンテンツブロック1つを編集するだけで、多くのページを一括で更新することができます。

注目ポイント
サイトURLの設定
ver.2 ではアカウント名やサイト識別名などでドメインを決めることができます。
ドメイン部分だけなくページごとにディレクトリ構造でのURLを作成することも可能となっています。
ページの階層構造表示
ページを階層構造的に設定・管理できるため、実際のサイトマップに近い形で管理画面上に表示されます。
そのためサイト全体の把握や管理がしやすい UI になっています。
認証エリアに関して
認証エリアとは、ID/パスワードを用いてログインする会員専用ページや、
メール本文中にあるリンクをクリックしてそのユーザ専用のページへ遷移させる会員専用ページなどを設定することができる機能です。

注目ポイント
レコード公開範囲設定
一般公開ページや認証エリア内でのレコードの公開範囲を、セレクトなどのフラグによって表示の出し分け設定ができる機能です。
例えばお知らせ一覧で会員と一般で表示したいお知らせを分けたい場合、
プログラムを作成しなくてもレコード公開範囲設定でお知らせの出し分けが実現できます。
PHP と JavaScript に関して
PHP や JavaScript など高度なカスタマイズをすることも ver.2 では可能です。
また PHP ではデータの処理、Thymeleaf では画面表示を行うという特徴があります。
プログラム(PHP)と画面表示部分(body と head)の記述箇所が別れているため、
コードの可読性だけでなく、メンテナンス性が上がっています。
例えば画面表示の部分だけを修正したい場合、PHP のコードを触ることなく修正することが可能です。
PHP と Thymeleaf に関してはこちらの記事で概念も含めて解説しておりますので、ご参照ください。

注目ポイント
PHP環境変数設定
APIキーなど多くのページで利用する定数に関しては、ver.2 機能の「PHP環境変数設定」を利用することで、
本番環境とテスト環境でキーが異なっていても、本番とテストで値が自動で切り替わります。
そのためコードを書き換える必要がなく、保守性/メンテナンス性を高めることができます。
テスト環境に関して
ver.2 にはテスト環境が標準で付属しています。
テスト環境で構築を行い、本番環境にリリースするつくりになっているため、事前のテスト環境構築や費用が不要となります。
公開後の改修は、テスト環境で行うことができます。
本番へのリリースもボタン操作で即時に反映することができるので、公開後の改修も容易となります。

最後に

今回は「サイト管理」のご紹介でした。
SPIRAL ver.2の機能をキャッチアップして、実際に操作をお試しいただけると幸いです。
解決しない場合はこちら コンテンツに関しての
要望はこちら