CookiebotでWordPressサイトのGDPR対応を進める

GDPR対策やってますか?自力でもろもろトライしてたのですが、いろいろ手間だなと思うことが増えてきたので、CookiebotというSaaSを試してみました。

Cookiebotでできること

  • Cookie consent: GDPRに完全準拠したCookie同意機能
  • Cookie monitoring:ウェブサイトのトラッキングの関心とレポーティングする機能
  • Cookie control:JS APIを用いて第三者のCookieを制限する機能

自分のサイトのGDPR対応状況を確認する

アカウント作成だけのボタンもありますが、TOPにあるスキャン機能からもアカウント作成ができます。せっかくなので、スキャンしときましょう。

https://www.cookiebot.com/en/

対応したいサイトのドメインを入力して、[Check My website]を押しましょう。

メアド聞かれるので、いれましょう。

cybot.comからConfirm your e-mailというタイトルのメールが届いているはずなので確認しましょう。

Confirm e-mailをクリックすると、10 ~ 20分程度でレポート結果を送るという画面が表示されます。

しばらく気長に待っていると、チェック結果がメールで送信されてきます。

ですよねーという結果

cookiebotはページ数も課金項目にあります。今回試した小規模サイトであれば、39ページなのでフリープランで大丈夫そうですね。

「フルスキャンまたは、GDPR対応の機能を手に入れるなら、サインアップしてね」というようなメール内容でした。今回はアカウントを作って進めていくのがメインなので、Sign up nowボタンを押して進みましょう。

アカウントを作成する

アカウント作成ページでは、メールアドレスとパスワードを入力します。「If your website contains more than 100 subpages, your subscription will automatically change to a 1-month free Trial.」とありますので、ページ数が増えてくると自動的に有料プランのトライアルへ切り替わることに注意しましょう。

ちなみにメールアドレスにGmailなどのエイリアスは使えませんでした。登録すると、registration keyがメールで送られてきますので、以下の画面に入力します。

入力すると、ダッシュボードへのリンクが表示されます。

管理サイトを設定する

ここまででアカウントの準備ができました。ということで早速サイトを登録します。

サイトを登録する

管理画面TOPにドメイン登録画面がありますので、ここから + アイコンを押して登録します。

scanの実行頻度とドメイン名を登録しましょう。無料プランでは「scan freequency」はMonthlyしか選べないみたいですので、ドメイン名をいれてエンターキーを押しましょう。特に完了画面などは出ませんので、気にせず次へいきましょう。

cookie利用同意画面の表示を調整する

cookiebotでは利用同意画面の表示を調整できます。[Dialog]タブに移動して設定していきましょう。

表示位置の調整

Templateから表示位置を上から・下からなど設定できます。左メニューの[PREVIEW]を使って表示内容を確認しながら選びましょう。

同意の仕方を選ぶ

同意ボタンを押す以外にも合意したと判定するアクションが選べます。現時点では[Page Scroll]と[Page refresh]がありますので、適応したいもののチェックをオンにしておきましょう。

利用同意の種類を選ぶ

[Type]からユーザーがアクションの種類を選ぶことができます。デフォルトでは「必要な(おそらく必須の誤訳)」「設定」「統計」「マーケティング」を個別に許可できる[Multilevel]がせっていされています。

Multilevel

そのほかには「すべての利用を許可する」オンリーの[Accept only]や「必要なCookieのみ許可する」ことができる[Decline only]などがあります。通販サイトなどでCookieがないと動かないものがある場合、[Decline only]などを指定するとよいかなと思います。

Accept only

なお、バナー左側のロゴ画像を変更するには、有料プランへの変更が必須となります。バナーの表示する地域も選べる様子ですが、こちらも有料プランオンリーでした。

表示コンテンツの調整

Cookiebotが表示するテキストの調整も可能です。[Content]タブから設定が可能で、日本からor日本語設定のブラウザから見ると日本語のコンテンツがデフォルトで設定されています。

フリープランでは1言語のみ設定可能で、有料プランに変えることで多言語に対応できる様子です。対象ユーザーがEUであることを考えると、[Language]から[English]を選択して、英語での表示のみにしても良いかもしれません。日本語だけで利用するとすれば、EUに住む日本人を対象にしている場合かなと思います。

英語にすると、ちゃんとコンテンツも英語になる

変更をプレビューして保存する

最後に変更内容の確認と保存をやりましょう。

左メニューの[PREVIEW]を押すと、実際の表示を確認できます。

SAVEを押すことで、設定の保存ができます。これを行なっていないと、以降の設定をしても反映されないので要注意です。

WordPressサイトに追加する

ここまでで一通りの準備ができました。あとは自分のWPサイトに追加するだけです。WordPressプラグインとして配布されているものがありますので、これをインストールします。

cookiebotで検索すると出てくる

有効化すると、[設定]メニュー配下に[Cookiebot]という項目が表示されます。Cookiebot IDとLaunguateの設定を求められるので、入力しましょう。

Cookiebot IDは[Your Scripts]タブから確認できる[Domain Group ID]をつかいます。

ちなみに、登録したドメインと異なるドメインに使用すると、consoleにwarningを吐かれます。

Shifterだからしかたない。
generate -> publish後のドメインではちゃんと動きました

Google Analyticsなどの計測タグを書き換える

Google Analyticsなどの計測タグを、cookie同意後のみ動作するようにする必要があります。ドキュメントを読む限りscriptタグのtypeを変更しろというふうに記述されています。

WP Total Hacksを使っている場合は、タグ挿入画面をそのまま書き換えておきましょう。プラグインが自動挿入している系は、対応を待つか別プラグインへの切り替えの検討が必要かなと思います。

変更前のサンプル

<script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
    ga('create', 'UA-00000000-0', 'auto');
    ga('send', 'pageview');
</script>

変更後のサンプル

1行目のscriptタグだけ表記が変わります。

<script type="text/plain" data-cookieconsent="statistics">
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
    ga('create', 'UA-00000000-0', 'auto');
    ga('send', 'pageview');
</script>

表示を確認する

最後に設定した内容が反映されているか確認しましょう。一度同意アクションをとると以降ダイヤログが表示されなくなりますので、シークレットウィンドウを利用することをおすすめします。

おわりに

Cookieの個別制御などを自力でやるのはつらみしかないですが、cookiebotを使えばだいたいよしなにしてくれます。

有料プランはページ数に応じて料金が変わるスタイルとなっています。

一番高いプランでも2018/05/11時点相場で月額5,000円未満くらいなので、更新や多言語対応・地域別の処理などを考えると高くない投資かなと思います。

[PR]WordPressの入門書共著しました

ローカル環境の構築からテーマ作成・サイトの運営やコミュニティの紹介など、
「WordPressを触って終わり」ではなく、仕事でできるようになるには何が必要かがわかるようになる内容になっています。


(目次)
Lesson01:WordPressをはじめよう
Lesson02:必要な環境を整えインストールする
Lesson03:初期設定をしよう
Lesson04:コンテンツの追加・編集とナビゲーションの設定
Lesson05:テーマとプラグインによる外観カスタマイズ
Lesson06:プラグインによる機能の追加
Lesson07:ローカル開発環境をつくろう
Lesson08:テーマ作成の第一歩〜PHPとテーマの基礎
Lesson09:テンプレートファイルの作成
Lesson10:各種テンプレートファイルの作成
Lesson11:テーマカスタマイザーの実装
Lesson12:WordPressを本番環境へデプロイする
Lesson13:サイトの広報と集客
Lesson14:サイトの運営と管理
Lesson15:もっとWordPressを使いこなす・学ぶ

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です