Count per Day
  • 1127今日の閲覧数:
  • 1418昨日の閲覧数:
  • 11現在オンライン中の人数:
最近のコメント
アーカイブ
2011年8月21日 日曜日

FC2ブログに、コメントやトラックバックが送れない

以前からずっとそうだったんですが、ブログ仲間の方にコメントやトラックバックを送る際、相手の方が「FC2ブログ」で運営されている場合だと、私の方からのアクセスにいろいろと制約が出ていました。

具体的には、

 ・ コメントを送る際、「メールアドレス」と「url」を記入すると、「禁止ワードが含まれています」というメッセージが出て送れない。

 ・ トラックバックが送信できない。

というものです。

これはもう数年前からそういう状態だったので、FC2ブログの方に対しては私のブログの紹介やメール交換をする事が出来ませんでした。

いろいろやっては見たのですが、FC2以外の方のブログに対してはだいたい問題なく送信出来ていたのでそのままにしていました。

でも出来ればこちらのブログも見ていただきたいですし、同じテーマの記事に対してはトラックバックも張りたいですよね。

この原因なんですが、最初は私のブログや自宅サーバー、使っているブログソフトのMovable Type あるいは私のブログのurlやメールアドレスに問題があるのかなと思っていましたが、そうではなく「FC2ブログ」の仕様のようでした。

具体的には、私のブログからコメントを送ると、「Error: Forbidden Your Blog (Blacklist)」、翻訳すると「エラー:あなたのブログは禁じられています(ブラックリスト)」とエラーメッセージが返されてしまいます。

最初は、私のブログに対して相手の方がブラックリストに登録されているのかと思っていましたが、実は違っていて、「投稿とトラックバックを許可するリスト=ホワイトリスト」に掲載されていないサーバーから送られてきたものはすべて「ブラックリスト」扱いとし、接続を拒否するようになっているようです。

※ この件については、FC2.comのフォーラムの中でFC2のスタッフの方が、
http://blog.fc2.com/forum/viewtopic.php?p=73474#p73474

>スパムツールを使った投稿を判別する際に送信元IPをチェックしており、
>これがホワイトリストに載っていないものは You cannot use trackback tool from local PC
>と表示されるようになっております。
>この為MT、nucleusからのトラックバックにつきましては実質受け付けることができません。

>これにつきましては批判されて然るべきだと思いますが、
>現状この判定による投稿の99%までがスパムであるという状況
>(要するにスパムツールからの投稿がものすごく多い)では開放できないというのが実情です。

と書いていらっしゃいました。

通常のプロバイダが運営しているブログサービスや、大手のレンタルサーバーを使ったブログであれば送信元IPがわかっているので安全だけど、自宅サーバーでMovable Type やnucleus などでブログをやっているところは危険なので、「安全以外=とりあえず危険」という判断で拒否する仕様になっているという事のようです。

このフォーラムの記事が書かれたのは2007年の事で今から4年前ですが、その後改善されたという事はないようです。

したがって今後もFC2ブログを使っていらっしゃる方へのコメントには、こちらのurlもメールアドレスも掲載する事は出来ず、またトラックバックも出来ないようです。

なんか、FC2ブログって さびしい きびしいですね。

せめて管理画面で、ブログ管理人の方が「許可」出来る仕様にするくらいの配慮はして欲しいものですね。


ブログランキングに参加中です
気に入ったらポチお願いします。
にほんブログ村 バイクブログ ツーリングへ
にほんブログ村




2011年6月8日 水曜日

マウスオーバーでズームアイコンを表示する

 ※ (この記事を書いたときはブログソフトがMovable Type でしたが、現在はWordpress に変更したため、デモ画面は動作しません)

 

前の記事で、大きな画像を表示する時、サムネイルの小さな画像をクリックすると、うにぃうにぃと拡大する方法を書きました。

でも、どれが大きな画像のあるサムネイルなのかがわかりにくいので、拡大画像のあるサムネイル表示の時、原寸サイズの写真があることをわかりやすく見せるために、画像の上にマウスをもっていった時にズームアイコンを表示するための備忘録です。

mouseover.jpg

 ※ 実際のデモ画面は、コチラ

簡単なCSSだけで表示する方法です。

 ※ 参考にしたのは、コチラのサイトです。

ブログに表示させる場合は、表示させたいテンプレート(メインページ、エントリーアーカイブ、カテゴリーアーカイブ、日付アーカイブ)のそれぞれに次の部分を追加します。

<head> と </body> の間に、

<style type=”text/css”>
#gallery1 { width:100%; overflow:hidden;}
#gallery1 a { position:relative; float:left; margin:5px;}
#gallery1 a span { display:none; background-image:url(“http://greenleaf.ddo.jp/wp/wp-content/uploads/zoomicon.png”); background-repeat:no-repeat; width:44px; height:44px; position:absolute; left:10px; top:10px;}
#gallery1 a:hover span { display:block;}
#gallery1 img { border:solid 1px #999; padding:5px;}
</style>

そして、

<body> と </body> の間に、

<div id=”gallery1″>

を追加して、さらに今まで書いた記事の中の画像にも、ズームアイコンを表示させたい時は、

<a href=”●●.jpg”><img ●●.jpg” /></a>

の間に

<span></span>

を追加して、

<a href=”●●.jpg”><span></span><img ●●.jpg” /></a>

と変更します。

最終的には、次のようになります。

<html>
<head>

<style type=”text/css”>
#gallery1 { width:100%; overflow:hidden;}
#gallery1 a { position:relative; float:left; margin:5px;}
#gallery1 a span { display:none; background-image:url(“http://greenleaf.ddo.jp/wp/wp-content/uploads/zoomicon.png”); background-repeat:no-repeat; width:44px; height:44px; position:absolute; left:10px; top:10px;}
#gallery1 a:hover span { display:block;}
#gallery1 img { border:solid 1px #999; padding:5px;}
</style>

</head>
<body>

<div id=”gallery1″>

<a href=”http://greenleaf.ddo.jp/wp/wp-content/uploads/swiss7-04.jpg”><span></span><img alt=”朝焼けのマッターホルンとゴルナーグラート展望台” src=”http://greenleaf.ddo.jp/wp/wp-content/uploads/swiss7-04-thumb.jpg” width=”560″ height=”374″ /></a>

</div>

</body>
</html>

結局、前の記事に書いた「画像の同一画面内での自動拡大」とこの「ズームアイコンの自動表示」を一緒に出来ればよかったのですが、やってみるとなぜか画像の横に文字が回り込んでしまい、うまく表示出来ませんでした。

それにズームアイコン表示のためには、過去の記事の画像部分に手を入れる必要があるので今回は「ズームアイコンの自動表示」の導入の方を見送る事にしました。

ということで、こういう方法もあるよというだけの備忘録になってしまいました。


ブログランキングに参加中です
気に入ったらポチお願いします。
にほんブログ村 バイクブログ ツーリングへ
にほんブログ村




2011年6月7日 火曜日

原寸サイズの画像を、同一画面内でスムーズに拡大表示する

 ※ (この記事を書いたときはブログソフトがMovable Type でしたが、現在はWordpress に変更したため、デモ画面は動作しません)

 

私がブログを書く時には、文字での説明よりわかやすいだろうと思って、写真や動画を多く載せるようにしています。

7年前にブログを始めたばかりの頃の記事の写真は、数も少なくサイズもかなり小さいものを掲載していました。

そして小さい画像をクリックすると、別画面で大きな画像が開くようになっていました。

最近は、記事の数も増えそれに伴って写真の数も多くなり過ぎたので、掲載する写真をそこそこ大きなもの(480pxか560px)にして、サムネイルと原寸サイズの画像の二つをアップしないで、一つだけにしてしてしまうことが多くなりました。

それでも、中には「これは是非大きなサイズで見てもらいたい!」という写真や地図には、やはり原寸サイズの画像もアップしたくなります。

そんな時、大きな写真が表示される時、単に別画面に表示されるのではなく、他の方のブログで見かけるような「うにぃ、うにぃ」という感じで同じ画面の中で表示される方がかっこいいかなと思って、自分のブログでもやってみました。

調べてみると、JavaScriptを使って実現する方法がいくつか紹介されていました。

その中でも比較的導入が簡単そうで、しかも過去に書いたブログ記事の写真部分の表示を、書き換えないでもすむ「FancyZoom」を導入して見ることにしました。

出来上がりはこんな感じです。

 (※ 下の画像をクリックすると、同じ画面の中で拡大します。
    拡大した画像を、もう一度クリックする元のサイズに戻ります)

朝焼けのマッターホルンとゴルナーグラート展望台

 (※ クリックしても、ズームしながら拡大しない時は、サイトを再読み込み、「F5」キーを一二度クリッしてみてください。)

■ 導入方法

まずは、次のサイトから「FancyZoom package(FancyZoom 1.1.zip (53 KB)」をダウンロードします。

cabel.name: FancyZoom

zipファイルを解凍すると「__MACOSX」と「FancyZoom 1.1」の二つのフォルダーが出来ますが、「__MACOSX」はマック用らしいので使用しません。

「FancyZoom 1.1」フォルダーの中にある、「images-global」と「js-global」の二つのフォルダーを使用します。

このうち、「images-global」「zoom」フォルダーの中にあるのは画像ファイルで、拡大表示した写真に閉じる「closebox.png」アイコンや画像まわりの薄い影、時間経過を示す回るアイコンを表示させるものです。

しかしこのアイコンは、なぜか Internet Explorer ではうまく表示されず、Firefox や Google Chrome ではちゃんと表示されます。

もう一つのフォルダー「js-global」を開き、この中の「FancyZoom.js」をテキストエディターで編集します。

44行目付近にある次の行を

var zoomImagesURI = ‘/images-global/zoom/’; // Location of the zoom and shadow images

  ↓ ↓

var zoomImagesURI = ‘http://harley-davidson.ddo.jp/images-global/zoom/’; // Location of the zoom and shadow images

このように自分がアップしたサイトへのパスに書き換えてから二つのフォルダーごと、自分のサイトのルートに近いところにアップロードします。

私は、「http://harley-davidson.ddo.jp/」の直下に置きました。

ファイル構成はこんな感じになりました。

http://greenleaf.ddo.jp/wp/images-global/

http://greenleaf.ddo.jp/wp/js-global/

次に表示させたいサイトのテンプレートを書き換えます。

HTMLの<head>セクションに次の行を追加します。

<script src=”http://harley-davidson.ddo.jp/js-global/FancyZoom.js” type=”text/javascript”></script>
<script src=”http://harley-davidson.ddo.jp/js-global/FancyZoomHTML.js” type=”text/javascript”></script>

同じく、 <body>タグにonload=”setupZoom()”を追加します。

<body onload=”setupZoom()”>

これらを、メインページ、エントリーアーカイブ、カテゴリーアーカイブ、日付アーカイブのそれぞれに同じように記載します。

<body>タグの部分については、

日付アーカイブなどは、

<body class=”layout-two-column-right date-based-archive”>

となっている部分の後ろに追記すればいいので次のようになります。

<body class=”layout-two-column-right date-based-archive” onload=”setupZoom()>

でも、エントリーアーカイブは、

<body class=”layout-two-column-right individual-entry-archive” onload=”individualArchivesOnLoad(commenter_name)” >

となっていて既に「onload=” ”」が使われています。

このままでは重複しての使用は出来ませんので回避する必要があるのですが、面倒なので単純に元の「onload=” ”」を取ってしまい、

<body class=”layout-two-column-right individual-entry-archive” onload=”setupZoom()>

としてしまいました。

でも「individualArchivesOnLoad」が無いと、コメント入力欄に名前やメアド、urlを記入した後「この情報を登録しますか?」にチェックを付けても次回入力時に反映出来ないので不便です。

そこで、<body>タグ内の最後の方に、

<script type=”text/javascript”>
<!–
individualArchivesOnLoad(commenter_name);
//–>
</script>

を追加しました。

これで動作しているようですが、どこかに不具合が出ているのかもしれません。

その時に対象しようかなと思っています。

これで、原寸サイズの画像があるサムネイルを表示する時にちょっぴりカッコよくなったかなと思っています。


ブログランキングに参加中です
気に入ったらポチお願いします。
にほんブログ村 バイクブログ ツーリングへ
にほんブログ村




プロフィール

メカ好きおじさん写真

メカ好きおじさん

・39年前原付、中型二輪取得
・CB50で東北野宿一周
・250cc四国・九州3週間5万円野宿
・38都道府県制覇
・XL250オフ後、再度オンロード
・KAWASKI2スト最後に降りる
・16年ブランク後リターン
・50歳で大型二輪免許取得
・ハーレーFLSTCにペアライド中

twitterlogo   twitterlogo

ツイッター、インスタグラム やってます!

ブログランキングに参加中です
気に入ったらポチお願いします。
にほんブログ村 バイクブログ ツーリングへ
にほんブログ村

メカ好きおじさんのツイッター