小説家になろうにて「キモオタでギャルゲー、それって何の罰ゲーム!?」連載中!

WordPress管理画面の背景に任意の壁紙を設定する ~あなたも「このはモード」にしてみませんか?

KUSANAGI for ConoHa
この記事は約4分で読めます。

本記事では、WordPressの管理画面の背景にConoHa応援団長・美雲このはの壁紙を設定する方法を紹介します。
具体的には上の画像みたいな感じです。

もちろん美雲このは以外の壁紙でもできます。
ただConoHa使ってる方は、せっかくですし「このはモード」にしてみませんか?

※このはの画像につき、(C)GMO Internet, Inc.

スポンサーリンク
この記事を読む方へのオススメ

「このはモード」エディタ画面完成イメージ

通常画面は最初の画像を御参照ください。
エディタ画面はこんな感じになります。

どの画像を選んでも透明度を変えることで対処できます。

スポンサーリンク

美雲このは壁紙のダウンロード先

美雲このは公式ページの壁紙コーナーからダウンロードできます。

美雲このはオフィシャルサイト | 神様目指して修行中!みんな応援よろしくねっ!
このはの情報がい~っぱい!ぜひチェックしてね♪

色々ありますのでお好きなものを選んで下さい。

スポンサーリンク

実装手順

子テーマを使っていることを前提に説明します。

子テーマ直下に画像ファイルをアップロードする

ここでは名前を「conohawall.jpg」とします。

画像ファイルは予め圧縮して軽量化しておくこと!
圧縮はTinyPNGで。

TinyPNG – Compress PNG images while preserving transparency
Make your website faster and save bandwidth. TinyPNG optimizes your PNG images by 50-80% while preserving full transparency!

なお、画像をアップロードし忘れると、とんでもないことになります。

美雲このはに去られた瞬間WordPressが動かなくなった
本記事は私のトラブルシューティング奮闘記。 釣り感満載なタイトルの意味は、お読みいただければわかります。 最初に断っておきますと、トラブルの原因は人災。...

functions.phpにコードを追記する

以下のコードを追記してください。

/*このは管理画面*/
// フックする関数
function custom_enqueue($hook_suffix) {
 if( 'post.php' == $hook_suffix ||
 'post-new.php' == $hook_suffix ||
 'edit.php' == $hook_suffix ||
 'index.php' == $hook_suffix) {
 // 読み込むCSSファイル
 wp_enqueue_style('custom_css', get_stylesheet_directory_uri() . '/custom.css');
 }
}
// "custom_enqueue" 関数を管理画面のキューアクションにフック
add_action( 'admin_enqueue_scripts', 'custom_enqueue' );

DigiPress様の参考記事

特定のWordPress管理画面でのみ独自のCSSやJavaScriptを読み込む方法
自作で WordPress のテーマやプラグインをつくる場合、管理画面だけに自前の CSS や JavaScript を読み込ませたいときがあります。 そんなときは WordPress のアクションフックを使って色々と方法がありますが、ここでは1回のアクション関数で CSS もスクリプトも読み込んで、さらに対象の管理画...

cssファイルを作成して子テーマ直下にアップロードする

「custom.css」という名前でcssファイルを作成。
以下のコードをコピペします。

.wrap {
 opacity: 0.9;
}
#edit-slug-box.hide-if-no-js {
 background-color: #FFF;
}
#wpwrap {
 background-image: url("conohawall.jpg") !important;
 background-position: center center !important;
 background-repeat: no-repeat !important;
 background-attachment: fixed !important;
 background-size: cover !important;
}

完成

ブラウザをリロードすると、このはモードになっているはずです。

  • エディタの文字が読みづらい
  • もっとこのはをくっきり見たい

などの場合は、CSSの以下の数値を調整してください。

 opacity: 0.9;
スポンサーリンク

まとめ

解答者の写真
簡単でしょ?
速い、安い、応援団長がかわいい♪
これであなたもConoHaを使いたくなぁ~る

質問者の写真

もうConoHa使ってるから、この記事読んでくれてるんじゃないの?
アドセンス有りでもPageSpeed Insightで100点満点!

超光速サイト実行環境KUSANAGI&WEXAL。
コスパ抜群のレンタルサーバーConoHa。
もっと知りたい方はボタンをクリックしてください。
特集記事の目次が開きます。

この記事を書いた人

広島市内のパチンコホール勤務。
3号機時代からのパチンカス。
ADHD、精神障害者手帳3級所持。
慶應義塾大学商学部卒、専攻はマーケティング(広告・宣伝)
国家一種試験経済職の資格で公安調査庁に入庁。
在職時は国際テロ、北朝鮮を担当。
「小説家になろう」の底辺作者。
WordPress記事は素人の備忘録です。

天満川鈴をフォローする
KUSANAGI for ConoHa
スポンサーリンク
きもおたねっと。
タイトルとURLをコピーしました