HOME > パソコン > WordPressに、好みの「顔アイコン」を入れてみました。(WP Grins)

【お知らせ(マウスでクリック)2010-10-04】

最新の記事 /   

<Blogn+の管理画面CSSを変えてみました。(プチ改造)
北陸各県のアンテナショップめぐり(東京都内)新潟・福井・石川・富山>

WordPressに、好みの「顔アイコン」を入れてみました。(WP Grins)

記事ID別・パーマリンク: http://www.streetcar.jp/blog/index.php?e=579
記事タイトル: WordPressに、好みの「顔アイコン」を入れてみました。(WP Grins)
記事YMD別・パーマリンク: http://www.streetcar.jp/blog/index.php?d=20071107
  の顔アイコン (フェイスアイコン・フェイスマーク・スマイルアイコン・ニコちゃんマーク) を変更してみます。
 デフォルトでは標準の顔アイコンを入力出来るのですが、いちいちその「アイコンの記号を覚えておき」その「記号を入力する」と言うややこしい (^_^) 方法の様です。
 顔アイコンが文章入力欄のそばに一覧で常時表示され、それをマウスでクリックすると自動的に入力出来る・・・ そんな方法を探しました。【追記→】「Blogn+」では、標準でそのような方法になっています。

 初めに、 ( ) というプラグインを試してみました。 色々な顔アイコンを簡単に取り替えて使えるので便利で楽しいのですが、どういうわけか では、文章の途中で所々・アイコンに変換されない症状が出ます。(:_;)


 仕方が無いので、次に と言う、これも顔アイコンを使う為のプラグインを試します。
  では、こちらのプラグインで顔アイコンが正常に表示されますので、これを導入してみました。(^_^)V

 (時間が経つと忘れてしまうので、自分の備忘録としてメモします。)

  から、プラグインをダウンロード。
・ 解凍の後、/wp-content/plugins/ ディレクトリに wp-grins.php を FTP
・ 管理画面にログインし、プラグイン管理画面に行き、「WP Grins」を有効化する。
 ( 2.1より前のバージョンの場合は prototype.js もアップロードするそうです。)
 ( 以上・同梱の README.txt に書いてあります。)

 次に、標準の顔アイコンから自分の好みの顔アイコンに変更します。
 解凍したばかりの /wp-includes/functions.php の「1442行目」辺りから関連付けの記述が有りますので、その配列部分を書き換えます。

1442:function smilies_init() {
1443: global $wpsmiliestrans, $wp_smiliessearch,$wp_smiliesreplace;
1444:
1445: // don't bother setting up smilies if they are disabled
1446: if ( !get_option('use_smilies') )
1447:  return;
1448:
1449:  if (!isset($wpsmiliestrans)) {
1450:  $wpsmiliestrans = array(
1451:  ':mrgreen:' =>'icon_mrgreen.gif',
1452:  ':neutral:' =>'icon_neutral.gif',
1453:  ':twisted:' =>'icon_twisted.gif',
1454:  ':arrow:' => 'icon_arrow.gif',
1455:  ':shock:' =>'icon_eek.gif',
1456:  ':smile:' =>'icon_smile.gif',
 ・    ・・・・・
 ・    ・・・・・
 ・    ・・・・・

1495:  );
1496: }
1497:
1498: $siteurl = get_option('siteurl');
1499: foreach ( (array) $wpsmiliestrans as $smiley=> $img ) {
1500:  $wp_smiliessearch[] = '/(s|^)'.preg_quote($smiley,'/').'(s|$)/';

 上記の記述を、「標準の物」から「好みの顔アイコンの物」に配列を書換。

 私はこの ( ) にも使用している ( ) を にも使用します。(^_^)/




’[:(^o^):]’ => ’warai1.gif’,
’[:(^-^):]’ => ’warai2.gif’,
’[:( ̄▽ ̄):] ’ => ’warai3.gif’,
’[:(^_^):]’ => ’warai4.gif’,
’[:(^_^)/:]’ => ’warai5.gif’,
’[:o(^-^)o:]’ => ’gu.gif’,
’[:(^^ゞ:] ’ => ’poripori.gif’,


   ・      ・・・
   ・      ・・・
   ・      ・・・



 次に、実際の顔アイコンの画像ファイルを /wp-includes/images/smilies/ の中に入れます。
 これで完成です。\(^o^)/


 more-smiles プラグインだと 正常に動作しない事が有る 様なので、wp-grins でも管理画面から「投稿時にビジュアルエディタを使用する」のチェックを外しておきました。

 これで、顔アイコンが簡単に使える様になりました。


 投稿時は、左の図の様になります。

 顔アイコンをマウスでクリックすると、本文中に顔アイコンのコード [:(^o^):] が入ります。

 表示の時に、アイコン画像に変換されます。


 コメント欄にも表示させる為に、テーマのコメント入力欄の部分の、「id」を「comment」にします。
( 同梱の README.txt に説明があります。)

【例】<textarea id="comment " rows="8" cols="50"・・・></textarea>

 コメント欄にも、左の図の様に表示される様になります。


【被リンク・メモ】
ノリホ@Tsubame-Network(WP)2007/12/2(日)21:45
http://tsubame-jnr.bglb.jp/noriho/archives/1344
smiliesの作法/WordPressでの顔文字(スマイリー)の使用について。
que sera,sera 2008/02/05.07:18
http://bitterorange.if.land.to/archives/2008/02/05071815
smile,smiler?
Green web6 (2008/3/13 木曜日 2:15)
http://green.web6.jp/archives/58
プラグインWP Grins、Exec-PHPの不具合
washo y's Bookmarks 2008-07-01
http://www.diigo.com/user/Washo3?domain=www.streetcar.jp
wordpress 気になるプラグインまとめ - Life SCOPES 2009-2-17
エントリー ▲ 絵文字を付けたい (説明ページ)

・sir*_s*ra_s**asa*のブックマーク-Yahoo!ブックマーク(2009-5-9)
http://bookmarks.yahoo.co.jp/sira_sira_sirasan



| カテゴリー:パソコン | 00:00:00 | comments (0) | trackback (0) |




  Hatena::Bookmark  
 del.icio.us
twitter経由でコメント




コメント

コメントする

 (管理者の「チェック後・反映」の時が有ります)
 (なお投稿頂きましたコメントは著作権・著作隣接権・著作人格権・等を放棄(不行使)して頂きます)








トラックバックURL

 (管理者の「チェック後・反映」の時が有ります)
 (なお投稿頂きましたトラックバックは著作権・著作隣接権・著作人格権・等を放棄(不行使)して頂きます)

 ( 1クリックで全選択されます ▼ )

 ( トラックバックURLは変化します。最新の物をご利用下さい。 )

トラックバック

最新の記事 / このページの一番上へ /   

<Blogn+の管理画面CSSを変えてみました。(プチ改造)
北陸各県のアンテナショップめぐり(東京都内)新潟・福井・石川・富山>


[読み易く] [標準]
文字[大] [標準]


follow me on twitter
@streetcar
Follow me !

@portram
こちらはBot(無人投稿)アカウントです

プロフィール

カテゴリー

アーカイブ


カウントダウン

リンク


スクリプト



新着記事


アクセスランキング


検索



コメント


トラックバック

144

シンジケート

この日記のはてなブックマーク数 del.icio.us - Everybody's bookmarks
track feed
Locations of visitors to this page

Amazon 広告


Google 広告


ValueCommerce広告

spacer.gifspacer.gifspacer.gifspacer.gifspacer.gif
ベストリザーブ

LinkShare広告

 iTunes Music Store(Japan)spacer.gif iTunes Store(Japan)spacer.gifANAの旅行サイト ANA SKY WEB TOURspacer.gif











▼ テスト

テスト


アクセス解析&SEM/SEO講座&ブログ for オンラインショップ開業