日記や更新履歴の表示など、内容は複数行にわたるけど表示エリアは大きくしたくない場合に便利なブログテンプレートです。
表示したい行数と幅を指定して、文章を記述するだけでスクロールバーが自動的に表示されます。文章には、文字以外にもリンクや画像も指定できますので、とても便利ですよ。また、背景画像も指定できるようになりました。毎日の日記にご利用ください。
ツールで作成したサンプル
また、文字の色や枠の色、背景色などお好みで指定できますよ。
どんどん文章を書いても、スクロールバーが表示されるので、レイアウトを気にする心配がありません。なお、スクロールバーの色は変更できませんので、ご注意ください。
更新履歴、日記（ブログ）などいろいろな場所に利用できると思いますよ。
また、背景画僧リンクを指定して、表示位置を中央にひとつ表示し、スクロール枠の幅や高さを、画像の高さや幅に合わせると、写真にぴったり納まるスクロールバーが表示されます。
ブログの修飾にどうぞ。
楽天ブログの場合：
楽天フォトへ表示したい背景画像を登録します。既に登録済みの場合は、登録は不要です。表示したい画像のHTMLタグを取得します。
<img src="http://sunafukey.fc2web.com/image/bg.gif" width="60" height="60" alt="背景">
上のHTMLのタグ内の赤い文字の部分が、このツールの背景画像リンクに指定する部分です。
ブログ用タグを作成してみよう
HTMLタグを作成すると、クリップボードへ自動でコピーされます。下のテキストボックスからも選択できます。手順は次の通りです。
- 「テキスト」へ、実際の日記を入力します。
- 「背景画像リンクURL」へ、指定したい画像のURLを入力します。省略可能
- 「スクロール枠設定」の枠の幅と枠の高さを、背景画像の幅と高さと同じ値に設定すると写真が中央に表示されます。
- 枠線・下線・文字色など、お好みの設定を行います。
- 「HTML作成」ボタンを押します。
スクロールレイアウトツールでは
この、日記テンプレートでは、次のHTMLタグを使用しています。
- ブロック要素 <div>〜</div>
ブログだけではなく、更新履歴やインフォメーション表示などにも使えます。スクロールバーに色を指定したい場合は、スクロールバーに色指定タグをご利用ください。
なお、カスケーディングスタイルシート(CSS)も使用しておりますので、環境によってはうまく表示されない場合もあります。
また、本ツールでは、JavaScript を使用しています。したがって、JavaScriptが使用できない設定になっているブラウザでは、使用することが出来ません。
ブラウザのJavaScriptを実行可能に設定して、ご利用ください。
無料ツールとなっております。リンクもフリーです。
更新履歴
2008/04/10 背景画像を中央へ表示するように変更 枠の高さをピクセル単位でも指定を追加
2007/11/28 背景画像を左右中央へ一つ表示するオプションを追加
2007/11/19 背景画像を固定してスクロールしないように変更
2007/11/16 背景画像指定追加
2007/11/01 著作権表示のレイアウト変更