１７．一度作成したラベルを削除できない
なんかやり方がありそうだけど全然消えませんorz

Bloggerをおすすめできない２０の理由

という文章を見かけたので、今回は Blogger でつけたラベルを削除したり、変更したりする方法を紹介しようと思います。


投稿をラベルでフィルタリングする

Blogger では、ラベルが投稿ごとに管理されており、どの投稿でも使われなくなって初めて消滅する仕組みになっています。なのでまずは、特定のラベルのついた投稿を一括表示する必要があります。

Blogger の管理画面「投稿」を開いて、右上の「すべてのラベル」と表示されているボタンを押下、特定のラベルを選択すると、そのラベルがついた投稿だけが表示されます。

言葉で読むより、画像を見てもらった方が早いと思います。下の画像はラベル「Amazon」で投稿をフィルタリングした例です。



投稿からラベルを削除する

投稿をラベルでフィルタリングしたら、ラベルを外したい投稿にチェックを入れます。そのあと、ラベルボタン を押すと、「ラベル追加・削除」のセレクトボックスが出ます。

ここがちょっと分かりにくいんですが、このセレクトボックスで、投稿にまだついていないラベルを選ぶとラベル追加に、投稿にすでについているラベルを選ぶとラベル削除になります。

なので画像の例でいうと、投稿を一括選択しラベルボタンを押してラベル名「Amazon」を選ぶと、「Amazon」というラベルをブログの全投稿から削除することができるというわけです。



投稿につけたラベル名を変更する

ブログを続けていると、ラベル名に一貫性が保てなくなってラベル名を一括変更したい場面が出てくると思います。たとえば投稿につけている「Amazon」というラベル名をすべて「アマゾン」に変更する場合など。

そういう場合には、上記で説明したように投稿を「Amazon」ラベルでフィルタリングして表示し、全選択、ラベルボタンから「新しいラベル」で「アマゾン」ラベルを追加したあと、再びラベルボタンから「Amazon」ラベルを削除すれば、すべての投稿の「Amazon」ラベルが「アマゾン」ラベルに書き換えられます。


これらの方法を知っていると、ブログ全体のラベル編集がとても簡単に行えると思います。時間のあるときなんかに、ブログのラベル整理をしてみるといいかもしれませんね。

Google の提唱しているウェブ向け画像フォーマットとして、WebP というものがあります。

Googleの示した事例では、ファイルサイズは非可逆圧縮モードで（同一画像、同等画質の）JPEGと比較して25-34%小さくなり、可逆圧縮モードでPNGと比較して28%小さくなるとしている。また22%のファイルサイズ増加でアルファチャネルを追加できるとしている。

WebP - Wikipedia

と、非常に高い圧縮率を誇る静止画フォーマットなんですが、Blogger ã‚„ Picasa ウェブアルバム、Google+ に画像をアップロードしていれば、簡単にこの形式へ画像を変換することが可能なようです。

ネタ元はこちら。

• Google Operating System: Convert Images Hosted by Google to WebP

WebP フォーマットへの変換方法

やり方は簡単、Google のサービスにアップロードした画像をブラウザで表示し、その URL


のサイズを指定している部分（赤字部分）に -rw の 3 文字を加えるだけ。


元の画像がこちら、WebP 形式に変換したのがこちらです。画像自体はほとんど見分けがつかない（確認は Chrome がおすすめ）のに、289 KB から 57 バイトへと約 4 分の 1 にファイルサイズが減少しています。


画像比較

画像比較用に、ノゴマとか


シャム猫とか

サトキマダラヒカゲを載せておきます。


ちなみに、WebP として上に表示しているのは WebP に変換したあと、ブログ掲載用に再び JPEG に変換したものです。ファイルサイズ減量の割に、ほとんど見分けがつかないと思います。自分のいろいろな画像で試してみるといいかもしれませんね。


掲載写真について

あと、今回掲載した写真自体に興味があるという方は、

• クリボウの写真日記

をフィードリーダーの片隅にでも登録してもらえるとうれしいです。

Blogger ブログのテンプレートに、外部ツールのスクリプトなどを直接貼り付けると、思った通りには動かない場合があります。

ブログのテンプレートに直接コードを書くとGoogle AdSenseは表示されませんでした。

Google AdsenseをBloggerに自在に設置するためのノウハウ +Plus One World

私の環境では、ツイッターボタンがHTML貼り付けだとうまく表示できませんでした・・・。

簡単に設置出来る。Twitterタブボタンをbloggerに設置してみた。 | sunabox

Blogger のコメントアウトの扱い

なぜこういうことが起こるかというと、配布されているコードに含まれるコメントアウトが、Blogger では特別な扱いを受けるから。

たとえば、Blogger の 「HTML の編集」では


という形のコメントアウトが使えません。正確には、 <-- と --> とで囲まれたこのコードの行は Blogger テンプレート内のコメントとして扱われてしまい、実際のブログのページ生成時には、この部分が削除されてしまいます。

なので JavaScript でよく


という風にコードを書きますが、これを Blogger のテンプレートに直に書いても、


というデータしか書き出されず、肝心のコードが実行されなくなってしまいます。


対処法

では、どうやってコードを書き出すかというと、

• コメントアウトの書き換え
  
  <!-- コード -->
  というコードを
  &lt;!-- コード --&gt;
  と実体参照に書き換えて「HTML の編集」に貼り付けると、
  
  <!-- コード -->
  という風に HTML 上のコメントアウトとして、意図したとおりにブラウザにデータが届きます。
  
  
• コメントアウトをやめる
  単純に <-- ã‚„ --> を消して
  コード
  だけにする方法です。当たり前ですが、コードが消えてなくなることを回避できます。
  
  
• ガジェットに入れる
  Blogger の「HTML/JavaScript」ガジェットに貼り付けたコードは、先に示した Blogger 独自のコメントアウトの制約を受けません。
  <!-- コード -->
  と書いても削除されることなく、そのままブラウザに送られます。

といった方法があるかと思います。
ブログのカスタマイズを考えている人は、覚えておくといいんじゃないでしょうか。

投稿を誤って消してしまったときに、それを復元する方法について、次のエントリで紹介されていました。

• The Real Blogger Status: Retrieving The PostID, To Recover A Deleted Post

やり方は簡単。どの投稿でもいいので、Blogger の管理画面から投稿の編集画面を開きます。


次に、投稿エディタの URL の postID 部分を、削除してしまった投稿の ID に差し替えたものにアクセスします。すると、削除したはずの投稿が、内容そのままに投稿エディタで難なく開けてしまいます。あとは、公開するなり、保存するなり自由にできますね。

差し替えるべき投稿 ID（postID）はというと、削除する前の時点で、HTML で投稿のタイトルのすぐそばに書かれています。


なので、実際の復元手順としては、


という流れになると思います。

あまり使うことはないかもしれませんが、困ったときのためにそんな手があることだけでも、覚えておくといいんじゃないでしょうか。

次のページで知った、Blogger ブログへの GIF アニメの投稿の仕方。

• マルカジリます。: Bloggerでブログを書いてて気づいた豆知識２点

Blogger の新・旧のインターフェースと、HTML モード・作成モードの組み合わせで、実際に GIF アニメをアップロードしてみました。

新インターフェースの「HTML」モードの場合

新インターフェースの「作成」モードの場合

旧インターフェースの「HTML の編集」モードの場合

旧インターフェースの「作成」モードの場合

ちょっと分かりにくいんですが、新インターフェースで「作成」モード のときだけ、表示画像もリンク先もアニメになっていると思います。ほかのはどちらも静止画ですね。

ということで、今のところ GIF アニメを投稿するには、新インターフェースの「作成」モード で画像をアップロードしましょう、という Tips でした。

Picasa ウェブアルバムの仕様変更

Blogger に投稿した写真の表示サイズを、後から変更するための記事を発見。

以前、Blogger のテンプレートをつくった際に、画像の大きさについて参考にしたのが、
　　・クリボウの Blogger Tips「Blogger で画像の表示サイズを変更する方法(2008/01/05)
他の画像サイズを使いたかったので、FireBug を使って調べたことがあります。結果、他のサイズも使えるようなので、その画像サイズのまとめを紹介します。記事が 2008 年と少し古いので、その後サイズが追加されたのかもしれません。

Blogger にアップロードした画像サイズを変更する方法 まとめ | Blogger カスタマイズ情報ブログ

ここで紹介していただいているように、このブログでも画像のサイズ変更について、一度解説をしたことがあります。

• Blogger で画像の表示サイズを変更する方法

これは、画像アップロード時の「大」「中」「小」以外で指定できる写真のサイズを列挙した記事だったんですが、Picasa ウェブアルバムの仕様が変更されて、現在では随分状況が変わってきているので、再度記事にしておこうと思ったわけです。

その仕様変更というのは、

記事が 2008 年と少し古いので、その後サイズが追加されたのかもしれません。

と書かれているような固定サイズ（32px、48px、64px、72px…）の追加ではなくて、画像サイズを 1 ピクセルから 1600 ピクセルまでの任意の長さで、自由に指定できるようになったということ。

論より証拠というわけで、下に Blogger へアップロードした画像を掲載してみました。入力部に 1 ～ 1600 を指定して「変更」ボタンを押すと、ちゃんとそのサイズに変更される…はず。

長い方の辺の長さ：
URL:	https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAekCrm2oVON4aQ5ilcGQ7QTHI0Hdz-9XqexRqKfktJPhFbHsSF5i6c6N7s4C4eBoo5EbQjO9SOWa3vePslEmIx3Sg1U9USd59XNO3eX3VDmHRX3A9cAV8gbLArflloQw_Orcp/s400/DSC_5864.JPG

画像サイズの変更方法

では早速画像サイズの変更方法を紹介します。「新しいエディタ」で、画像をアップロードすると、表示されるのがこちらの HTML コード。


ブログ上に実際に表示される画像のサイズが赤字部分、リンク先の画像のサイズが青字部分で指定されています。前述したとおり、この src 属性や href 属性の URL 中の値、「sなんとか」という文字列の「なんとか」部分の値で、画像の長い方の辺の長さ（横長画像なら横の長さ、縦長画像なら縦の長さ）を指定することができます。この値の範囲は 1 ～ 1600。たとえばこの画像で「s500」で指定すると、幅が 500 ピクセルとなるように自動的にリサイズされた状態で、Picasa のサーバーが画像を送ってくれるというわけです。

コード中、width（å¹…）、height（高さ）の属性は、送られてきた画像を、パソコンのブラウザで最終的にどのようなサイズに拡大縮小して表示するのかを指定しているもの。なのでこれらの数値は、送られてくる画像の縦横の長さに一致させる必要があります。「sなんとか」の部分を調節した URL を直接ブラウザで表示して見て、タイトルバーに表示されるサイズを確認したり（Chrome、Firefox）、右クリックから「プロパティ」で確認したり（IE）するのが１番楽だと思います。が、調べるのが面倒だという場合は、width="***"、height="***" の文字列をごっそり削除してしまっても OK です。これらの属性が省略されている場合、ブラウザは送られてきたままのサイズで画像を表示してくれます。

（補足：じゃあ、原寸で表示する場合は width、height を指定する意味はないのかといえば、そうではありません。width ã‚„ height の指定がないと画像読み込みまで文書全体のレイアウトが確定しませんが、指定しておくことで画像読み込みの速度に関わらず最初からレイアウトが確定させることができます。ので、指定する・しないで意見が分かれるのかもしれませんが、クリボウ的にはできるだけ width、height を指定するようにしています。）

ということで、自分のブログにあった画像サイズ、一度ゆっくり探してみてはいかがでしょうか。

Blogger beta のテンプレートには直接日本語が入力できない問題があるんですが、それを回避する方法が見つかったので、ご報告。

回避方法：外部エディタで編集してから、Uploadすれば、日本語はそのまま表示できます。しかし、テンプレートを一旦Blogger BetaのEdit HTMLを使ったら、まだ消されてしまう。

Blogger Beta Tips: テンプレートに日本語保存できないバッグ

なるほど、Blogger beta のエディターを通さなければいいんですね。

ちなみに、テンプレートファイルのアップロードは Blogger beta 管理画面「Template ＞ Edit HTML」の「Backup / Restore Template」から。アップロードするファイルは、ＰＣ上のテキストファイルでＯＫなんですが、文字コードを UTF-8 で保存しておく必要があります。

これを機会に、テンプレートをバックアップする習慣をつけておくとよさそうですね。