ブログ

リステップからのお知らせや、ホームページを活用するためのお役立ち情報などをご案内。

WordPressのログイン画面のロゴを変更する方法(バージョン3.4.1の場合)

Pocket

WordPressのログイン画面に表示されるロゴを変更するTIPSです。

こんなところもコアファイルをイジらなくても対応できるのがWordPressの凄いとこですよね。

 

ログイン画面のロゴを変更したイメージ

まず、通常のログイン画面がコレです。

ロゴ画像変更前

 

で、変更するとこんな感じになります^^

ロゴ画像変更後

 

ロゴの変更方法

1.ロゴ画像を準備

まずは差し替えるロゴ画像をあらかじめ作成しておきます。

画像のサイズは元のロゴが幅274px、縦63pxなので、それと同じくらいにしておくと良いです。
ちなみに背景色は真っ白ではなく #FBFBFB です。

ここで作成した画像のファイル名を「login_head.gif」として、テーマディレクトリ内に入れておきます。

 

2.function.phpを書き換え

次に、テーマディレクトリ内の function.php に以下を追記します。

add_action( 'login_head', 'my_login_head' );
function my_login_head() {
  echo '
    <style type="text/css">
    .login h1 a {
      background-image: url(' . get_bloginfo('template_directory') . '/login_head.gif);
    }
    </style>
  ';
}

これだけで作業は完了。簡単ですね。

 

注意点

今回のやり方はWordPressのバージョンが3.4.1の環境で動作を確認しています。

バージョンによってはCSSのクラス名などが異なってくるため上記の記述では差し替わらない場合もありますので、そんなときはデベロッパーツールなどでクラス名を確認してから適宜修正してください。

Pocket

コメントする


次のタグを使うことができます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

トラックバック

トラックバックURL: https://restep.jp/blogs/wordpress-login-logo-3-4-1/trackback/