スポンサーサイト[スポンサー広告]

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
コメント

2011/08/22(月)

Twitterの上部にあるバーをスクロールさせる[インターネット]

タグ: Twitter Firefox レビュー ブログ FC2ブログ ブログカスタマイズ

Twitterのページは、上部が固定化されている。スクロールをしても、この部分はいつも先頭に表示される。そんなおせっかいは必要ないと思っても、設定で変更することはできない。

上部が固定化されていることによる不都合もある。

  • わずかながら画面の領域が取られるので、一度に読める量が減る。
  • ページスクロールすると、行きすぎて読めない行が出てくる。

スクロールしすぎるのはFirefoxの問題なのかもしれないが、非常にわずらわしい。どうやら、スクロールしない分を考慮していないようだ。

画面全体をスクロールさせるには、CSSをいじる必要がある。何かうまい方法はないかと調べていたら、Firefoxのアドオンで、Stylishというのを見つけた。ユーザー側でCSSを定義できるアドオンだ。

以下のようにすれば、全部スクロールするようになる。

2012/02/10追記
新しいレイアウト(ツイートが右側)に対応した設定を記載。
@-moz-document domain("twitter.com") {
.topbar{position:absolute !important;}
}

なお、以前のレイアウトであればこちら。

@-moz-document domain("twitter.com") {
#top-stuff{position:absolute !important;}
}

背景画像と背景色に色の違いがあると、スクロールしたときに、固定化されていた部分の背景が見えて、色の違いが少々気になるが、いい方法が見つからなかった。

FC2ブログには、似たようなものとして、検索バーがある。この検索バーは、ブログの管理者が設定で消すことができ、ないと困るものではない。見る側は、通常どうすることもできないが、次のようにして、Stylishで強制的に非表示にすれば見なくて済む。

@-moz-document domain("fc2.com") {
html{top:0px !important;}
#sh_fc2blogheadbar{display:none !important;}
}

なお、FC2ブログの管理者が、自身のブログの検索バーを消すには、[環境設定の変更] - [ブログの設定] - [検索バーの利用]を、「利用しない」にすればよい。

Amebaブログには、アメーババーが存在する。こちらも、Stylishで以下のようなスタイルを追加することで非表示にできる。

@-moz-document domain("ameblo.jp") {
body{padding-top:0px !important;}
#amebaBar{display:none !important;}
}
コメント(0) | トラックバック(0) | この記事のURL
コメント

2010/11/13(土)

忍者ブログの仕様変更[インターネット]

タグ: ブログ ブログカスタマイズ 忍者ブログ

忍者ブログで、ブログ内検索をした結果のURLを、カテゴリのように使っていた。それがいつからか、エラーが出て使えなくなった。

助太刀忍者の「ブログ内検索結果のリンク」という投稿で、同じ問題が報告されていた。どうやら仕様変更なので、やり方を変えるしかなさそうだ。幸い、そこに代替手段が書かれていたので、それを採用することにした。

コメント(0) | トラックバック(0) | この記事のURL
コメント

2009/10/17(土)

Twitterを使う予定[自サイトのこと]

タグ: ブログ FC2ブログ ブログカスタマイズ Twitter

ブログのつぶやき部分を、Twitterでやろうかなと思った。発言した時刻まで公になるのは、あまり好きではないけれど、それがあってのTwitterなのだろうから仕方ない。一度書いたことを編集できないのも気に入らないが、削除はできるようなので、それも我慢するか。

FC2ブログでTwitterの表示をさせる共有プラグインがある。それを自分好みにカスタマイズする作業に、半日も使ってしまった。落ち着いたら始める予定。

よくわからないが、TwitterもSNSの一種と思っていいのだろうか。フォローしているとか、フォローされているとか、あの一覧の存在がそう思わせる。つながりが見えるというのは、寂しがりやには安心するシステムなのだろう。でも、人との交流が多くなってくると、だんだんとそれがわずらわしく感じる人もいそうだ。ただつぶやきたいだけだったのに、と。

つぶやきという性質上、ブログの記事よりも有用な情報を得る機会は少ない。なのに、他人のつぶやきを延々とチェックして、時間をつぶしてしまっている人が多いのではなかろうか。有用な情報を得るのが主目的ではないのだろうけど、他人の行動を確認するだけの行為に時間を費やすのは、もったいないことだと思う。気をつけて利用せねば。

コメント(0) | トラックバック(0) | この記事のURL
コメント

2008/10/21(火)

最新記事の要約で改行コードを消す[インターネット]

タグ: ブログ FC2ブログ ブログカスタマイズ JavaScript

まず、コメントの要約で改行タグを消す方法について、出力がすっきりするように書き換えた。

<ul>
<div id="rcomment">
<!--rcomment-->
<li &align>
<a href="<%rcomment_link>#comment<%rcomment_no>" title="<%rcomment_body>">Re: <%rcomment_etitle></a>
<div style="text-align:right"><%rcomment_name> <%rcomment_year>/<%rcomment_month>/<%rcomment_day> <%rcomment_hour>:<%rcomment_minute>
</div>
</li>
<!--/rcomment-->
</div>
</ul>

<script type="text/javascript">
  var str = document.getElementById("rcomment").getElementsByTagName("a");
  for(i = 0; i < str.length; i++){
    str[i].title = str[i].title.replace(/<br \/>/g, ' ')
  }
</script>

このやり方を使えば、IEのときに最新記事の要約(<%recent_body>)で改行コードが入ってしまうのも取り除けそうだ。ということで、最新記事のプラグインのHTMLも、同じような方法で書き換えた。

<ul>
<div id="rbody">
<!--recent-->
<li &align>
<a href="<%recent_link>" title="<%recent_body>"><%recent_title></a>
<div style="text-align:right"><%recent_year>/<%recent_month>/<%recent_day>(<%recent_wayoubi>)
</div>
</li>
<!--/recent-->
</div>
</ul>

<script type="text/javascript">
  var str = document.getElementById("rbody").getElementsByTagName("a");
  for(i = 0; i < str.length; i++){
    str[i].title = str[i].title.replace(/\r\n/g, ' ')
  }
</script>

以前のやり方では不可能だったのが、このように処理を変えたことで置換できるようになった。

コメント(0) | トラックバック(0) | この記事のURL
コメント

2008/08/16(土)

BLOCKBLOGの記事を忍者ブログへ[自サイトのこと]

タグ: ブログ 忍者ブログ ブログカスタマイズ

BLOCKBLOGにあった5年分の記事を、忍者ブログへ移した。BLOCKBLOGの記事をブラウザから保存したのが6月中旬なので、それから約2カ月かかった。

まず、HTML形式の記事からMT形式への変換に、BBLog2MTを使わせてもらった。いくつかの要望に対応してもらえて、うまくインポートできそうなデータに変換できた。

変換後は、自作のツールで記事を古い順にした。それから、すべての記事に目を通して、記事数を1,531件から1,135件に減らした。1,000件よりも少なくしたかったが、3桁にはできなかった。

 beforeafter
2003年596284
2004年414303
2005年257237
2006年188186
2007年127125
合計15311135

昔は、本当に日記という感じの使い方をしていて、ちょっとしたことでも記事にしていたが、今見ると不要なものが多く、それらはごっそり消した。それがだんだん、書き残しておきたいことだけ記事にするようになって、思ったより減らせなかった。

忍者ブログへのインポートは、少しずつ慎重にやった。特に、コメントとトラックバックは、あとから個別に当時の日付で追加したり、内容を編集することができないのがやっかいだ。もし失敗したら、記事を消して再度インポートしないといけなくて、記事番号に抜けが発生してしまう。個人的には、それは気持ち悪いので避けたかった。失敗を防ぐためには、先にインポートする記事(コメントやトラックバックのない記事)に、あとからインポートしたい記事(コメントやトラックバックがある記事)のコメントやトラックバックをくっつけてインポートして、うまくいくかどうか試すといい。

忍者ブログのインポート機能を使った際に判明した問題をいくつか挙げる。

  • PING:の前に空行があると、トラックバックがインポートできない。BBLog2MTでは、空行が入る仕様になっているので(JUGEMでは空行がないとインポートできないため)、詰めておく必要がある。
  • UTF-8で保存してインポートしたほうがよい。忍者ブログはUTF-8なので、それ以外でインポートすると、忍者ブログ側で変換処理が入り、「~」が別のコードになったりするため。
  • コメントに記述されているHTMLのタグは、タグとして解釈されず、そのまま表示される。
  • コメントに「&gt;」という記述をすると、「>」にはならず、そのまま「&gt;」と表示される。
  • コメントにURLがあると、「http」で途切れる。

注意深く事前にチェックしていれば防げたのに、いくつかのコメントのインポートで、上記の問題に引っかかった。記事を消してインポートし直したくなかったので、仕方なく記事本文で補足しておいた。

私は、ブログの記事でも全部HTMLで書きたいので、FC2ブログも忍者ブログも、記事のフォーマットを「HTMLのみ」に設定している。この場合、PタグやBRタグを自分で書くことになる。インポートする記事も、それらのタグをつけたままにして、CONVERT BREAKS: 0(改行を変換しない)で読み込ませた。ところが、BRタグが消えてしまう現象が起こったので、助太刀忍者(NINJA TOOLSのBBS)に投稿した(インポートした記事のBRタグが消える)。最初の回答は、期待したものと違っていたので、再度質問したところ、開発担当の人がすぐに修正してくれた。手作業で対処するしかないのかと思っていたところだったので、非常に助かった。

BLOCKBLOGで使用していた画像はhi-hoに置いているため、画像へのリンクを変更しなくて済んだ。このやり方は、FC2ブログにしてからも続けている。特にFC2ブログは、画像用のサーバが重かったり、落ちていたりということがよくあって、そんなときも関係なく快適に表示できる。ブログのサーバに画像を置くと、ブラウザで画像を管理するのが面倒だということもあるし。

一時期、アニメの感想を書いていたことがあって、それらはすべて「テレビ番組」のカテゴリにある。これを作品別に表示できるようにしたいと思っていた。カテゴリを新たに作るのもひとつの手ではあるけれど、今回は検索機能を利用して、カテゴリと同様の使い方ができるようにした。各作品の記事本文に、固有のキーワードをHTMLのコメントとして埋め込んで、それを検索するリンクを並べて、カテゴリっぽくしている。

ということで、今回インポートした記事は、アーカイブの2003年~2007年からたどれるようにしてある。

コメント(0) | トラックバック(0) | この記事のURL
コメント

2008/03/31(月)

FC2ブログのユーザータグ[インターネット]

タグ: ブログ FC2ブログ ブログカスタマイズ

FC2ブログでは、各記事にユーザータグを設定できる。うまく使えば、カテゴリのように扱うことも可能だ。設定したタグを各記事に表示させるには、<%topentry_jointtag>という変数を使う方法がある。ただ、この場合のリンク先は、FC2ブログ全体でそのタグを検索した結果のページになる。自身のブログのみを対象にしたいときは、以下のようにして、テンプレートの記事の部分に埋め込む。こうすると、カテゴリのように、そのタグを使用している記事のみが表示される。

<!--topentry_tag-->
<p>タグ: <!--tag_list-->
<a href="<%url>?tag=<%topentry_tag_list_parsename>"><%topentry_tag_list_name></a>
<!--/tag_list--></p>
<!--/topentry_tag-->

タグでの記事表示の表示順がおかしいときは、「ブログのURL?publish」で一度アクセスしておくと直るようだ。プラグインの順番の変更が反映されないときも、これで正常になる。

コメント(0) | トラックバック(0) | この記事のURL
コメント

2008/03/22(土)

コメントの要約で改行タグを消す[インターネット]

タグ: ブログ FC2ブログ ブログカスタマイズ JavaScript

FC2ブログで使用できる変数の中に、<%topentry_comment_list_body>と<%rcomment_body>がある。これらは、以前は改行タグが含まれない仕様だったようだ。それが、現在は改行タグが入ってしまう。2005年に、ユーザーフォーラムで不具合報告があるのに、ずっとそのままだ。

<%rcomment_body>を、最近のコメントのtitleとして使いたかったので、この問題が解決するまでは、JavaScriptで改行タグを取り除くことにした。句読点がないコメントも考慮して、スペースに変換する仕様にした。

<ul>
<!--rcomment-->
<li &align>
<script type="text/javascript">
var rcomment_str = '<%rcomment_body>';
rcomment_str = rcomment_str.replace(/<br \/>/g, ' ');
document.write('<a href="<%rcomment_link>#comment<%rcomment_no>" title="' + rcomment_str + '">Re: <%rcomment_etitle></a>');
</script>
<noscript>
<a href="<%rcomment_link>#comment<%rcomment_no>" title="<%rcomment_body>">Re: <%rcomment_etitle></a>
</noscript>
<div style="text-align:right"><%rcomment_name> <%rcomment_year>/<%rcomment_month>/<%rcomment_day> <%rcomment_hour>:<%rcomment_minute>
</div>
</li>
<!--/rcomment-->
</ul>

これを、最近のコメントのプラグインにある、HTMLの編集に貼る。このブログで使っているものをそのまま載せているので、タグや出力形式はお好みで。

追記:
最新記事の要約で改行コードを消すの記事に続く。
コメント(2) | トラックバック(0) | この記事のURL
コメント
使わせていただきました。ありがとうございます。

最近の記事でtitle="<%recent_body>"を使っていますが、この改行もできれば無くしたくて...いじってみましたが、エラーになってしまいました。

recent_bodyだとそのままですかね。。。
by paruparu
<%recent_body>は、もともと改行タグを出力しませんが、この場合は改行コードを削除したいということですね。
Firefoxでは、何もしなくても詰めて表示されるので、今まで気づきませんでした。

改行コードを除去できないか試したのですが、よい方法が見つかりませんでした。
JavaScriptで文字列を置換する際に、まず<%recent_body>の内容を変数に代入するのですが、途中に改行があると、そのまま改行が入って展開されます。

例)
var recent_str = '<%recent_body>';

var recent_str = 'あいうえお
かきくけこ';

この状態は、JavaScriptの文法としておかしいので、エラーになってしまいます。
<%recent_body>が、改行コードを出力しない仕様になればよいのですが。
by 犬かい

2008/02/10(日)

コメントへのリンクの修正[インターネット]

タグ: ブログ FC2ブログ ブログカスタマイズ

FC2ブログで、コメントを見ようとすると、妙な位置にジャンプすることがある。これは、コメント一覧の位置にある<a name="comment"></a>と、コメント本文を記入するテキストエリアのid="comment"がダブっているために起こる。おそらく、公式のテンプレートのほとんどがそうなっている。IE6では気づかないが、Firefoxではidを優先するらしく、コメント本文を記入する位置へジャンプしてしまう。

FC2ブログのユーザーフォーラムを検索したら、#commentはどこ?という投稿が見つかった。そこに書かれているように、コメント一覧の位置にある<a name="comment"></a>のcommentという文字列を変更して、コメントへのリンクも変更した文字列にすれば解決する。

コメント(0) | トラックバック(0) | この記事のURL
コメント

2008/02/09(土)

日付で記事をまとめる[インターネット]

タグ: ブログ 忍者ブログ ブログカスタマイズ JavaScript

忍者ブログでは、日付で記事をまとめる機能が実装されていないようだ。同じ日の記事は、日付の表示を1回だけにしたかったので、試用していたときにJavaScriptで作った。FC2ブログでは、<!--same_day-->というのがあるので、もっと簡単にできる。

まずは、直前の記事と日付が同じなのかどうかを判定する、isSameDate()という関数を作る。同じだったらtrue、違っていたらfalseを返す。仕組みは、before_entry_dateに直前の記事の日付を保持しておいて(最初は空っぽにする)、引数として指定したcurrent_entry_dateと一致するか確認するというもの。

<script type="text/javascript">
var before_entry_date = "";
function isSameDate(current_entry_date)
{
  if(current_entry_date != before_entry_date){
    before_entry_date = current_entry_date;
    return false;
  }
  return true;
}
</script>

実際に日付を表示する部分では、現在の日付を引数として渡して、この関数を呼び出す。trueなら日付を表示させる。

<script type="text/javascript">
if(isSameDate('<!--$entry_year-->/<!--$entry_mon-->/<!--$entry_day-->') == false){
  document.write('<!--$entry_year-->/<!--$entry_mon-->/<!--$entry_day-->');
}
</script>
<noscript>
<!--$entry_year-->/<!--$entry_mon-->/<!--$entry_day-->
</noscript>
コメント(0) | トラックバック(0) | この記事のURL
コメント

2008/01/28(月)

FC2ブログと忍者ブログ[インターネット]

タグ: ブログ FC2ブログ 忍者ブログ ブログカスタマイズ レビュー

BLOCKBLOGを使うのは2007年までとして、別のブログサービスを探していた。候補になったのは、FC2ブログと忍者ブログだった。どちらも機能が豊富で、設定の自由度が高い。互いに似た仕様をしているけれど、いろいろとテストをしていると、細かい違いに気づく。自分にとって影響のありそうな違いを並べてみた。


FC2ブログ 忍者ブログ
charset EUC-JP→UTF-8 UTF-8
詳細記事ページ以外
のコメント一覧表示

一部の情報のみ
×
非公開コメント機能 ×
新着コメントの
メール通知

コメント本文あり

コメント本文なし
同じ日付の記事を
まとめる機能

JavaScriptで可
検索結果のハイライト
JavaScriptで可
記事の
最大表示件数
30件
ページの種類別に設定可
25件
どのページも同じ設定
2009/02/09更新
FC2ブログの最大表示件数は、99件だったのが30件に減ったらしい。また、管理者専用コメント返信機能は、FC2ブログにも実装されたので、比較対象からはずした。

個人的には、EUCよりはUTF-8がいい。基本的にブログサービスでは、文字エンコーディングを自由に変更できないから、慎重に選びたいところ。

2012/03/04更新
FC2ブログは、2012年3月より、順次EUCからUTF-8に変更される。

コメントの機能にも違いが見られる。FC2ブログは、名前と本文くらいなら、記事が連なっているページでもコメントを展開して表示できる。忍者ブログは、サーバ負荷の問題で設定できないようになっている。

新着コメントのメール通知は、両方のサービスに備わっているが、FC2は携帯端末でも読みやすいシンプルな内容で、コメントの本文も読める。忍者ブログは、どうでもいい情報が冒頭につくばかりでなく、肝心のコメントの本文が書かれていないので、本当に通知という役割しかない。

同じ日付の記事をまとめる機能というのは、同じ日付の記事は最初だけ日付を表示するような機能のこと。FC2ブログでは、<!--$same_day-->という変数がある。忍者ブログには、それに該当するものがなかった。でも、JavaScriptを使えば可能ではある。

検索結果のハイライト表示は、忍者ブログでは標準で対応している。ただ、ハイライトの色は青で固定されている。FC2ブログは、JavaScriptで実現できる。

記事の最大表示件数は、FC2ブログのほうが多く、カテゴリ別や月別のページなど、ページの種類によって件数を変えることもできる。

各ページのURLには、大きな違いが見られる。これも一覧にした。


FC2ブログ 忍者ブログ
トップのURL http://ID.blog*.fc2.com/
*:サーバ番号(1~3桁)
http://ID.blog.shinobi.jp/
詳細記事 /blog-entry-*.html
*:記事番号
/Entry/*/
*:記事番号
詳細記事の
コメント一覧
/blog-entry-*.html#comment
*:記事番号
/Entry/*/#comment
*:記事番号
詳細記事の
トラックバック一覧
/blog-entry-*.html#trackback
*:記事番号
/Entry/*/#trackback
*:記事番号
カテゴリ別 /blog-category-*.html
*:カテゴリ番号
/Category/*/
*:カテゴリ番号
月別 /blog-date-YYYYMM.html /Date/YYYYMM/
日別 /blog-date-YYYYMMDD.html /Date/YYYYMMDD/
検索結果 /?q=*
*:検索文字
/Search/

どのページも、忍者ブログのほうがすっきりしている。ただ、大文字が入っていることが気になる人もいるかもしれない。ちなみに私は気になった。FC2ブログは、いちいちblogという単語が含まれていて冗長に感じる。

なお、忍者ブログの月別表示は、<!--$plugin_archive_link-->をそのまま使うと、/Date/YYYYMM/1.htmlとなる。これはすなわち1ページ目という意味で、/Date/YYYYMM/1/のことでもあり、/Date/YYYYMM/のことでもある。なぜ、月別だけこのようなリンクが作られるのかは知らないが、プラグイン部分で/Date/YYYYMM/のリンクにしたければ、プラグインのHTML編集で、リンク先を以下のように書けばいい。こういう変更は柔軟にできるので助かる。

"<!--$g_url-->Date/<!--$plugin_archive_year--><!--$plugin_archive_mon-->/"

その他、どちらのブログにも実装されている主な機能。

  • プレビュー、リアルタイムプレビュー
  • 過去記事の編集時の検索機能
  • コメント/トラックバック管理時の検索機能
  • IPアドレス/ホスト名/キーワードによるコメント/トラックバックの拒否設定
  • IPアドレス/ホスト名/キーワードによるアクセスの拒否設定
  • 記事/コメント/トラックバックの表示順設定
  • カテゴリの並び替え
  • テンプレートのCSSとHTMLの編集
  • プラグインの並び替え、HTMLの編集

テンプレートの編集について、何度も修正して確認するという作業がしやすいのは忍者ブログ。更新を実行したあとも、直前に編集していた位置がそのまま保持されるからだ。また、プレビューの種類が多く、ダミーの情報が自動で付加されて表示されるなど、確認作業がしやすくなっている。FC2ブログは、更新するとCSSもHTMLも編集位置が先頭に戻る。プレビューを使えばそのようなことはないが、プレビューではトップページしか確認できない。

管理ツールの使い勝手は、どちらも悪くはない。忍者ブログのほうが自分には合っている気がしたけれど、慣れればたいした差はない。

テンプレートのHTMLに書ける独自構文(変数)には、若干の違いがある。

FC2には、同じ日付の記事をまとめるための変数<!--$same_day-->と、詳細記事ページ以外でもコメント一覧を表示する変数<!--$comment_list-->がある。もっとも、前述したように、コメントリスト内に使える変数には制限がある。

FC2ブログも忍者ブログも一長一短で、どちらにするか非常に迷った。URLの表現や管理ページの使い勝手は、忍者ブログのほうが好みだったけれど、どのページでもコメントの表示がしたいというのと、メール通知の際にコメント本文を読みたいということで、FC2ブログを選んだ。決めるのに、ひと月くらいかかってしまった。

コメント(0) | トラックバック(0) | この記事のURL
コメント
| ホーム |
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。