病的溺愛シンドローム > WordPress > プラグイン > コメント > Custom Smilies復活。そしてやっと完成?【WPテーマ】

Custom Smilies復活。そしてやっと完成?【WPテーマ】

Posted on 2009年12月1日 | 10 Comments| Clip to Evernote

先日このブログのデザイン(WordPress テーマファイル)を変えてから
コメントでスマイリーを使えるようにするプラグインの Custom Smilies
クリックしてもコメント入力欄に反映されなくなっていた。
散々広告やパーツ類を疑ったり、有効化してるプラグインを疑ったけど
実はもの凄く単純な原因だった。

Internet Explorer 7以前でこのブログを開くとフリーズする
もしくは酷く重くなるという現象も発生していて、
それも広告やパーツやプラグインを疑ったけど、
結局原因はテーマだった。

見当違いな方向に思考を巡らせて何日間も悩むという失態を晒したけども
ようやくIE6で出るエラー以外は解決したのでご報告。

まず Custom Smilies でスマイリーが入れられなくなっていた件。

コメント入力欄の下に表示されているスマイリー(絵文字)をクリックすると
書いている途中のコメントに絵文字のコードが挿入されるプラグインなんだけど、
プラグイン自体は正常動作しているにもかからず
スマイリーをクリックしてもコードが挿入されなくなっていた。

悩んだ過程は前の記事で書いたから省くとして、動かなかった理由は
スマイリーが挿入されるテキストエリアの #comment の前に
#comments というIDがあったことだった。

IDは1ページで1度しか使えない。
けども comment と comments は違うじゃないかと思ったんだけど
どうやらそこんとこをうまく処理できなかったようだ。
CSSのレイアウト上は #comments も #commet も反映されていたので
1文字足しただけのIDでも大丈夫だろうと思ってたんだよね。
っていうか、実は #commets の必要性はなくて省けるブロックだったので
すっかりさっぱり見落としていたんだけど。

だから無意味に深くするなっつーの…orz
と落ち込んだことは言うまでもない。
#commets を削除したら Custom Smilies もちゃんと動くようになった。
めでたし、めでたし。
…とは言えない初歩的なミスだよね。反省ashamed0006.gif

IE7で固まったり重くなったりする件。

これも明後日の方向に見当を付けて無駄な苦労をしてしまった。
広告やブログパーツを1つずつ外してチェックしたり、
プラグインを全部無効にしてみたり、
テーマのウィジェットの部分を全部コメントアウトしたりと、
一通りのことをやって全部だめだったので、
IETester (IEのいろんなバージョンで動作テストできるソフト)で
JavaScriptを無効にしてみて、やっぱだめで、
Javaを無効にしてみて、やっぱだめで、
Active Xを無効にしてみて、やっぱだめで…
という感じで順番に無効にしていったところ、なんと問題は画像だったscared0015.gif

言い訳をしておくと、背景画像以外はファイルサイズも大きくないし
テーマファイル全体の容量は以前よりも小さいのだ。
そりゃぁ前はgifとかjpgでできてて、今のはpngになったっていう違いはあるけど
IE6で透明なpngを表示できないことを除けばpngでも問題ないっしょ。

と思っていたのだけど…。

大きいサイズの背景画像じゃなくて、塵も積もった透過pngが処理できなかった模様。
背景画像はそのままで、カラム全体の背景に使われている半透明グリーンのpng、
ヘッダーメニューの半透明グリーンとそれに重なるhover時の半透明png、
コメントの背景の半透明pngはスレッド形式に対応してどんどん重なるし、
サイドバー・フッターバーのアイテム背景にも半透明pngが。

塵も積もるよねぇ…ashamed0006.gif

IE8だとうまく処理してくれるんだけど、IE7はダメだったみたい。
IE6ではそもそも透過されないので無視してたんだけども、
これが原因と分かったらなんとかするしかない。
けどもIE6用画像、IE7用画像、と用意するのは面倒だし…
IE7はIE6のCSSでいいや。

ってことでCSSを条件分岐。
いや、これは最初からIE8とそれ以前のIEとでやってたんだけど、
さらにIE7のときってのも加えてみた。

[php]

[/php]

if IE 8 はIE8のとき。
if IE 7 はIE7のとき。
if It IE 7 はIE7以前とのとき。
本当は if It IE 8 にすれば、if IE 7 はいらないんだけど、
IE6用とIE7用を分ける気になったときのために書いている。
(多分そんな日は来ないことはおいといて。)
近い将来IE9用のcssが加わるのだろうと思うと気が重いけども。

で、このIE8以外のIEのときに呼び出しているie6.cssでは
IE8やIE以外のブラウザで表示される画像を殆ど使わず、
固定背景だけののっぺりとした背景色で表示されるようになっている。
さよなら。透過pngってことで。
どの辺がのっぺりかっていうと、特にコメントの重なっていく色とかが皆無とか。
背景画像がうっすら透けていたりしないとか。
まぁそういう些細な点なんだけども。

これでIE7でフリーズするっていう現象は解決された。(筈)
IE6でエラーアラートが出るんだけど、それはもう諦めようかなとか。
(っていうわけで、Firefoxや最新のIEなどをダウンロードしてね☆)

考える方向が間違ってたもんで、随分手間取っちゃったけど
ようやく大体テーマが完成したかなぁ。
長かったなぁ…( = =) トオイメ

追記 at 01:40am
ソース添付するの忘れてた(;´▽`A“


この記事は 2009年12月1日火曜日 の 12:47 AM に書きました。 
この記事のフィードはRSS 2.0で購読できます。

« | »

10 Comments for this entry

  • cyah

    意味は全く分かりませんでしたが、とりあえず「ものすご〜く手間のかかる作業」だったことだけは分かりました。(乙!)
    一つ収穫だったのは「png」で透過がつかえるということ。(gifが使えるのは知っていたけれど。元々gifが特許がらみの問題おこしたのでpngが作られたと言うのは知っていましたが。アルファチャンネル追加すれば良いのでしょうか?もしかしてアニメーションphgも可能?)
    ここに来ると勉強になるなぁ・・・。 😯

    • 唯奈

      >cyahさん
      ありがとうございます^^
      知識不足のために凄い手間がかかってしまいましたが、IE6以外ではなんとか動くようになって一安心です^^;
      透過pngは重ねられるのが便利ですね。
      やりすぎると今回のこのブログのような状態になるので注意が必要ですが^^;;;
      お使いのソフトによると思いますが、fireworksでは書き出すときに形式をpng32にして透明色を選べばできます。
      多分他のソフトでもgifと同じ感じでできるはずです。
      アニメーションpngも可能ですが、対応していないブラウザが多いです。

  • AquaSunネットサービスブログ

    IE6のユーザーが少ないのであれば、無視でいいのかもね。
    ちなみに、セイキュリティアラート+「続行」後のIE6の動きを見ると、無限ループしているっぽいです。

    とりあえずは、テーマが落ち着いてよかったですね ^o^

    • 唯奈

      >AquaSunネットサービスブログさん
      IE6ユーザーは…うーん…無視できるほど少なくないのですが…orz
      もうさっぱりお手上げ状態でして…orz
      無限ループしてるっぽいですか。
      そうなるとやはり放置するわけにもいかないですよねぇ……( = =) トオイメ
      なんでIE6だけ…orz
      ご不便おかけしてすみません><;

  • 綾波

    なるほど。
    IDがダブってて使えなくなっていたんですね。
    やはりテンプレのソースを1度じっくり眺めてから作業しなくちゃダメなんですね。
    まぁ、面倒なんでやらないと思うけど :ase:

    • 唯奈

      >綾波さん
      実はプラグインが吐き出してるIDでダブって動かない部分がまだあるんですが
      そこは手を付けると大変そうだから見なかったことにしています^^;
      テーマのphp開くのはかなーり面倒ですけど
      プラグインをしらみつぶしにon/offするより近道かもしれませんw
      綾波さんも頑張って下さい(・∀・)

  • cyokobo2

    祝 :boon: スマイリー復活 :nice:
    これでコメントがしやすくなりましたよ :mrgreen: 😆
    記事の感想は私には :oteage: が多いですからね :uwa-n:
    ついでにビールもおごっときましょ :kanpai:
    んじゃw :bye:

    • 唯奈

      >cyokobo2さん
      ありがとうございま~す^^v
      記事の内容はWordPressばっかりですからねぇ^^;
      つまらん記事ばっかりですみません。
      ビールごちになりまーす( ̄ー ̄)

  • 綾波

    確かに記述を確認するほうが手っ取り早いですね。
    Gravatarの件もソースに書き加えてやればいいのですけど、どうも表示が綺麗に出来なくてそれ以上やっていないのが現状です。
    まぁ、ソースコードが上手く記述出来ないってぇのが本音です。

    • 唯奈

      >綾波さん
      Gravatarはデフォルトのcomments.phpからひっぱってくればいけそうな気がしますが…ダメ?w
      あたしはあっちこっちから切り貼り状態っす^^;
      実は意図せずGravatarが巨大化してるっていうのは内緒…orz

ADgger

堅実に儲かるアフィリエイト