留意我博客的dalao们可能都发现了我的评论里能添加表情了。
是的，我已经往我现在在使用的minty模板里添加了一个表情面板（ OωO — 一朵炒鸡萌的表情面板 – Diygod | GitHub – DIYgod/OwO）
然后使用了 sm.ms 图床存储表情包。
于是，have fun.
部署方式
前往 GitHub – DIYgod/OwO 下载DIYGod的OwO原件，获取到如下内容
然后里面的dist/*和demo/owo.json对我们有用。
把他们上传到服务器后，编辑您模板的文件，在<head></head> 中加入<link rel=”stylesheet” href=”{OwO.min.css的路径}”>
然后在<footer></footer> 中或者其他您认为可以的地方添加
<script src="{OwO.min.js的路径}"></script>
<script>
var OwO_demo = new OwO({
logo: 'OωO表情',//更改面板前显示的内容
container: document.getElementsByClassName('OwO')[0],
target: document.getElementsByClassName('OwO-textarea')[0],//输入框的class
api: './OwO.json',//OwO.json位置
position: 'down',//位置
width: '100%',//宽度
maxHeight: '250px'//最大高度
});
</script>
需要修改的内容：
- OwO.min.css的路径
- OwO.min.js的路径
- OwO.json位置
然后进入您的comments.php中找到<textarea></textarea>标签并为其添加OwO-textarea 的class属性。
然后在<footer class=”comment-form-footer”> 后添加<div class=”OwO”></div> ，然后保存。
于是，OwO面板的基础部分部署完成。
更换/增加/删除表情
表情的内容在OwO.json里设置。
{
"颜文字": {
"type": "emoticon",
"container": [
{
"icon": "OωO",
"text": "Author: DIYgod"
},
{
"icon": "|´・ω・)ノ",
"text": "Hi"
},
{
"icon": "ヾ(≧∇≦*)ゝ",
"text": "开心"
},
{
"icon": "(☆ω☆)",
"text": "星星眼"
},
{
"icon": "（╯‵□′）╯︵┴─┴",
"text": "掀桌"
},
{
"icon": "￣﹃￣",
"text": "流口水"
},
{
"icon": "(/ω＼)",
"text": "捂脸"
},
{
"icon": "∠( ᐛ 」∠)＿",
"text": "给跪"
},
{
"icon": "(๑•̀ㅁ•́ฅ)",
"text": "Hi"
},
{
"icon": "→_→",
"text": "斜眼"
},
{
"icon": "୧(๑•̀⌄•́๑)૭",
"text": "加油"
},
{
"icon": "٩(ˊᗜˋ*)و",
"text": "有木有WiFi"
},
{
"icon": "(ノ°ο°)ノ",
"text": "前方高能预警"
},
{
"icon": "(´இ皿இ｀)",
"text": "我从未见过如此厚颜无耻之人"
},
{
"icon": "⌇●﹏●⌇",
"text": "吓死宝宝惹"
},
{
"icon": "(ฅ´ω`ฅ)",
"text": "已阅留爪"
},
{
"icon": "(╯°A°)╯︵○○○",
"text": "去吧大师球"
},
{
"icon": "φ(￣∇￣o)",
"text": "太萌惹"
},
{
"icon": "ヾ(´･ ･｀｡)ノ\"",
"text": "咦咦咦"
},
{
"icon": "( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃",
"text": "气呼呼"
},
{
"icon": "(ó﹏ò｡)",
"text": "我受到了惊吓"
},
{
"icon": "Σ(っ °Д °;)っ",
"text": "什么鬼"
},
{
"icon": "( ,,´･ω･)ﾉ\"(´っω･｀｡)",
"text": "摸摸头"
},
{
"icon": "╮(╯▽╰)╭ ",
"text": "无奈"
},
{
"icon": "o(*////▽////*)q ",
"text": "脸红"
},
{
"icon": "＞﹏＜",
"text": ""
},
{
"icon": "( ๑´•ω•) \"(ㆆᴗㆆ)",
"text": ""
},
{
"icon": "(｡•ˇ‸ˇ•｡)",
"text": ""
}
]
},
"Emoji": {
"type": "emoji",
"container": [
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "? ",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "? ",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
},
{
"icon": "?",
"text": ""
}
]
},
"图片表情": {
"type": "image",
"container": [
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/face1.jpg\">",
"text": "face1"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/face2.gif\">",
"text": "face2"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/face3.jpg\">",
"text": "face3"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/face4.jpg\">",
"text": "face4"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/face5.jpg\">",
"text": "face5"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/face6.jpg\">",
"text": "face6"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/face7.jpg\">",
"text": "face7"
}
]
},
"岁纳京子": {
"type": "image",
"container": [
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/jz1.jpg\">",
"text": "face1"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/jz2.gif\">",
"text": "face2"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/jz3.gif\">",
"text": "face3"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/jz4.gif\">",
"text": "face4"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/jz5.jpg\">",
"text": "face5"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/jz6.gif\">",
"text": "face6"
},
{
"icon": "<img src=\"//o5mvhz1ad.qnssl.com/jz7.jpg\">",
"text": "face6"
}
]
}
}
看着改就是了。
|´・ω・)ノalert(‘xss’)
(๑•̀ㅁ•́ฅ)你忘记写script标签了兄嘚
表情包是怎么搞的？
之前没看到所以没回复，我用第三方图床的
sm.ms
∠( ᐛ 」∠)＿做了没写文的我
233
这功能可以有~
2333
Get~
|´・ω・)ノ挺好玩的
233
突然变得有意思了