そっと、はてなブログ

はてなブログのベータテストを生暖かい目で見守るブログです。

『そっと、はてなブログ』

……　はてなブログのベータテストを生暖かい目で見守るブログです。【　記事一覧　】

はてなブログMarkdownモードでの「はてなブックマーク貼り付け機能」に、リンクとコメントの間が改行されない不具合

不具合報告

f:id:mame-tanuki:20120922151414g:plain

　9/19、はてなブログに導入されたMarkdownモードではてなブックマーク貼り付け機能を利用すると、貼り付けられたリンクが整形済みテキストブロックとして処理され、そのままHTMLの<a>タグが表示されてしまう不具合が発生する場合があった。

　この不具合は、9/26に修正された。

  • Markdownモードにおいて、 編集サイドバーからはてなブックマークを貼り付けできない不具合を修正しました。

　しかし、この修正によって今度はリンクとコメントの間が改行されない不具合が生じるようになった。

■リンクとコメントとの間が改行されない

　9/26の修正によって、Markdownモード使用時に「はてなブックマーク貼り付け機能」で貼り付けられるリンクは、<a>タグではなく、はてな記法のhttp記法を利用した形式に変わった。

　例えば、次のような文字列が貼り付けられる。

[http://staff.hatenablog.com/entry/2012/09/26/182527:title:bookmark]
Markdown記法バグ http://goo.gl/ypXUi は修正の結果、別の不具合が発生。後で書く／ラボのアイコン作成サービス http://16x16.hatelabo.jp/ は10/1で終了。急がなきゃｗ

　これを、Markdownモードで表示すると、以下のようになる。

ブログのアイコンを設定できるようにしました - はてなブログ開発ブログ Markdown記法バグ http://goo.gl/ypXUi は修正の結果、別の不具合が発生。後で書く／ラボのアイコン作成サービス http://16x16.hatelabo.jp/ は10/1で終了。急がなきゃｗ

■「（半角スペース）ゼロで」「２つは必要ですよ！分かって下さいよ！」

　なぜ、リンクとコメントの間が改行されないのか。実は、ここがMarkdwon記法の面倒臭い所なのだ。

　Markdown記法では、テキスト上の改行文字は無視される。はてな記法に慣れている人には厄介な仕様だ。

　では、改行するためにどうしたら良いかと言うと…

  • （方法１）改行したい行と行の間に空行を挟む　　→　　それぞれ<p>タグで囲まれ別段落として処理される
  • （方法２）改行したい行の末尾に半角スペース２個を置く　　→　　<br />タグが挿入される

という２つの方法が用意されている（詳細は、拙記事を参照のこと）。

　だからこの不具合の修正も単純だ。Markdownモードだった場合に「はてなブックマーク貼り付け機能」で貼り付けるリンクのhttp記法の末尾に「半角スペース２つ」を入れれば良い。あるいは、http記法で書かれたリンクとコメント文の間に空行を入れれば良い。

　前回の不具合は「半角スペース４つ」を行頭に挿入したことが原因だったので、「２つで十分ですよ！分かって下さいよ！」と指摘した。今回は、「２つは必要ですよ！分かって下さいよ！」と指摘したいｗ

　ちなみに、見たままモード使用時に「はてなブックマーク貼り付け機能」で貼り付けられるHTMLは、次のようなものだ。

<p><a href="http://staff.hatenablog.com/entry/2012/09/26/182527">ブログのアイコンを設定できるようにしました - はてなブログ開発ブログ</a> <a class="http-bookmark" href="http://b.hatena.ne.jp/entry/staff.hatenablog.com/entry/2012/09/26/182527"><img src="http://b.st-hatena.com/entry/image/http://staff.hatenablog.com/entry/2012/09/26/182527" alt="" /></a></p>
<p>Markdown記法バグ http://goo.gl/ypXUi は修正の結果、別の不具合が発生。後で書く／ラボのアイコン作成サービス http://16x16.hatelabo.jp/ は10/1で終了。急がなきゃｗ</p>

↑
今回追加されたMarkdownモード版のスーパーpre記法（シンタックス・ハイライト）の方は、無事に動いているようだ。

  • Markdownモードにおいて、コードブロックのシンタックスハイライトに対応しました。

【関連リンク】

【関連するMy記事】

Markdown Love

Markdown Love

はてなブログMarkdownモードでの「はてなブックマーク貼り付け機能」に、整形済みテキストブロック化する不具合

不具合報告

f:id:mame-tanuki:20120922151414g:plain

　9/19、はてなブログに導入されたMarkdownモード。このMarkdownモードではてなブックマーク貼り付け機能を利用すると、貼り付けられたリンクが整形済みテキストブロックとして処理され、そのままHTMLの<a>タグが表示されてしまう不具合が発生する場合がある。

【9/26追記】

　9/26に不具合の修正が行われたが、今度は別の不具合が発生している。

■空行の次の行の先頭に貼り付けると、整形済みテキストブロックとして処理される

　不具合が発生する条件は、はてなブックマーク貼り付け機能で貼り付けた場所が以下の２つの条件を満たした場合だ。

  • 【条件１】貼り付けた場所が行の先頭
  • 【条件２】貼り付けた場所が空行の次の行

　この２つの条件を共に満たすと、例えば以下のように表示されてしまう。

<a href="http:&#x2F;&#x2F;mametanuki.hateblo.jp&#x2F;entry&#x2F;2012&#x2F;09&#x2F;22&#x2F;MarkdownList">はてなブログで「Markdown記法一覧」を書いてみるテスト - そっと、はてなブログ</a>>
<a class="http-bookmark" href="http:&#x2F;&#x2F;b.hatena.ne.jp&#x2F;entry&#x2F;mametanuki.hateblo.jp&#x2F;entry&#x2F;2012&#x2F;09&#x2F;22&#x2F;MarkdownList"><img src="http:&#x2F;&#x2>F;b.st-hatena.com&#x2F;entry&#x2F;image&#x2F;http:&#x2F;&#x2F;mametanuki.hateblo.jp&#x2F;entry&#x2F;2012&#x2F;09&#x2F;22&#x2F;MarkdownList"></a>

■「（半角スペース）４つ入れてくれ」「２つで十分ですよ！分かって下さいよ！」

　この不具合の原因は、貼り付ける<a>タグの頭に半角スペースを４つ入れていることだ。

　Markdown記法では、空行の次の行の先頭に置かれた「半角スペース４つ」は特別な意味を持つ。

Markdown記法では引用文の行頭に「4つ以上の半角スペース」あるいは「1つ以上のタブ」を置くことで、HTMLなどのソースコードを整形済みテキストとしてそのまま表示できる。
　※pre記法と前の段落との間に空行が必要！

http://mametanuki.hateblo.jp/entry/2012/09/22/MarkdownList#Code%20Blocks

　空行の次の「半角スペース４つ」で始まる行は<pre>タグで囲まれ、整形済みテキストとして処理するのが、Markdown記法でのルールなのだ。

　だからこの不具合の修正は単純だ。Markdownモードだった場合に「はてなブックマーク貼り付け機能」で貼り付ける<a>タグの頭に「半角スペース４つ」を入れなければ良い。

　よく分からないのは、<a>タグの頭に「半角スペース４つ」を入れようと考えた、はてなスタッフの意図だ。貼り付け先の文章と<a>タグとの間に適度な余白を挟みたかったのだろうか？ならば、半角スペースを４つも必要だろうか？映画『ブレードランナー』に登場する屋台のオヤジじゃないけど、「２つで十分ですよ！分かって下さいよ！」と叫びたくなったｗ

【関連するMy記事】

はてなブログのトップページが、気づけばスゴく現代Web的に…

感想

ほんとだｗ

f:id:mame-tanuki:20120923085424j:plain

Evernoteとか、そういう感じのサービスのトップページっぽい雰囲気になってる。

前のトップ絵も悪くは無かったけど、あれは国産ブラウザSleipnirとかのフェンリル社っぽいデザインだよねｗ

f:id:mame-tanuki:20120923085443j:plain

【関連するツイート】「目が、目がぁ〜!」

f:id:mame-tanuki:20120923095923j:plain

このデザインは、ウザすぎるｗ

【関連するMy記事】

★