ブログでブログパーツやプラグインを入れる際の注意
以前、wordpressを構築していた時に、デフォルトで入っているjQueryを使い
それを元にjsファイルを自分で作ったりしていたのですが、
ある時プラグインを入れたら、作ったjsファイルが動作しない!?
なんていう事態が発生した。
すぐに原因に気づかなかったのですが、どうやらプラグイン導入で
それで動作しなくなったということだけがわかった。
同様のことで、最近のブログパーツを入れるだけでも同じことが起こりうるので
皆さんのブログでもプラグインやパーツを入れる際は
とあることに注意しておいたほうがいい。
注意すべきこと
注意すべきことは、読み込まれるライブラリである。
僕のブログやサイトの構築の際は、その多くでjQueryを使うのですが、
設定をしていないと、他のライブラリを読み込んだときにエラーが起こりやすい。
プラグインの中には、prototype.jsが自動的に読み込まれるものもあり、
(例えば絵文字使えるようにするwordpressのプラグイン)
何も対策もせずに入れてしまうとどちらかで不具合がおきてしまう。
同様に、ブログパーツを入れたりすると、そのブログパーツが
protptype.jsを使っていたり、jQueryを使っているなんてケースも出てきたため、
エラーが起きてしまうなんて事態も起こるようになってきた。
FLO:Qを入れたら
今回右サイドメニューにFLO:Qを入れたのですが、
これを読み込むとprototype.jsを使っているらしく
対策をしていなかった僕のjQueryのファイルに影響が出てしまった
なんてことが最近起こったので、今回のエントリーを書くきっかけになった。
最近はjQueryを使っていても、他のライブラリと共存できるように作っているが、
自身の作ったファイルのなかでも以前のものはその対策をしていないため、
なんとエラーが発生してしまうなんて事態も起こっている。
たぶん、以前のエントリーを開くと、もしかしたらいくつかは動かない
なんて事態が現在発生中なので、ご了承ください。
徐々に修正していきたいと思っております。
jQueryの場合
他のライブラリだとどうなのかわからないが、jQueryのファイルは
重複して読み込むとエラーが発生するというのを以前体験しているので
そういうケースも注意しておいたほうがいい。
例えばAdobeのedgeが提供しているブログパーツ、
それはjQueryのライブラリを使っているため、これまた僕のブログでは
問題が発生してしまい、使えなかったなんてことが起きていた。
今後は同じような事態がかなり頻繁に起こりそうなので、
ある程度対策はしておいたほうがいいだろう。
jQueryでの対策
jQueryと他のライブラリを共存させるには、
jQuery.noConflict(); を指定しておく必要がある。
この場合$()と書いていたのをjQuery()と書かなくてはならないので、
少し記述が大変になるが、これでエラーがでなくなる。
プラグインが追加されることやブログパーツを入れるなどで
今後はそれらでライブラリが使われている可能性も十分ありえるので
導入する際は十分注意してから入れたほうがいいだろう。
>少し記述が大変になるが、
こんな感じで書けば大変ではないかと・・・
jQuery.noConflict()(function($){
alert($('body').html())
}
prototype.jsと併用したければ・・・
jQuery.noConflict()(function($j){
$j //jQuery
$ //prototype.js
}