>-->

Blogger 「HTML の編集」で JavaScript ã‚„ CSS のコードを貼り付けるときの注意点 | クリボウの Blogger Tips

クリボウの Blogger Tips

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

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

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

Posted at: 2012-05-11 Label: , , , 6

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

ブログのテンプレートに直接コードを書くとGoogle AdSenseは表示されませんでした。
Google AdsenseをBloggerに自在に設置するためのノウハウ +Plus One World

私の環境では、ツイッターボタンがHTML貼り付けだとうまく表示できませんでした・・・。
簡単に設置出来る。Twitterタブボタンをbloggerに設置してみた。 | sunabox


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:6

  1. 伊達家02 March, 2013 01:12

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

    ReplyDelete
  2. Eman sherkawy10 February, 2017 23:06

    http://transferefurniture.bcz.com/%d8%b4%d8%b1%d9%83%d8%a9-%d8%aa%d9%86%d8%b8%d9%8a%d9%81-%d8%a8%d8%a7%d9%84%d8%b7%d8%a7%d8%a6%d9%81/
    http://transferefurniture.bcz.com/%d8%b4%d8%b1%d9%83%d8%a7%d8%aa-%d8%a7%d9%84%d9%86%d9%82%d9%84-%d8%a7%d9%84%d8%b9%d9%81%d8%b4-jumperads-com/
    http://transferefurniture.bcz.com/%d8%b4%d8%b1%d9%83%d8%a9-%d9%85%d9%83%d8%a7%d9%81%d8%ad%d8%a9-%d8%ad%d8%b4%d8%b1%d8%a7%d8%aa-%d8%a7%d9%84%d8%b4%d8%a7%d9%85%d9%84%d8%a9/
    http://transferefurniture.bcz.com/ شركة نقل عفش | http://transferefurniture.bcz.com/ شركة نقل اثاث بجدة | http://transferefurniture.bcz.com/ شركة نقل عفش بالرياض | http://transferefurniture.bcz.com/ شركة نقل عفش بالمدينة المنورة | http://transferefurniture.bcz.com/ شركة نقل عفش بالدمام
    http://khairyayman.inube.com/blog/5015576// شركة نقل عفش بجدة

    ReplyDelete
  3. Lucy30 August, 2018 02:58

    Nike 270

    Red Bottom Shoes For Women

    Pandora Outlet

    Jordan Retro 11

    Jordans 11

    Jordan Retro 9

    Pandora Jewelry Official Site

    Kyrie Irving Shoes

    Nike Air Max 270


    ReplyDelete
  4. clara gisella23 October, 2018 11:02

    Bonus Gratis melalui Dealer Poker Uang Asli Volgograd Region Capital Situs www.rusiapoker.us Melalui BPD Sumut Syariah Kode Bank 117.

    ReplyDelete
  5. yanmaneee09 June, 2021 17:43

    off white
    supreme
    jordan shoes
    stephen curry shoes
    jordan shoes
    supreme new york
    air jordan
    kobe shoes
    bape hoodie
    golden goose sneakers

    ReplyDelete
  6. Tech02 August, 2021 13:21

    It's fantastic that you are getting ideas from this post as well as from our discussion made here.
    Augurs GmbH

    ReplyDelete

Comments on Google+:

© 2005-2014 Kuribo. Powered by Blogger.