WordPressの管理画面を簡単にカスタマイズできるプラグイン「AE Admin Customizer」 | Knowledge Base

WordPressの管理画面を簡単にカスタマイズできるプラグイン「AE Admin Customizer」

汎用のCMSツールなので仕方ないこととはいえ、Wordpressの管理画面はちょっと質素で味気ない感じがしますよね?これは複数のユーザーで管理する場合だけでなく、個人的にサイトを作っている場合でもやる気やモチベーションに影響すると思います。

【AE Admin Customizer】はCSSなどの知識がなくても管理画面やログイン画面などの色や文字、ロゴなどを簡単に変更できるプラグインです。他にも同様のプラグインはいろいろありますが、個人的には一番使いやすく、「ここを変えたい」という項目が一番充実していると思います。

このプラグインのいいところはいろいろなカスタマイズがメニュー上で行えることに加えて独自のCSSが合わせて使えることです。Wordpressの管理画面やログイン画面のCSSは通常のCSSとは別物なので、同時にカスタマイズできるのはうれしい機能です。

また、設定した内容をエクスポートしたりインポートしたりできるので複数のサイトでデザインを共有する際にはとても便利だと思います。

【AE Admin Customizer】プラグインの基本的な機能・できること

  1. 管理画面でWordpressを使ったサイトであると判別できる部分をカスタマイズする
  2. 管理バーの表示項目をカスタマイズする
  3. ログイン画面・ユーザー登録画面をカスタマイズする
  4. 独自のCSSを適用できる
  5. 設定をインポート/エクスポートする

設定できる詳細な項目については下の使い方を参照ください

この記事の内容について
このプラグイン紹介記事は簡易的に動作テストをした上で紹介していますが以下の点にご注意願います
  1. すべての環境で動作するとは限りません
  2. できる限り最新のバージョンの情報を紹介するようにしておりますが、閲覧される時期によってはバージョンが変わり、仕様が大きく変更されている場合があります
  3. 有料版と無料版がある場合、テストは原則無料版のみで実施しています
  4. テスト環境については文末に記載しています
  5. 使用方法で紹介しているショートコードをコピーして使用すると、環境によっては記号などが文字化けすることがあります。コピーしたのに動作しない場合は特に「”」「’」などの記号を入力し直してみてください。

【AE Admin Customizer】プラグインの設定画面や表示の日本語化と翻訳

当サイトで私が翻訳した【AE Admin Customizer】プラグインの日本語化ファイルを配布しています。

翻訳ファイルは

Wordpressプラグイン【AE Admin Customizer】の日本語翻訳ファイルのダウンロードページです。

からダウンロードできます(ダウンロードの方法や日本語の適用方法なども解説しています)

翻訳することで設定が容易になり、重要な項目の設定漏れも少なくなりますから日本語化をお勧めします。

【AE Admin Customizer】プラグインのインストールと設定

インストールと設定方法

インストールはプラグインの新規追加でプラグイン名で検索してインストールするか、ページ先頭の画像をクリックして表示されるWordpressのプラグイン公式配布ページがダウンロードしてからアップロードインストールします。

インストール方法の詳しい解説は

Wordpressと言えばさまざまな追加機能を使って思い通りの表現や動作ができるのがブログやHTMLで作ったサイトと違って楽しいところですね。ここでは基本的なプラグインの導入の仕方とトラブルが発生した場合の対処方法について解説します。
を参照ください

【AE Admin Customizer】プラグインの基本的な使い方

設定はダッシュボードに追加される【AE Admin Customizer】をクリックして行います

設定できる項目は次の通りです

「基本設定」タグ

  1. 管理画面上のロゴ画像を変更する
  2. 管理画面の下にあるワードプレスのバージョン情報を非表示にする
  3. ソース上のスクリプトとスタイルシートのバージョン情報を非表示にする
  4. (HTML/RSS)のジェネレータータグを非表示にする
  5. 管理画面・編集画面の「ヘルプ」タブを非表示にする
  6. 表示オプションタブを非表示にする
  7. 「ようこそ」ウィジェットを非表示にする
  8. WordPressニュースウィジェットを非表示にする
  9. 最下部の「Wordpressのご利用ありがとうございます」の文字列を変更する

「管理バーのデザイン」タグ

管理バーとダッシュボード左サイドバー、管理画面の文字、ボタンデザインのカスタマイズができます
【管理バー部分】

  1. 背景色
  2. メニューの文字色
  3. マウスオーバー時のメニュー文字色
  4. メニューのアイコン色
  5. マウスオーバー時のメニュー背景色

【サイドバー部分】

  1. 背景色
  2. 親項目のマウスオーバー時と選択項目の背景色
  3. 子項目の背景色
  4. メニュー項目の文字色
  5. メニュー項目のマウスオーバー時の背景色
  6. メニューアイコンの色

【文字】

  • 文字色
  • リンク色
  • マウスオーバー時のリンク色
  • 【ボタンのデザイン】

    1. 標準のボタン色
    2. マウスオーバー時のボタン色
    3. 標準時のボタン文字色
    4. マウスオーバー時のボタン文字色
    5. プライマリボタンの色
    6. マウスオーバー時プライマリボタンの色
    7. プライマリボタンの文字色
    8. マウスオーバー時プライマリボタンの文字色

    「ログインと新規登録」タグ

    ログインした状態でログイン画面が確認できないことが考慮されており、プレビュー画面を表示して編集することができるようになっています。

    【背景全体】

    1. 背景色
    2. 文字色
    3. リンク色
    4. ボタン色

    【入力欄】

    1. 入力ボックスの色
    2. 入力ボックスの枠線色
    3. ボックスの角を丸くする
    4. 丸みの半径
    5. 入力ボックスの枠線の太さ
    6. ボックスの幅

    【背景画像】
    背景全体に画像を挿入できます

    「カスタムCSS」タグ

    管理画面・ログイン/ユーザー登録画面それぞれに対するCSSの記述ができます

    「インポート/エクスポート」タグ

    設定のインポート・エクスポートができます

    プラグインのテスト環境&個人的評価

    最後に【AE Admin Customizer】を動作確認した際の環境と個人的な評価を書いておきます。導入の検討や参考になれば幸いです。

    テストした環境

    1. WordPressのバージョン:4.7.5
    2. PHPのバージョン:7.0
    3. テーマ:Simplicity バージョン2.3.0g
    4. プラグインのバージョン:1.0.7
    5. このプラグインの最新バージョンは1.0.7です。バージョンが異なる場合には設定の仕方や動作仕様が変更になっている可能性があります。

    個人的な評価・感想ほか

      5段階評価

    1. 設定のしやすさ:★★★★★
    2. 使いやすさ:★★★★★
    3. おすすめ度:★★★★★

    上の一覧にもある通り、ここまでカスタマイズできれば十分だと思います。足りない部分はCSSで記述すればいいわけですから、Wordpressの管理画面にまつわるカスタマイズはこのプラグイン1つでできると思います。

    Wordpressの本

    Amazonの人気商品楽天市場の人気商品
    CS Shop
    はじめの一歩! サクサクわかるWordPress 4.x対応 [ 茂木 葉子 ]

    はじめの一歩! サクサクわかるWordPress 4.x対応 [ 茂木 葉子 ]

    1,814 円 (税込) 送料込
    茂木 葉子 天野 裕子 マイナビ出版ハジメノイッポ サクサクワカルワードプレス ヨンテンエックスタイオウ モテギ ヨウコ アマノ ユウコ 発行年月:2016年11月25日 予約締切日:2016年11月22日 ページ数:256p サイズ:単行本 ISBN:9784839959876 Introduction WordPress..
    【中古】 WordPressサイト構築スタイルブック デザイナーのためのテンプレートタグリファレンス+サイトデザインテクニック /エ・ビス..

    【中古】 WordPressサイト構築スタイルブック デザイナーのためのテンプレートタグリファレンス+サイトデザインテクニック /エ・ビス..

    98 円 (税込)
    エ・ビスコム・テック・ラボ【著】販売会社/発売会社:毎日コミュニケーションズ/毎日コミュニケーションズ発売年月日:2006/11/11JAN:9784839921910
    楽天ウェブサービスセンター CS Shop

    プラグインに関するお問い合わせ

    「こんなプラグインないの?」「設定方法をもっと詳しく教えてほしい」「プラグインを少しカスタマイズして使いたい」などのご相談は、こちらのリンクからお願いします(【ココナラ】のサイトへ移動します)。

    ココナラ Wordpress プラグイン探し バナー
    トップへ戻る