アメブロdeアクセスアップ

すごいアメブロテンプレート 背景画像を変更する方法 | アメブロのテンプレートやツールを使って、アクセスアップする方法やアメブロカスタマイズの方法をご紹介します。

すごいアメブロテンプレートのサンプルサイトでは、
いろいろな実験をしています。
今回は、背景画像を変更してみましょう。

 

 

 

 

 

すごいアメブロテンプレートで、ブログを着せ替えると、
背景画像が、シンプルです。

そして、グレーなんですね。

 

 

これは、グレーの画像を貼っているんです。

 

私がサンプルで使っているのは、グリーンなんですが、
ちょっと暗いイメージかしら?

 

 

これは、これでとってもいいのですが、
明るい感じにするには、背景画像を変更するのが、一番早いですよね。

 

 

 

背景画像を変更するだけで、
ブログのイメージは、変化してきます。

 

 

やってみましょう。

 

 

 

これは、比較的簡単です。
他のテンプレートにも、応用できるかと思います。(たぶん・・・・)

 

 

hana2編集手順

 

背景画像となる画像を用意します。
ご自分のイメージでね。

 

 

私は違うテンプレートに使っているものを、
ちょっと使用してみました。

 

 

マイページより、デザイン変更 → CSSの編集をクリック。

 

CSSを変更する画面になりますが、
ここで、使用する画像をアップロードすることができます。

 

画像を選んでアップロードしてください。

(画面の上の部分にあります!!)

 

背景画像アップロード

 

次にCSSに移ります。

 

 

今使っている、CSSをすべて選択して、コピーしテキストやメモに保存しておきます。
(これは、バックアップのためです。)
元に、戻したいときこのCSSを貼れば、元のデザインに戻りますからね。

 

 

 

illust2012_thumb

 

この時、ドラックすると、ソースが書けたりするので、
ショートカットを使いましょう。

 

CSSの記載してある部分のどこでもいいので、
マウスポインターを合わせます。

 

control + A で、全選択

control + C で、コピー

control + V で、メモやテキストに貼りつけ

 

 

 

ここの順番で、貼って保存しましょう。

 

 

 

CSSの部分に戻って、

/*■■■ layout Setting ■■■*/

という、コメントアウトを探してください。

 

上から下がれば、見つかります。
もし見つからない場合は、 control + F検索窓が開きます。

その窓に、【layout Setting】と入力(コピー)し、検索をクリックすると、
探していた文字がハイライトされます。

 

その下の部分。

background:url(http://e32.in/bf/img/design1/2c/green/bg.png)

 

が、背景画像の設定になっています。

CSS背景画像変更

 

このURLを変更します。

 

 

さきほどアップロードした画像を使いたいので、
画面でいうと、CSSが記載している上の方に、
先ほどアップロードした部分がありますね。

アップロード後そこに戻って、アップロードした画像の下に、パスが表示されています。

 

 

パスををコピーしてください。

 

 

 

 

 

パスが表示されている部分に、カーソルを持っていくと、
パス全体がハイライトされるので、control + C でコピーしてください。

 

 

そして、CSSに戻って、
background:url( の後に、貼りつけます。

こんな感じ。

 

パス貼りつけ後

 

 

 

保存する

 

 

 

 

←貼り終わったら、表示を確認で、ブログを確認してください。

 

 

 

 

 

 

こんな感じ。

 

 

背景変更後

 

 

背景が変わりましたね。

 

どうでしょうか?

 

 

 

違う雰囲気になりましたね。

 

 

これで、OKならば、保存で完了です。

 

ね、簡単ですね。

 

 

背景画像を作成するのが、面倒な場合は、
無料素材などから、好きな画像を選ぶといいですね。

 

すごいアメブロテンプレートをお持ちの方は、
ぜひ、お試しあれ!!

 

 

 

 

サンプルテンプレートは、
すごいアメブロテンプレートを使用しています。

 

すごいアメブロテンプレートレビュー

 

 

 

テンプレートデザイン・カスタマイズのこと、アクセスアップのこと、
アメブロのことならお任せあれ!

Copyright © アメブロdeアクセスアップ All Rights Reserved.