デザインカスタマイズ
★Bloggerは他の無料ブログサービスに比べカスタマイズ性が高いのも特徴のひとつ!
一般的な無料ブログサービスの場合には、テンプレートを適用したら、タイトルの大きさや位置、色など、決められた箇所のカスタマイズ画面があり、あまり大した変更を加えることができないのが一般的です。
もちろん、自作のテーマを使える場合もあるのでこの場合はかなりカスタマイズできますが、決して一般的ではないですし、素人には無理でしょう。
Bloggerの場合にはカスタマイズ画面が結構充実していて、素人でもかなりカスタマイズして、オリジナル的なデザインに変更することが可能です。
さらに、Bloggerは海外ユーザが多いので、インターネット上でたくさんのテンプレートが紹介されていて、それをダウンロードしてして利用することもできます。こうした点を考えると、Bloggerによるブログサイト運営はかなりオリジナリティの高いデザインを行うことができるといっていいでしょう。
1.管理画面からテンプレートをクリック。
左サイドのメニュー「テンプレート」をクリックするとテンプレートの一覧が表示されます。この画面はお好きなテンプレートを選択する画面ですが、実はここに並んでいるテンプレートの数はたいしたことはありません。カスタマイズが基本なので、ごく基本的なデザインを選択すると考えればいいでしょう。お好きなテンプレートを選択するとそのテンプレートが上の「ブログで使用中」に表示されます。次に、その下にある「カスタマイズ」をクリックしてください。
2.テーマのカラーバリエーションと背景を選択
以下の場合は、シンプルなテンプレートを選択しています。
ここでは右上に並んだ4つのテンプレートの下にある小さなテンプレートから基本色のバリエーションを選択することができます。
次に、左のメニューから「背景」を選択して、背景画像や背景色を変更します。
中央上に小さな色のボックスが並んでいますが、これは文字や背景に使う基本色です。お好きなものをクリックするとすぐに画面下の方にあるテンプレートに色が反映されますので、見て確認することができます。ここではおおよその色を決め、どうしても気に入らないところは後で変更します。
背景画像を使用しているテンプレートを使用している場合には、「背景画像」をクリックすると以下のように背景に利用できる画像が開きます。お好きなものをクリックするとすぐに下のデザインに背景画像がで適用されます。下のような場合には、ブログの部分がほとんどなので少し画面を広げて背景を確認しましょう。
また、あらかじめ背景に利用したい画像を用意している場合には開いた画面の一番上のメニュー「画像をアップロード」をクリックしてファイルをアップロードして利用することができます。画像サイズは1800×1600です。
適用した変更が良ければ右上にある「ブログに適用」をクリックしてデザインを確定します。
3.次にブログの左右幅を調整しましょう。
以前は、パソコンのモニターが小さかったので800px~900px以下がほとんどでした。今でも多くのサイトはこの程度ですが、最近のモニターは大きいものが多くなったので1000px~1100px程度でも大丈夫です。しかし、古いモニターを使っている方もまだいるので1200を超えるのは無理があるでしょう。
以下の画面はブログの左右幅を調整する画面です。最大で1500pxまで可能ですが、一般的には1000px前後で十分でしょう。サイドバーを配置しないで1カラムの場合はもっと狭くしてもいいでしょうし、3カラム~4カラムの場合で、サイドバーをゆとりを持った幅にしたい場合には1100~1200px程度にするのも可能でしょう。(※3カラムのレイアウトを選んでいる場合には、サイドバーの調整がもう一つ表示されます。
4.次に「レイアウト」をクリックしてカラム数や配置を設定しましょう。
「レイアウト」からはサイドバーなど(カラム)の数やその配置方法を選択することができます。あらかじめ選択しているレイアウトは2カラムで右にサイドバーとして配置されています。これを3カラムにすることも3カラムのサイドバーのどちらかをさらに2つに分けた4カラムに設定できます。
上の設定を4カラムに変更したのが以下の設定です。
4カラムに設定したので下のレイアウトもまた変更されています。本文の記事となるブログの更新が比較的少なくて、お知らせ程度に利用する場合には、カラム数を増やしてトップ画面の中にたくさんの情報を配置しておくのもひとつの方法です。当然ですが、中央のブログ部分は記事を書けば更新されて下に下がっていきますが、サイドバーの記事は固定的に表示することができるので、継続的にお知らせしたい記事はサイドバーを利用してみてください。
ちなみに、カラム数を増やした場合、サイトの幅を広げたくなりますが、それはひとつ前の「幅を調整」にもどって調整してください。
5.細かな調整は「アドバンス」から行います。
「アドバンス」をクリックして開いたのが以下の画面です。背景色やタイトル文字の大きさやフォント、色など、その他の箇所もかなり様々にカスタマイズ可能です。ホームページに詳しい方なら「CSS」を加えてその他の要素も変更可能です。
以下の画像は「ブログのタイトル」をクリックしたところですが、下のブロックに表示されているデザインの中に選択箇所が赤い点線で示されますので、変更箇所を間違うこともないでしょう。
6.もちろんオリジナルも他のサイトからのダウンロードテーマも利用できます。
上記のようなカスタマイズでは飽き足らない方は独自のテーマも利用できますし、インターネット上で探してダウンロードしたテンプレートも利用できます。以下は管理画面の「テンプレート」を選択した画面です。
「カスタマイズ」の右隣にある「HTMLの編集」をクリックしてHTMLを書き換えることができます。クリックすると以下の画面が開きますので「続行」をクリック。するとHTMLの編集画面が開きます。この中を書き換えることもできますし、ダウンロードテンプレートの場合には、このHTMLをそっくり書き換えてしまいます。それで保存すれば変更が適用されます。
しかし、初心者は上記のBloggerのカスタマイズメニューから変更を行うことをお勧めします。
7.「テンプレート」からではない見た目の変更箇所
サイトのデザインに関しては「テンプレート」を修正しますが、サイト内に配置する各種要素は「レイアウト」を利用して配置したり削除したりします。中でもデザインに関わるところが少しありますが、そのひとつがサイトのタイトルをロゴにしたい場合です。
サイトタイトルをロゴに変更するには「レイアウト」の中の「(Header)」とあるレイアウトの一番上のガジェットから設定します。ガジェットの右下にある「編集」をクリックして開いた画面の中に「ファイルを選択」というボタンがあります。これをクリックしてあらかじめ用意したヘッダ用のロゴを選択して送信すればサイトのタイトルに摘要されます。
これでお好きなデザインを適用すればほとんどオリジナルといえるサイトを作り上げることができるでしょう。



