クリボウの Blogger Tips

Google Blogger の使い方、カスタマイズ方法、各種ツールなど、
Blogger 関連の役立つ情報を紹介しています。

> | | | > Blogger 「HTML の編集」で JavaScript や CSS のコードを貼り付けるときの注意点

Blogger 「HTML の編集」で JavaScript や CSS のコードを貼り付けるときの注意点

Blogger ブログのテンプレートに、外部ツールのスクリプトなどを直接貼り付けると、思った通りには動かない場合があります。

ブログのテンプレートに直接コードを書くとGoogle AdSenseは表示されませんでした。

私の環境では、ツイッターボタンがHTML貼り付けだとうまく表示できませんでした・・・。


Blogger のコメントアウトの扱い

なぜこういうことが起こるかというと、配布されているコードに含まれるコメントアウトが、Blogger では特別な扱いを受けるから。

たとえば、Blogger の 「HTML の編集」では

<!-- コード -->

という形のコメントアウトが使えません。正確には、 <----> とで囲まれたこのコードの行は Blogger テンプレート内のコメントとして扱われてしまい、実際のブログのページ生成時には、この部分が削除されてしまいます。

なので JavaScript でよく

<script type="text/javascript">
  <!--
  alert("Hello, World!");
  //-->

</script>

という風にコードを書きますが、これを Blogger のテンプレートに直に書いても、

<script type="text/javascript">
</script>

というデータしか書き出されず、肝心のコードが実行されなくなってしまいます。


対処法

では、どうやってコードを書き出すかというと、

  • コメントアウトの書き換え
    <!-- コード -->
    というコードを
    &lt;!-- コード --&gt;
    と実体参照に書き換えて「HTML の編集」に貼り付けると、
    <!-- コード -->
    という風に HTML 上のコメントアウトとして、意図したとおりにブラウザにデータが届きます。

  • コメントアウトをやめる
    単純に <----> を消して
    コード
    だけにする方法です。当たり前ですが、コードが消えてなくなることを回避できます。

  • ガジェットに入れる
    Blogger の「HTML/JavaScript」ガジェットに貼り付けたコードは、先に示した Blogger 独自のコメントアウトの制約を受けません。
    <!-- コード -->
    と書いても削除されることなく、そのままブラウザに送られます。
といった方法があるかと思います。
ブログのカスタマイズを考えている人は、覚えておくといいんじゃないでしょうか。


スポンサードリンク:
お願い:
「この記事役に立った!」と思ったら、ぜひフィード登録をお願いします。 

Comments:1

  1. 二日間悩んでいたことが解決しました。本当に有難うございました。m(__)m

    ReplyDelete

Comments on Google+:

© 2005-2014 Kuribo. Powered by Blogger.