livedoorブログでサイドバー落ちを解消するブックマークレット

プラグインでフリーエリアを使った場合によくでる現象。
HTMLタグがわかれば修正はなんとかなるんでしょうが、そうでない場合にわりかし手間なくできる方法を模索。

フリーエリアの入力時に、なんかの拍子で、brタグに「clear」属性を加えちゃったり、imgタグにalignを指定したりして、起きている模様。それを解消するためにブックマークレットを作ってみた。

準備段階として、以下のリンクを「お気に入り」に追加。安全じゃないかも、とか言われるかもしれませんが、そのまま続行(危なくないです)。

brのclearとimgのalign属性を削除

準備が終わったら、livedoorブログの管理ページにて、以下の操作を行う。

管理ページにログイン。

上のメニューから「カスタマイズ/管理」を選択。

写真や動画を入れてあるフリーエリアのプラグインそれぞれについて、以下の操作を行う。

1. 左のメニューから「プラグインのカスタマイズ」をクリック
2. フリーエリアプラグインの右にある「編集するボタンをクリック」
3. さきほど登録したブックマーク「brのclearとimgのalign属性を削除」を「お気に入り」から実行
4. テキストエリア内の文字が置換されたことを確認のうえ、「この内容で設定する」ボタン

1~4の作業をフリーエリアプラグイン、すべてに対して行います。以上。どうでしょうか?

IE7やForefoxでは正常に表示されていても、IE6だと、サイドバーが記事の右下、左下に落ちているブログがあるのですが、IE6からIE7にスイッチしてしまうと、気づかないもの。
それでもIE6を使っている人はおそらく50%以上いそうなので、ぜひ、これでやってみてください。

ちなみに。

テキストエリアで以下の置換を行っています。

・「br clear=”all”」を「br」に
・「align=left」を「」に
・「align=right」を「」に

後者は画像を張り込む際に、回りこみの属性を追加しているために挿入されているようです。
サイドバーでこれを使うと、レイアウトがくずれる原因になるので、この指定はやめたほうがいいと思います(HTMLがわかっている人にはよいのでしょうが。回避方法は以下で)。

テンプレートによってはまた違ってくるかもしれませんが、とりあえず、友達用。


ちなみに。

サイドバー落ちの原因を探るには、プラグインをひとつずつ有効にしていくのがいいと思われます。

たとえば、3カラムのテンプレートなら、すべてをいったん、右(B)に指定して、1つずつ左(A)にしていき、サイドバーが落ちた時点で、そのプラグインの内容に問題があるとわかります。

しかし、2カラムだとそうもいきません。残念ながら。

プラグインの設定を残したまま、一時的に使用しないようにできる機能があるといいんですが、livedoor blogにはどうやらそうした機能がないようです。ココログなどのTypePad系やヤプログなどにはあるんですけどねえ。

このへんはユーザーが要望としてライブドアに出してみれば、状況が変わるかもしれませんね(希望的観測)。

そうそう。見逃しがちなのが、サードパーティ製のブログパーツ。もともとのサイドバーの幅以上のFlashコンテンツなんかだと顕著です。
ブログパーツを配布するサイトはせめて150以下とか、そういう小さめのものも用意してほしいところです。

あと、本家にも対策ありますね。
サイドバーがずれてしまう場合
大きい画像はないのにサイドバーがずれる

http://helpguide.livedoor.com/help/blog/qa/grp42#271
http://helpguide.livedoor.com/help/blog/guide/grp111/guide228

プラグイン関連で、また、もうひとつ追加。

プラグインのフリーエリアに写真を複数貼り付ける際に、いったん通常の投稿をするという人もいるようです。

記事作成して、投稿をプレビュー。
うまくいったようだったら、その内容(HTMLタグ)をフリーエリアに貼り付け。
元の投稿は消す。
こんな具合。

投稿時には画像の回り込み設定が反映されるので、それをプラグインにそのまま持っていくとサイドバー落ちを招くことになります。

プラグインのフリーエリア用のHTMLを投稿で作成する場合には、回り込み設定を解除しておいたほうがいいでしょう。

以下、手順。

投稿画面(管理画面)を表示。
上の「カスタマイズ/管理」をクリック。

その下あたり、ページの左右中央あたりにある「投稿の設定」をクリック。

「下に画像の回りこみ表示」というのがあり、右に選択肢がある。

そこで、「画像を左寄せ」になっているのを、「回り込みなし」に変更。

一番したの「設定を保存」ボタン。

これで完了。

通常の投稿がしたい場合は、上記設定で「画像を左寄せ」に戻すなどすればよいでしょう。
ほんとは投稿時に毎回個別の設定ができるといいんでしょうけどね。

以上、livedoor Blogの問題を書きましたが、確認もれや勘違いの可能性もありますので、なにかあればコメントください。

スポンサーリンク
  • このエントリーをはてなブックマークに追加

コメントをどうぞ

メールアドレスが公開されることはありません。