留意我博客的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
突然变得有意思了