「かんたん背景画像」は、ブログの背景画像に、ご自身のお好きな画像を管理画面から
手軽に変更できる機能です。

管理画面からの設定手順は下記です。

任意の画像を背景に設定する方法


  1. デザイン選択タブから、イメージの下に背景と書かれているデザインが、
    ご自身がアップロードした画像を適用できるデザインとなります。

  2. かんたん画像4-1

    背景マークがない、独自のデザインを適用したい場合は、本ページ最下部の内容をご参照ください。
    未対応テンプレートへの導入方法

  3. 任意の背景デザインを選択すると、プレビューボタンが表示されるので、
    ボタンをクリックし、デザインを確認後、実行ボタンをクリックします。

  4. かんたん画像14


  5. ブログ設定>デザイン / ブログパーツ設定>PCをクリックします。


  6. かんたん画像1


  7. タイトル/背景タブから、かんたん背景画像のアップロードボタンをクリックし、
    任意の画像を選択します。

  8. かんたん画像3

    ※かんたん背景画像に登録できる画像の種類はjpg、gif、pngとなっています。

  9. ご自身のブログの背景に、任意の画像が表示されているかご確認ください。

  10. かんたん画像5

    ※背景画像は横幅940px以上をお薦めいたします。
    ※画像アップロードの最大サイズ(容量)は、2MBです。


小さい画像を利用し、パターン画像を背景に設定する方法


小さい画像を利用し、パターン画像を背景としたい場合は、下記手順をご参照ください。
<サンプル>
かんたん画像15


  1. カスタマイズにあるCSSをクリックし、/* かんたん背景画像 */の下にある background-size: cover; を検索してください。

  2. かんたん画像7


  3. background-size: cover; を background-size: auto; に変更し、保存ボタンを
    クリック。

  4. かんたん画像8


  5. デザインの中には、 /* かんたん背景画像 */の下に background-size: coverがない場合があります。
    カスタマイズ>トップページ個別記事ページカテゴリアーカイブ月別アーカイブにありますため、こちらもあわせてご確認ください。

  6. かんたん画像11

    ※背景デザインの中には、上記いずれも当てはまらない場合もあります。



未対応テンプレートへの導入方法

かんたん背景画像機能に未対応のテンプレートでもあっても、テンプレートに特定の独自タグを導入することでこの機能を利用することができます。

使用する独自タグ:
<$BlogBackgroundImageUrl$> : 背景画像の表示タグ
※「独自タグ」については「独自タグについて」をご覧ください。

<$BlogBackgroundImageUrl$>という独自タグを以下のようにテンプレートに記述してください。
<body class="default_2010 index"<IfBlogBackgroundImageUrl> style="background-image:url(<$BlogBackgroundImageUrl$>);"</IfBlogBackgroundImageUrl>>
<IfBlogBackgroundImageUrl>は、背景画像が設定されているかの条件タグ