アプリ不要！多機能な年齢認証フォームを実装するチュートリアル

サイトに合わせて柔軟に設定できる「年齢認証」フォームを、どんなテーマにでも実装できます。

酒やタバコ、アダルトグッズなど、年齢認証を必要としたショップも少なくありません。

基本的にはアプリを使って実装するか、年齢認証フォームが実装されているテーマを選ぶか、自身で設置するかの3択になります。

仕組みとしては、年齢を認証するとブラウザのCookieに情報が保存され、クッキーの保存期間中はポップアップが表示されないというものがほとんどです。

アプリの場合だと、サードパーティドメインからCookieが発行されるものもありセキュリティ的に不安ですし、サブスク料金も発生します。

実装済みテーマの場合は、年齢認証機能ありきで購入したはいいけど、海外仕様で使い勝手が悪く結局アプリを入れたというケースもあったりします。

どちらにも言えますが、デザインを変えたくても調整が難しかったり、jQuery依存のものだったりします。

認証方法も様々で、「ENTER」だけで認証するものや、「はい/いいえ」「ENTER」だけのもの、「生年月日」を入力するものなどがあります。

ここで紹介するのは、思いつく限りの機能を搭載した超多機能な年齢認証のポップアップを実装するカスタマイズ方法です。

セキュリティ的に不安視されるCookieを使わずに、セッションストレージやローカルストレージでも認証できたり、年齢確認の方法も柔軟に設定できます。

また、CSSの知識さえあればどんなテーマにも実装できます。

• アプリ不要
• jQuery不要
• JSライブラリ不要
• セッション ストレージ対応
• ローカルストレージ対応
• 生年月日認証対応
• デザインカスタマイズ可能