からくりブログ

自社開発ツールページの利用規約表示がポップアップ表示ではなかったので、ポップアップ表示になるようにプラグインを導入しました。

今回導入したプラグインは PopupMaker です。

PopupMaker とは、WordPress にて作成したサイトに、ポップアップ表示機能を簡単に追加することができる専用プラグインです。

インストール方法は以下の通りです。

1. WordPress のダッシュボード画面を開く
   
2. 左側のメニューから「プラグイン」→「新規追加」を選択
3. 検索画面のキーワード欄に「Popup Maker」と入力し「今すぐインストール」を選択
   
4. インストールが完了後に「有効化」ボタンが表示されるのでクリックして有効化する

使い方は以下の通りです。

1. WordPress のダッシュボード画面を開く
2. 左側のメニューから「Popup Maker」をクリックしてポップアップ一覧画面を表示します
   
3. 「create new popup」を選択
   1. 「Popup name」には他のポップアップと区別できるような名前をつけてください (画像の①)
   2. 「Popup title」に設定した内容は実際のポップアップの見出しとして表示されます (画像の②)
   3. 一番大きい空白の箇所にはポップアップで表示する内容を記載します (画像の③)
   4. 上記の記載を完了次第、右側にある「公開」を選択する (画像の④)
      
4. 作成後にポップアップ一覧画面のCSSクラスの欄にある文字列をコピーする
5. ポップアップ機能を使用したいクラスに以下のように先ほどコピーした文字列を付与する
   (例) <input class="popmake-143" type="button" id="b143" value="開く">

プラグイン導入から実際のポップアップ表示まで行ってみましたが、やり方さえわかれば簡単にポップアップ表示が実装できるのでおすすめです。
他にも PopupMaker で表示するポップアップの表示方法なども色々といじれるので、時間があるときにまた試してみたいと思います。