スポンサーサイト

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

スポンサードリンク

FC2ブログにJqueryを実装する方法と、上手くいかない時の注意点

2011/04/18 ブログデザイン

実装する手順


Jqueryの最新版(Current ReleaseのMinified)をダウンロード

DLした「jquery-1.5.2.min.js」というようなファイルをブログにアップする。

※FC2ブログでは「.」という名前は使えません。
「ファイル名にスラッシュ(/)やピリオド(.)を入力することはできません」
とエラーが出ます。
「jquery-1_5_2.min.js」か「jquery_min.js」に名前を変更しましょう


テンプレートの設定>HTML編集
<HEAD>タグの後ろに以下を追加
<script type="text/javascript" src="アップしたJSファイルURL"></script>

これでJqueryが実装完了です

FC2ブログで上手く動作しない時


記事内に書いたJavascriptは「自動改行」がONになっていると、改行タグが入って正しく動きません。

【解決方法1】
個別記事の投稿ページ最下部の「改行の扱い」を「HTMLタグのみ」にするか、面倒な場合は「環境設定の変更」から初期設定を変更しておきましょう

【解決方法2】
スクリプトをJSファイルとして保存して外部ファイルとして呼び出せば、きちんと動作する上にHTMLソースもすっきりします。ただ再編集がめんどうですね


他にもっと便利な方法が見つかれば追記します!
「記事のある部分だけ自動改行させない」なんて方法があれば一番楽なんですが^^;

追記


発見ブログさんの記事「FC2ブログでテンプレートを使って外部JS化する裏技カスタマイズ方法を発見」で面白い方法が紹介されていました。
再編集が可能、自動改行もそのまま、ソースもスッキリなので一番お手軽かもしれません
  • テンプレートのCSS部分にJavascriptを記述してそれを呼び出す
という方法です。


他にもアフィリエイトラボさんの記事「ブログ記事内でJavascriptを動かす方法まとめ」でさらに2つ方法が紹介されてました
  • 改行を消す&改行が必要なスクリプトの後に「//」を入れる(例 <!--//)
  • コード全体をエンコードしてしまう


ちなみにJSファイルをそのままアップロードすればいいのでは?と思われるかもしれませんが、
FC2ブログは上書きアップロードの精度があまりよくありません・・・(泣

クリアするまで、上の方法を用途に応じて使い分けるしかなさそうです

スポンサードリンク

-0コメント

非公開コメント(
トラックバック :

スポンサーリンク

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