稼げる副業でお小遣いを稼ぐ方法

稼げる副業でお小遣いを稼ぐだけじゃなく、料理や映画アニメ、趣味などメモにも使っているブログ

副業で稼ぐ仕組みの作り方

ワードプレスのログイン画面のロゴを変更する方法

投稿日:2015年1月10日 更新日:

ワードプレスのログイン画面のロゴをオリジナルのものにする際のカスタマイズ方法をご紹介いたします。

はじめに

ホームページを制作した後にクライアントにログイン情報を渡した際にワードプレスのロゴが出ているよりもわかりやすい物が出ている方がクライアント的にも嬉しいですよね。

注意事項

ワードプレスのバージョンによってこのカスタマイズが使えない場合もあるので要注意です。

ロゴを用意しよう

まずは管理画面に表示したいロゴを準備して下さい。

ログイン画面と同じサイズのロゴを希望の場合は80×80pxの画像が良いでしょう。

80×80のロゴ

logo2

ただ、私の場合は自社サイトのロゴを表示させる目的があったので274×63pxのサイズのロゴを表示させるようにしました。

274×63のロゴ

logo

ファイルを確認しよう

管理画面のロゴを変更させる場合、一番簡単なのはテーマファイルをいじって行く内容です。いじるファイルはfunctions.phpと言うファイルです。

もしもオリジナルのテーマを使用している方でfunctions.phpがない方は/wp-content/themes/オリジナルテーマ/にfunctions.phpファイルをアップしておきましょう。

そして、管理画面に表示させたいロゴの画像も同じく/wp-content/themes/オリジナルテーマ/にアップしておきましょう。

カスタマイズしていこう

ワードプレスの管理画面でロゴをオリジナルの物に変更する場合は基本的にcssをいじるだけでOKです。
ただ、直接コアファイルをいじるとワードプレスのアップデートがある為に修正しないといけなくなるのでそういった影響をうけないテーマファイルとして以下の情報を追加して下さい。

function my_login_logo() { ?>
    <style type="text/css">
        body.login div#login h1 a {
            background-image: url(<?php echo get_stylesheet_directory_uri(); ?>/logo.png);
            background-size:274px 63px;
            width:274px;
            height:63px;
        }
    </style>
<?php }
add_action( 'login_enqueue_scripts', 'my_login_logo' );

こうする事で管理画面のロゴを変更する事が出来ました。

変更前
klogo1
変更後
klogo2

注意

もしもデフォルトのtwentyelevenやtwentyfourteenを使っているのであれば、テーマファイルもよくアップデートがあるので、出来ればプラグインとして作成する事をおすすめします。

ロゴをマウスオーバーすると

klogo3

ロゴをオリジナルの画像に差し替えたとしてもロゴの部分にマウスを乗せるとPowered by WordPressと出て、クリックするとワードプレスのサイトに飛んでしまいます。

これでは、せっかくオリジナルのロゴに変更したのに意味がありませんよね。なんでこの部分もカスタマイズしていきます。

先ほど追加した情報の下にこの情報を入力します。

function my_login_logo_url() {
    return 'https://www.moco358.com/';//ロゴにリンクさせたいURL
}
add_filter( 'login_headerurl', 'my_login_logo_url' );
 
function my_login_logo_url_title() {
    return '副業ブログ';//マウスオーバー時に表示させたい文字
}
add_filter( 'login_headertitle', 'my_login_logo_url_title' );

klogo4
こうする事でマウスオーバー時に「副業ブログ」と表示され、クリックすると私のこの稼げる副業でお小遣いを稼ぐ方法に飛んでくるようになりました。

以上でワードプレスのログイン画面のロゴを変更する方法を終了致します。

さいごに

オリジナルのシステムとして

ワードプレスを使ってホームページを制作し、クライアントの納品する時にログイン画面にクライアントのオリジナルロゴにすると喜ばれると言う記事を見つけたので試してみました。

私の場合はクライアントのロゴを表示させると言うよりも自社のロゴ表示させて自社ブランドをより強化する為に使用させて頂きました。

ただ、ロゴを変更するだけよりも管理画面をまるまる変更させる方がよりブランド化させる事が出来るのでしょうが、正直まだそこまで手がまわらないので時間がある時にやってみようかなと思います。

-副業で稼ぐ仕組みの作り方
-, ,

執筆者:


comment

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

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

ワードプレスのプラグインCustom Field Suiteの使い方

Custom Field Suiteを入れたもののどうやって使うんだろうって人向けの細かい使い方をご紹介いたします。 関連記事: カスタムフィールドで画像を出力する時のヒント【ワードプレス】 簡単にカ …

ワードプレスで503が出た時チェックしたいところ

ワードプレスをインストールしているさくらサーバーである日急に503が出たのでどうすれば元に戻ったのかご紹介いたします。 関連記事: EC CUBEでSSLページのみに表示させる方法 一つのプラグインで …

JetpackのWP.me 短縮 URL

ブログ記事を紹介する時、長いURLをコピペするのが面倒な人もいらっしゃるでしょう。そんな人の為の機能です。 関連記事: カスタムフィールドで画像を出力する時のヒント【ワードプレス】 PDFファイルの作 …

【WordPress】htaccessでhttpsにリダイレクト

WordPressでhttpsにした際にhtaccessを使ってリダイレクトさせる方法をご紹介いたします。 関連記事: ECCUBE2系から4系で商品一覧ページのリダイレクト カスタムフィールドで画像 …

twitterをHPに埋め込みしてみたよ

twitterの埋め込みって昔よりも簡単になってました 関連記事: Biz Calendarを使いやすくカスタマイズ ネスタリゾートを100%遊びたい人へ【宿泊あり】 iPhoneアプリ内の広告を無料 …