ヘッダに背景画像を加える【第9次ブログ改造計画】
どうもこんばんわ。
昨日は知らない間に初めてある成果を得ることができました。
昨日アドセンスの初収益がありました！
ほんの僅かかも知りませんが私にとっては大きな一歩です。
これからもますますブログを頑張っていきたいと思います！https://t.co/GrN6HRmF2Q pic.twitter.com/tX8ccx9UNm— マッキヰ (@Macky1991_MBP) 2019年8月16日
私のブログから初めての収益が発生してました。
初めてなので当然大きい額ではないですが
私にとっては価値ある収益と思いますし、
今後も続けて頑張れる活力をいただけました。
このブログをより良い見た目にしていくためにも
昨日に引き続き今日もブログのカスタマイズをします。
ヘッダに背景画像を追加
以前よりブログのトップページを見るたびに物足りなく感じてました。
その一つにブログタイトルのヘッダの背景がシンプルすぎて
とても地味すぎる印象を与えられて見栄えもあまりよくありません。
ヘッダの背景に画像を加えていきますが今までのように
ZENO-TEALのデモサイトを参考にしてみます。
ZENO-TEALのデモサイトを参考にするも…
今回はこちらの記事を参考にヘッダの背景画像を取り組んでいきますが
一つ問題が発生しました。
コードをコピペしてはてなフォトライフにアップロードした背景画像のURLを所定の位置に入力してみたのですが
なぜかヘッダの背景に画像が反映されませんでした。
原因を追求していくたびに時間がただ過ぎていくだけなので
ここは一旦引いて別の手段でヘッダの背景に画像を加えます。
シンプルに画像をアップロード
大人しく一番最もシンプルな方法でヘッダの背景に画像を加えていきます。
「ダッシュボード」の「デザイン」にある「カスタマイズ」の「ヘッダ」をクリックしたら
「タイトル画像」にある「画像のアップロード」の「ファイル選択」をクリックして
フォルダに保存してあるヘッダの背景にしたい画像を「選択」します。
「位置の調整」を終えたら「表示設定」の「画像とテキストを表示」にチェックが入ってることを確認して
「変更を保存する」をクリックして作業完了です。
いい感じに画像がヘッダの背景に設定されました。
しばらくこの方法で設定したままにします。
何かまた変更を加えるときは別の記事を参考にします。
オススメ記事の画像サイズを揃える
ブログのヘッダ下にあるオススメ記事の画像が不揃いであるために
テキストもそれにつられて不揃いになってしまうがとても気がかりでした。
ZENO-TEALのデモサイトにある記事を参考に修正してみます。
「ダッシュボード」の「デザイン」にある「カスタマイズ」の「ヘッダ」をクリックしたら
「タイトル下」のボックス内に記事にあるコードをコピペして
オススメ記事のタイトルやURLなどを書き換えて「変更を保存する」をクリックして作業完了です。
オススメ記事の画像サイズが揃った上に
画像の下部にタイトルが半透明の背景付きで揃えられて
見栄えがよくなりました。
先日のGoogle Adsenseの初収益は日々ブログをカスタマイズし続けることによって
得られたはじめての成果だと思います。
今後も引き続きブログで気になった箇所があれば進んでカスタマイズと修正をしていきます。
ここまでお読みいただきありがとうございます。
次回の記事をお楽しみに。