【Cocoon】ヘッダー (一番上の部分)に背景画像を入れる

Header background image ブログ作成

あまりにも殺風景なサイトなので、ヘッダー部分に背景画像を入れました。

個人的に掲載する画像を持っていなかったので、ヒトデせいやさんやmikimiki webスクールのYouTube動画を参考に、O-DAN というフリー素材サイトを活用することにしました。

O-DANは、海外のフリー素材サイトを一つにまとめてくれているとても便利なサイトです。

その中のPexelsが提供していた画像をダウンロードして、背景画像に設定しましたが、初心者ならではのすったもんだもございました。

まずODANを検索しサイトを覗くと、それはそれは素敵な画像がたくさん掲載されています。
どれを使用するか迷います。

とりとめもない浮遊状態のブログなので、ふわふわと流れる雲をイメージに「空」と検索。
好きな画像があり、さっそくダウンロードしてみました。

ダウンロードフォルダーから画像をペイントで開いて、Manabuさんが推奨していた横幅を1200pxにサイズ変更しました。(とてもマニュアルなやり方だと思います。)

いよいよCocoonでヘッダー背景画像へ

手順
1.Cocoon 設定 → ヘッダー → 画面を下にスクロール → ヘッダー背景画像
2.選択 → ファイルをアップロード → さきほどサイズ変更した画像を選択して開く
3.メディアライブラリーから使用する画像を選択して右下に出てる「画像の選択」をクリック

これでヘッダーに画像が入りました。

小さなことですが、感動です。すべてがはじめの一歩!

画像が入ったと安心したのもつかの間、ロゴ内の文字が真っ黒・・・読みづらい。
どうしたらいい? まず考えたのは、ヘッダー色(ロゴ部)を白に設定すること。

ところが、ヘッダー内のキャッチフレーズ部分が何をやっても灰色になってしまう。

何をやっても…
検索しても解決策が出てこない…

そしてあきらめました…

最終的に、Cocoonで設定していたスキンのテーマを「みるらいと」から風塵さんの「tecurio earth」に変更したら問題解決。

ここまでくるのに1時間以上要しました。
とても解決した!という結果ではありませんが、こういう手もあるということで。

あきらめも肝心です。
初心者あるあるです。

毎回、新しいハプニングに直面しては、都度問題を検索して、多くの方の力を借りながら少しずつ前進(?)しています。

YouTubeやBlogで多くの方が情報を発信してくださるので、その一歩が踏み出せています。

感謝!

タイトルとURLをコピーしました