投稿日: 2017/04/07
投稿者:webコラム

こんにちは! ライターのモモタロウです。
今回は、JUGEMブログカスタマイズ ヘッダー部分の画像を変更する方法についてお伝えします。
テンプレートをカスタマイズ用に変更しよう
まず、JUGEMブログのテンプレートをカスタマイズ専用に設定します。

メニューバーの「デザイン」→「PCデザイン・フォント変更」をクリックします。

「テンプレートを追加する」をクリックします。
メニューバーの「カスタマイズ用」をクリックします。

下の画像のように、いくつかのテンプレートが用意されています。

今回は、「custom05ex」を選択しました。
下の画像の通りです。

画像をアップロードしよう
次に、ヘッダー画像をアップロードします。
メニューバーの「データ管理」→「画像の管理」→「画像アップロード」にて、
画像をアップロードします。

アップした画像の「画像の説明/画像を呼び出すタグ」のURLを控えておきます。
CSSを編集しよう
次に、CSSの記述を変更します。

メニューバーの「デザイン」→「HTML・CSS編集」をクリックします。
CSS編集フォームで、デフォルトの
width:760pxを630pxに変更します。
eigth:180pxを427pxに変更します。
その後、下記の部分について、
background-image:url(
http://img-cdn.jg.jugem.jp/e43/3543405/201703●●_953315.jpg);
先ほどの画像がアプロードされた先のURLにカッコの中を置き換えます。
ブログを確認すると・・・
まとめ
如何でしたか?
JUGEMブログのヘッダー画像を変更すれば、オリジナリティーの高いブログになります。
ぜひ、試してみてくださいね。