2010/05/30

Blogger テンプレート デザイナー の背景画像を変更する方法

【2011/09/23現在のテンプレートデザイナー】

Bloggerのテンプレート デザイナー機能は、相変わらずとても強力ですw
しかも、背景画像を自分で指定する機能が標準搭載されました(`・ω・´)b

実際の設定の仕方は以下から。

モバイル向けのテンプレも設定出来るようになりましたねw
まず、Bloggerにログインしてダッシュボードを開きます。
メニューから『テンプレート』をクリックし、上図のように「ブログで使用中」のテンプレートで『カスタマイズ』をクリックします。

徐々に機能が増えてますw嬉しいですねww
Bloggerテンプレートデザイナーが開いたら、左側のメニューから『背景』をクリックし、
上図のように「背景画像」右の下向き矢印をクリックします。

「背景画像を選択」画面が開いたら、左側メニューから『画像をアップロード』をクリックします。
すると上図のような画面が開きますので、『ファイルを選択』ボタンをクリックして背景にしたい画像を選択しますw
選んだ画像をクリックした状態で右下の『完了』ボタンを押し、背景設定を終えます。

あとは、テンプレートデザイナーで『ブログへ適用』ボタンを押せば、背景が切り替わります(`・ω・´)b


【旧バージョンのテンプレートデザイナーでの話】

「自分で指定した画像を背景に指定する」というカスタマイズが、標準機能ではできませんでした。
ですから、Bloggerのダッシュボードで「デザイン - HTMLの編集」から変更するという方法を
とらなくてはいけませんでした(  ´・ω・)

一応、そのころの方法も残しておきますw

1. まずは画像を用意します。
 「さくらサーバー」など素敵なサーバーが使える環境の方であれば、そこに『使用する画像』を
 アップロードすると良いと思います。
 サーバーを持ってない方の場合は、以下のような方法でもいけそうです。
  • Bloggerの「投稿」画面で「作成」タブを選択した状態で、『画像の挿入』ボタンを押す。
  • 「画像を追加」画面で「このブログから」タブを選択し、使用する画像をUploadします。
  • 「投稿」画面で「HTML の編集」タブを選択し、『src="(画像URL)"』というようなフォーマットで書かれている部分を見つけて、この画像のURLをメモします。
この他にも、Google Siteを利用してファイルをアップロードするという手もありますw

2. Bloggerの「デザイン - HTMLの編集」画面で使用する背景画像を書き換え
 『variable name="body.background" 』で始まる箇所を検索で探します。
 その後に『description』や『type』など各種パラメータが設定されていますが、
 『value="#FFFFFF url(****) no-repeat scroll top center』というような部分を見つけます。

 上記の『***』の部分を手順1でアップロードした画像のURLに書き換えて、
 『テンプレートを保存』ボタンを押す。

以上で、自分のBlogの背景が指定した画像に変更されたはずです(`・ω・´)b

0 件のコメント: