MENU

アメブロ 背景画像の設定方法

2020 7/02

ブログの背景を変えると、イメージが一気に変わりますよね。
色を変えるだけでも印象は大きく変わりますし、背景に画像を入れるとさらに印象は変わります。

今回はアメブロの背景の設定方法でも、背景に画像を使う方法についてお伝えしていきます。

目次

アメブロ 背景画像の設定方法

背景を設定する前に、カスタマイズができるようにこちらの設定にしておきましょう。

基本設定は、こちらです。
アメブロカスタマイズをする際の基本手順

※背景画像は、こちらのサイトに色々出ていますよ。

ヘッダー下に背景画像を設定する

CSSのコードは、デフォルトでは下記のようになっています。

そちらを、↓下記↓のように変更します。

/* (1-2) 基本背景
——————————————–*/

background-image: url(★);の★の部分に背景画像をアップした際のURLを入力しましょう。

背景画像を全体に設定する方法

上記の設定はヘッダー部分は影響しませんでしたが、次にお伝えするのはヘッダー部分込みで背景画像が反映する方法です。

background-color: #ffffff;の設定を下記のように削除し

下記を入力します。

background-image: url(★);の★の部分に背景画像をアップした際のURLを入力しましょう。

このように必要な部分のみ背景画像が入ります。

ただし、背景画像は派手な柄を使うと、柄に目を奪われちゃって記事の中身に集中できないので、設定するならさりげない柄や模様がおすすめです。

この記事が気に入ったら
フォローしてね!

この記事を書いた人

メール対応・資料作成・Webサイト管理・SNS運用・ライティング・デザインまでワンストップ対応できるクリエイティブ秘書&ブロガー。

ブログは、フリーランスお仕事系お役立ち記事を載せています。
お仕事依頼はこちらから

目次
閉じる