blockquote で引用元をどう表示するか

Posted by yoosee on Web at 2006-10-23 23:42 JST

*1  Firefoxで選択できないテキスト - enbug diary (2006-10-23)

blockquoteにおいてciteやtitle属性で指定したテキストが、 表示はされますが、選択できません。 Firefoxで選択できないテキスト - enbug diary (2006-10-23)

私は例えば以前はこんな css を書いていた。
blockquote[title]:before{
  display: block;
  font-size: smaller;
  color: #777;
  border-bottom: 3px double #777;
  content: "Quoted from "attr(title)""
}

blockquote[cite]:after{
  display: block;
  text-align: right;
  font-size: smaller;
  content: "uri: "attr(cite)""
}
しかし css の content には html が書けないため、hyperlink を作る事ができない。ブラウザによっては表示されなかったり文字選択できなかったりと、あまり嬉しくない。と言うことで使わなくなってしまった。

今はというと冒頭の引用のように表示されるわけだが、これはblockquote の cite と title 要素を指定した上で、更に blockquote 内に更に cite 要素 を書き込み、そちらを Hyperlink にするというまわりくどいやり方をしている。この引用部分の html は例えば以下のように記載される。

<blockquote cite="http://example.com" title="Quote先のタイトル">
<p>引用本文
<cite><a href="http://example.com">Quote先のタイトル</a></cite></p>
</blockquote>

これ自体は Firefox の CopyURL+ extension を使い、user.js に以下のように設定をいれて自動生成している。
user_pref('copyurlplus.menus.1.label', 'Copy as A link');
user_pref('copyurlplus.menus.1.copy', '<a href="%URL%" title="%SEL%">%TITLE%</a>');
user_pref('copyurlplus.menus.2.label', 'Copy as Quote');
user_pref('copyurlplus.menus.2.copy', '<blockquote cite="%URL%" title="%TITLE%"><p>%SEL%<cite><a href="%URL%">%TITLE%</a></cite></p></blockquote>');
あまりスマートでは無いので、多分 JavaScript で blockquote の cite, title から自動成形してしまうのが一番賢いのではないかと思う。そのうちやるかも。w3m などではリンクが消えてしまうのが難点か。

ちなみに cite 要素は css にて
blockquote cite{
  display: block;
   text-align: right;
  font-size: smaller;
}
として右寄せ表示している。

( Permalink | Comments (0) | tags: html  )
Comments

Please write your comment. email address won't appear. Cannot use any HTML tags in comment.
コメントをお書き下さい。メールアドレスは公開されません。 またHTMLタグは利用できません。
Name   E-mail   URL
Comment

About W.W.Walker

World Wide Walker は yoosee による blog です。PDA, Web・サーバ技術, 美味しい食べ物などの話題を取り上げています... read more

このエントリーのブックマーク

Monthly Archives

Select Month to read