自分のブログに Emoticons
Posted at: 2006-02-23
4
>
自分のブログに Emoticons
導入方法
１．Blogger 管理画面「テンプレート」から、テンプレート head 要素内（
２．テンプレート内の Emoticon を適用したい div 要素のタグに
ちなみに、書き換え後の画像の中には、背景が透明でなく白いものがあるので、適用される範囲も背景が白い方がきれいです。
スポンサードリンク：
お願い：
Emoticons
メッセージに添えられる ;) や :P といった顔文字、よく目にしますよね。今回取り上げるは、これらの顔文字を自動的に画像に置き換えて表示するためのツールです。
アイデアはあれどシンプルな画像がなく、諦めかけていたんですが、今回 Google Chat の Emoticonsというのを見つけたので、それを使うことにしました。
このツール、一度導入してしまえば、あとは普通に記事を投稿するだけで、自動的に顔文字が画像に替わるのが便利なところ。
置き換えられる文字列は <3 :(|) :-o :D :( X-( B-) :'( =D ;) :-| =) :-D ;^) ;-) :-) :-/ :P \m/ の19種類。
デモ
顔文字がどのように画像に切り替わるのかは、実際に見てもらった方がわかりやすいかと思います。下のフォームに、上記の顔文字を使った好きなメッセージを入れて「テスト」ボタンを押してみてください。
導入方法
１．Blogger 管理画面「テンプレート」から、テンプレート head 要素内（
<head> と </head> の間）に、次のコードを貼り付けます。
<script type="text/javascript" src="http://tools.kuribo.info/emoticon/emoticon.js"></script>
２．テンプレート内の Emoticon を適用したい div 要素のタグに
onload="emoticon('id');" という属性を書き入れます。赤字の部分はその div 要素の id を書き込んでください。
Blogger ブログの投稿部分にのみ適用したい場合は、post とクラス付けられた div 要素の開始タグを次のようにします。
Blogger のコメント部分の場合には、comments と id のついた div 要素、開始タグを次のようにしてください。
<div class="post" id="p<$BlogItemNumber$>" onload="emoticon('p<$BlogItemNumber$>');">
Blogger のコメント部分の場合には、comments と id のついた div 要素、開始タグを次のようにしてください。
<div id="comments" onload="emoticon('comments')">
ちなみに、書き換え後の画像の中には、背景が透明でなく白いものがあるので、適用される範囲も背景が白い方がきれいです。
スポンサードリンク：
「この記事役に立った！」と思ったら、ぜひフィード登録をお願いします。 
はじめまして。
ReplyDelete私もBlogger使ってます。
日本語の解説が嬉しくて、いろいろ読ませていただいてます。
カレンダー貼り付け失敗、トラックバック失敗ですけど・・・（汗
クリボウさんのところにリンクさせて頂こうと思い、メールアドレスを探したのですが見つからないのでこちらにコメントを残します。
これからも役立つ情報待ってます。
ヨロシクどうぞ。
コメントありがとうございます。
ReplyDeleteカレンダー貼り付け、失敗でしたか。今後記事を書く際の勉強にもなるので、よければどこでつまずいたか教えて下さいませ。
リンクやコメントは、自由にジャンジャンしてもらえるとうれしいです。
2016-03-05keyun
ReplyDeletelouis vuitton handbags
kids lebron shoes
canada goose
michael kors outlet
hollister clothing
air max 90
michael kors handbags
cheap jordans
air max 95
cheap rolex watches
ugg outlet online
uggs on sale
canada goose outlet
retro 11
rolex watches
air jordans
oakley sunglasses wholesale
coach outlet
timberlands
hollister clothing
air max 95
cheap uggs
michael kors outlet clearance
coach outlet store online
uggs sale
coach factory outlet online
michael kors outlet
fitflop clearance
hollister clothing
nike roshe run mens
gucci outlet
p90x
ralph lauren outlet
kobe 8
ralph lauren
kobe shoes
abercrombie and fitch
kd 8
kate spade outlet
jianbin1206
ReplyDeletemulberry bags
juicy couture tracksuit
toms outlet
louis vuitton outlet stores
ugg outlet
montblanc pens
coach outlet online
adidas wings
longchamp
ugg outlet online