2006-10-24

【週刊はてな塾】第五十三号 日記に色を付けたり大きくしたり。入力支援ボタンを使ってみよう! の巻

?!-------?!------?!------?!------?!------?!------?!------?!-------?!
『週刊はてな塾』 第五十三号 http://www.hatena.ne.jp/
発行日:2006年10月24日 発行者:株式会社はてな
バックナンバー http://hatena.g.hatena.ne.jp/hatenatips/archive
?!-------?!------?!------?!------?!------?!------?!------?!-------?!


■ はてな塾からの挑戦!復習編その2

こんにちは、はてな塾塾長の d:id:kiyohero です。
今週のはてな塾では、はてなダイアリーの日記編集画面でできる便利ボタン
(入力支援ボタン)について紹介します。
入力支援ボタンを使うと、文字に色を付けたり大きくしたり、複数の写真を日
記に載せたりといった、普段よりいっそうカラフルな日記を書けるようになり
ます。

本日の内容を解説付きの動画で見るにはこちらから。
http://www.youtube.com/watch?v=L24NX2l9WVg

■ 文字に色を付けたり大きくしたり・・・入力支援ボタン

それでは、まずはいつもの日記の文字に装飾を付けることから試してみましょう。

まず、いつも通り日記の「日記を書く」をクリックして、自分の日記編集画面
に移動します。そこにいつも通り日記を書いて、

今日はまるで冬のように寒い。

と書いて見ましょう。次に、この文中の「冬」という部分を、もっと寒く見せ
るために、青文字で表示させるようにしてみましょう。

ワープロを使うように「冬」の部分をマウスで選択・反転させた後、編集画面
上部にある文字色ボタン(左から6番目)のをクリックしてください。すると、
様々な色が表示されるので、変更したい色(今回は青色です)をポチっとクリック。

color:#0000FF;">冬のように

のように、「冬」の部分が span で始まるHTMLタグで囲まれましたね。これで
「冬」の部分が文字色青で表示されるようになりました。

続けて、今度は文字サイズを大きくしてみましょう。今度は「今日は」の部分
を大きくしてみます。

先ほどと同様に、「今日は」の部分をマウスで選択・反転させて、編集画面上
部の文字サイズボタン(左から5番目)をクリックします。すると「XXL」「XL」
から「M」「XS」などの文字サイズがリストで表示されるので、変更したいサ
イズ(今回はXLです)をクリック。

今日はまるで

のように、こちらも span で始まるHTMLで囲まれました。上の文字色の変更と
合わせて、

今日はまるで
style="color:#0000FF;">冬のように寒い。

のように日記編集画面には表示されていると思います。自分でゼロからHTMLタ
グを書くのは難しいですが、こうしてボタンを押すだけで自動で入力してくれ
るのは嬉しいですね。

最後に「この内容を登録する」をクリックすると・・・

実際にどうなるか、続きは動画版はてな塾でご覧ください。
http://www.youtube.com/watch?v=L24NX2l9WVg

■ 複数の大きい写真を載せる・・・フォトライフ

さて、次は日記に複数の写真を載せてみましょう。複数の写真をアップするに
は、日記編集画面上部の「フォトライフ」ボタン(右から3番目)を使います。

通常の日記にアップする画像は、1日に1枚、150ピクセルの小さいサイズまで
と制限がついていますが、フォトライフを使うと1日に何枚でも、また150ピク
セル以上の写真をアップすることができるようになります。(無料で30MBま
で、有料オプションで容量を増やすことができます。)

フォトライフを使って写真をアップする手順は以下の通りです。旅行の写真や
ペットの写真、今日のご飯の写真など、アップしたい写真をあなたのパソコン
にまず用意しておいてください。

日記の編集画面に移動して、「フォトライフ」ボタンをクリック。

「フォトライフに画像アップロード」

というボタンが表示されるので、通常のファイルアップロード操作と同様に、
アップロードを完了してください。すると、



といった、「f:id:ユーザー名」で始まる文字列(fotolife記法)が挿入されま
す。最後に「この内容を登録する」をクリックして・・・

実際にどのように表示されるか、続きは動画版はてな塾でご覧ください。
http://www.youtube.com/watch?v=L24NX2l9WVg

同様の操作を繰り返すことで、1日の日記に複数の写真を表示させることがで
きます。また今回アップした写真は、後日フォトライフボタンをクリックし、
サムネイル画像をポチポチとクリックすることで、いつでも挿入することがで
きます。

いかがでしたか?ボタンをクリックするだけで、HTMLタグやはてな記法の入力
をサポートしてくれる入力支援ボタン。これを使っていつもよりちょっと凝っ
た日記を書いてみてくださいね。
それでは、また来週!


◆週刊はてな塾ポッドキャスト・ビデオポッドキャスト

週刊はてな塾のページに表示されている「RSSアイコンiTunesなどにド
ラッグ&ドロップすることで、音声版・動画版はてな塾が更新されたら自動的
にダウンロードされる(ビデオ)ポッドキャストとしてお楽しみいただけま
す。またはてなRSSを使うことで、新しいソフトウェアインストールするこ
となく、ポッドキャストを楽しむことができます。
○ポッドキャストってなに?
http://www.hatena.ne.jp/info/podcastはてなRSSポッドキャストを楽しむ!
http://r.hatena.ne.jp/help#podcastはてなからのメールマガジンの購読停止は・・・
ユーザー情報変更ページにて購読停止作業を行ってください。
= https://www.hatena.ne.jp/configはてなへのお問い合わせは
http://www.hatena.ne.jp/faq/はてなのトップページは
URLhttp://www.hatena.ne.jp/

週刊はてな塾 第五十三号(音声版)

Download filelist

週刊はてな塾 第五十三号(ダウンロード動画版)

filelist