新模板系统留言表情插件（增强版）发布！

该日志由 万恶 @ 13:12:55 发布,Tag: blogbus模板 评论表情

这次发布的留言表情插件是我重新构思的，功能上也更加符合用户需求，表情的自定义也更加方便。下面来讲下实现方法。

Header代码块：

 

把上面这些代码放在header代码块中即可，自定义方法请对照看下图注。


注意看下图中的红线框部分，/* */ 当中的代码表示这部分代码不起作用，默认代码中，有两处代码（红线框处）被故意设置成不起作用。


默认表情效果

下面来讲下自定义表情的方法，仍然是上面的代码，需要发动的地方不多。


去掉两处红线框处的代码 /* */ , 这样就启用了自定义的表情，简单吧？！下面看下我自带的自定义表情效果。


自带的是悠嘻猴的表情

可能大家不想要悠嘻猴表情，下面再来看下如何更换自定义表情。

 

修改这里的代码就可以了，代码的结构是这样的，

arrEmotion = ["图片网址1",
"图片网址2",
"图片网址3",
"图片网址4",
"图片网址5"];

图片网址的数目没有作规定，但最好不要超过20个，因为表情过多也不是件好事……请注意按照格式添加图片网址，最后一个图片网址后面没有 逗号 ！

另外还有一部分涉及到css的知识，我就不解释了，如果在应用过程中有什么问题，请留言给我。

完稿时间：2008-04-10 13:38:43





分类于：模板技巧 您可以: 阅读全文 ({#postCounter}) | 评论 (91) | 引用 (15)

评论

  • [avatar:40]http://izai.blogbus.com/logs/47842004.html 抽时间给大家做了个视频教程，希望对大家一定的帮助

    izai (http://izai.blogbus.com) 发表于 2009-10-31 22:26:34  [回复]

  • [avatar:42]一直在找这个功能 之前用的都是一些山寨的方法[face:03] 回去仔细研究一下，还是不懂的朋友 回头有空给大家做个视频教程[face:11]

    izai (http://izai.blogbus.com) 发表于 2009-10-04 19:40:50  [回复]

  • [avatar:46]把/*　*/去掉之后表情在右边 怎么把它弄下面来？

    万恶 回复 七重 说：
    去掉/* #emList {position:relative;top:-242px;left:420px;width:200px;} */
    这段代码就可以了
    (2009-09-23 19:34:17)

    七重 (http://qichongiris.blogbus.com) 发表于 2009-09-23 16:38:06  [回复]

  • [avatar:45]还是看不懂呐，菜鸟请教高手们，能否说详细点呢

    把上面代码放进去，看不到表情

    万恶 回复 海博 说：
    如果你使用的不是新模板系统，那么可能需要自行修改一些地方……传统模板系统可以参考这里的说明：http://mobanxx.blogbus.com/logs/29970267.html
    (2009-09-23 19:40:55)

    海博 () 发表于 2009-09-22 15:51:46  [回复]

  • [avatar:41]请问为什么我把表情的代码放进去后，我网页切换渐变的效果就没了呢？

    两者的代码不能共存吗？[face:01]

    熙 () 发表于 2009-09-14 12:54:02  [回复]

  • [avatar:45]我是新模板的，添加代码后没有显示表情。
    不知道什么原因。

    [face:17]

    万恶 回复 夏内。 说：
    出错的页面是什么，我需要看下出错页面才好分析
    (2009-09-11 20:21:38)

    夏内。 (http://magic-only.blogbus.com/) 发表于 2009-08-29 12:44:13  [回复]

  • [avatar:46]问下万叔叔(还是叫哥哥?)
    新模板系统下,评论框的文本编辑器可以和表情一起用吗?

    万恶 回复 AToro 说：
    试下就知道了，呵呵
    (2009-08-27 19:07:05)

    AToro (http://atoro.blogbus.com) 发表于 2009-08-23 21:19:09  [回复]

  • [avatar:48]为什么我点了表情 擦不到评论里面呢？？？

    校长 (http://yy56cc.blogbus.com) 发表于 2009-08-23 17:30:47  [回复]

  • [avatar:40]请问这增强版中的默认表情怎么比以前的少了一些呢，比如这个[face:11]笑脸的，使用率很高啊！请问怎样添加到默认中？

    万恶 回复 四味木 说：
    你可以使用自定义表情功能来自定义表情的
    (2009-08-27 19:10:53)

    四味木 (http://siweimu.blogbus.com) 发表于 2009-08-23 12:18:25  [回复]

  • [avatar:43][avatar:43]谢谢啊，我会拉[face:08]

    haha () 发表于 2009-08-22 17:39:17  [回复]

  • [avatar:44][avatar:40]成功了！谢谢你啊！太好了你人～～～～！：）[face:05]

    小粽子 () 发表于 2009-07-24 03:05:40  [回复]

  • [avatar:44]http://minloveguo.blogbus.com/logs/42673001.html

    不知道为什么就是改不了表情的样子。
    只能是默认的圆脸表情。怎么改呀？
    我明明地址都改成别的表情的地址了。。。
    可是还是不行耶！

    万恶 回复 延小莫 说：
    呵呵，已经改好了吧
    (2009-07-23 20:12:52)

    延小莫 (http://minloveguo.blogbus.com/) 发表于 2009-07-20 19:44:24  [回复]

  • [avatar:41]这个也是[face:17]
    跟留言头像一样的问题
    无论怎么换别的图都还是显示这几个图
    我以为是模版的问题
    但我换成大巴默认的基本模板也还是这样
    即使删掉一些头像的地址，它还是会显示出来
    请问老师，为什么会这样子的呢？
    难道是我电脑问题吗？[face:09]

    霖 () 发表于 2009-07-17 12:40:43  [回复]

  • [avatar:40]多谢<(_ _)> 现在好了～！

    zing () 发表于 2009-07-07 21:42:41  [回复]

  • [avatar:40]试了试ctrl+F5，可IE和Firefox还是都不能显示评论表情。。||| （用IE的话还是那张图的错误提示）

    万恶 回复 zing 说：
    http://bbs.blogbus.com/thread-65804-1-1.html
    看下这个帖子有没有用
    (2009-07-07 21:18:44)

    zing (http://zingyu.blogbus.com) 发表于 2009-07-07 19:45:08  [回复]

  • [avatar:40]评论表情好像失效了？
    http://i266.photobucket.com/albums/ii249/zingyu2/s-2.png

    万恶 回复 zing 说：
    应该是服务器文件调用的问题，我刚才看了下，已经好了
    (2009-07-07 19:29:20)

    zing (http://zingyu.blogbus.com) 发表于 2009-07-07 17:33:05  [回复]

  • [avatar:40]呃... 果然少了一个...
    谢谢.

    陆筱筱. () 发表于 2009-06-14 23:10:09  [回复]

  • [avatar:40]http://xiaoxiaocolly.blogbus.com/logs/40947364.html

    万恶 回复 陆筱筱. 说：
    我看了下你的博客，里面的代码不全，你有一个重要的代码没有复制进去，请仔细对照这篇日志检查下
    (2009-06-14 21:20:13)

    陆筱筱. () 发表于 2009-06-14 18:09:27  [回复]

  • [avatar:47]新模板下添加没有显示表情列表。
    不知道什么原因。[face:17]

    万恶 回复 陆筱筱 说：
    你好，我需要看到出错页面
    (2009-06-14 09:40:27)

    陆筱筱 (http://xiaoxiaocolly.blogbus.com/) 发表于 2009-06-13 16:21:07  [回复]

  • [avatar:41]看不懂吖

    水笙荇荇 (http://dollspel.blogbus.com) 发表于 2009-06-10 20:02:22  [回复]

  • [avatar:45]万恶阿~~
    我的是旧模板
    我想更换表情地址
    怎么换啊 我看你写的更换表情那篇文了
    可是貌似是新模板的啊 旧模板要怎么改？
    请指教~~

    万恶 回复 球 说：
    你可以参考这篇日志：
    http://mobanxx.blogbus.com/logs/29970267.html
    (2009-06-04 19:18:24)

    球 () 发表于 2009-06-03 19:11:45  [回复]

  • [avatar:43]大师~Help！
    我添加了这个插件后 点击博客右侧"+Comment"不能展开了 不知为何 麻烦指点[face:13]

    万恶 回复 Joan. 说：
    你好，你先试下去掉表情插件试试
    我看了下你的博客，里面用到的js代码太多，我也不能确定是什么问题引起的
    (2009-06-04 19:17:51)

    Joan. (http://neverland-meng.blogbus.com) 发表于 2009-05-31 23:19:26  [回复]

  • [avatar:40]还有一个问题想问万恶，如何实现评论像你一样，没有登录和匿名选择，直接评论呢？

    万恶 回复 Raymond 说：
    我的是旧模板系统
    (2009-04-24 21:59:20)

    Raymond (http://lvxingzj.blogbus.com) 发表于 2009-04-24 11:45:11  [回复]

  • [avatar:49][avatar:49]请教
    评论不能拥有“悄悄话”功能吗？

    万恶 回复 请教 说：
    暂时没有，估计以后也还是没有……
    (2009-04-24 21:59:31)

    请教 () 发表于 2009-04-24 10:09:55  [回复]

  • [avatar:40]感谢万恶~

    Raymond (http://lvxingzj.blogbus.com) 发表于 2009-04-22 10:52:03  [回复]

  • [avatar:46]我试了一下，这些表情都显示在评论输入框的右侧，如何实现显示在下面呢？

    万恶 回复 Raymond 说：
    去掉/* #emList {position:relative;top:-242px;left:420px;width:200px;} */
    这段代码就可以了
    (2009-04-21 23:31:27)

    Raymond (http://lvxingzj.blogbus.com) 发表于 2009-04-21 19:16:11  [回复]

  • [avatar:46]你好，我不想用自定义表情，而是默认的，但是发现数量不多，最简单的微笑表情都没有，也跟你这里的表情个数不一样，要怎么弄呢？谢谢哈

    万恶 回复 Raymond 说：
    这个问题你不是还可以利用自定义表情来解决吗？呵呵
    你需要的只是找齐你想要的表情，然后替换网址……
    (2009-04-21 19:05:11)

    Raymond (http://lvxingzj.blogbus.com) 发表于 2009-04-21 00:01:40  [回复]

  • [avatar:47]万恶！ 你好，
    我添加表情后，后面怎么还多了一个？
    我设置了18个表情， 可到最后多了以个“X” 一个挂了的图片！ 怎么去掉？ 或则是不是冲突了？

    我是在 head 最后面加上代码的，图片是png！

    万恶 回复 ditu 说：
    你肯定是多了一个逗号了，请检查下吧
    (2009-04-12 19:32:07)

    ditu (http://tb-8.blogbus.com/logs/37392841.html) 发表于 2009-04-12 12:02:32  [回复]

  • [avatar:40]怎么进入Header代码块啊??

    是要新建自定义模版啊?

    风间兰雅。 (http://66box.blogbus.com/) 发表于 2009-04-11 19:09:53  [回复]

  • [avatar:40]万恶老师，我是说下面的悠嘻猴表情表情显示不出来。。。麻烦在请你看一次，谢谢！我用FF和IE7都看不出。[face:09]

    ½Ø: (http://herowyk.blogbus.com/) 发表于 2009-04-06 17:29:25  [回复]

  • 评论分页：共4页 1 2 3 4 下一页 最后一页

发表评论

姓名：
E-mail：
地址：
 
 
表情：