ブログカスタマイズ３．サイドバー

さて、今回はサイドバーです。
サイドバーというのは、ブログを２つか３つに分けたうちの、記事ではない部分ですね。
このブログで言うと、左側の部分。プロフィールがある部分です。
ソラマメを見ていると、よくここに商品の紹介がしてあって、これやりたいなー、と思っていました。
やってみると意外と簡単なので、ぜひ試してみてください


サイドバーの中身は、「ブログの設定」→「ブログ環境設定」で編集できます。
一番下にプロフィールがあって、その上にカスタムプラグイン１、２、３、がありますが、どれでもいいです。どれも白紙の状態になっています。
とりあえず１の中身を編集します。
「HTML使用可能」と書いてあるように、ここではHTMLが使えます。
逆に、使わないと大したことはできないです

タグは、プロフィールを書いたことがある方なら、わりとすぐに書けると思います。
改行は<BR>を使うとか・・・ですね。


実際に私が使ったタグを挙げておきます。参考までに。

<Font Size="4"></Font>
フォントの大きさです。１～７まで指定できます。

<Div Align="center"></Div>
文字や絵を中央に配置します。右寄せならright、左寄せならleftになります。

<img src="画像のURL" width="100">
画像を表示します。widthは幅の指定で、kittoのロゴマークは１００にしてあります。
幅を指定せず、そのまま載せる場合には、必要ありません。

<a href="リンク先のURL" target="_blank"><img src="画像のURL" width="180"></a>
画像でリンクする場合です。このテンプレートには、幅１８０程度の画像の大きさがいいみたいです。
" target="_blank"は、別ページで表示、ということだと思います。（たぶん）


上のＨＴＭＬタグを使って、商品紹介はこのようになりました。


参考にしたＨＴＭＬ辞書です。
みんなのタグ辞書


これで中身ができたので、保存します。
確認画面ではＨＴＭＬタグはそのまま表示されていて、確認になりません



次は、位置の調整です。デフォルトでは一番下に表示されているんじゃないかと思います。
それを、もうちょっと上に持って行きます。
「ブログの設定」→「サイドバー」で、今編集したカスタムプラグインだけでなく、プロフィールやカレンダー等の配置を変えることができます。
私は、一番上にプロフィール、その下に商品紹介、という形にしました。
ついでに、必要なさそうなものは消しましょう


これで終わりです。
配置の説明はかなりはしょってしまったので、もし分からないことがあったら、お気軽にコメントくださいね



＊今までのカスタマイズ記事＊
ブログカスタマイズ１．背景画像
ブログカスタマイズ２．タイトル画像（準備）
ブログカスタマイズ２．タイトル画像～前編～
ブログカスタマイズ２．タイトル画像～後編～
ブログカスタマイズ３．サイドバー（このページ）