给WordPress添加快捷文字回复评论功能

给WordPress添加快捷文字回复评论功能

当用户点击快捷回复上的文字按钮时,相应的内容就会自动填入评论框内,这为那些不愿意多花时间打字,又想说点什么的用户提供了很大的方便,加强用户体验。实现方法如下:

html结构

找到comments.php模板,在适当的位置添加下面的标签结构

<div id="shortcut-reply">
    <span>快捷回复</span>
    <div>
        <ul>
            <li id="sr-qd"  href="javascript:;">签到</li>
            <li id="sr-zc"  href="javascript:;">支持</li>
            <li id="sr-gx" href="javascript:;">感谢</li>
            <li id="sr-gl" href="javascript:;">给力</li>
            <li id="sr-jy" href="javascript:;">加油</li>
            <li id="sr-sq" href="javascript:;">生气</li>
        </ul>
    </div>
</div>

js控制

需要jQuery库的支持

/*文字快捷回复 */
$(document).on('click', '#shortcut-reply li', function() {
    var b = $(this), c = $("#comment"), t = c.val(), d = new Date(), e = d.toLocaleTimeString(), f = b.fadeOut();
    switch (b.attr("id")) {
        case "sr-qd" : c.val( t + "特来签到,签到时间:" + e + ", 支持 买卖易MMeasy.CN!"), f;
        break;
        case "sr-zc" : c.val( t + "买卖易资源不错,支持一下,以后会常来!"), f;
        break;        
        case "sr-gx" : c.val( t + "这篇文章对我有帮助,感谢买卖易博主无私分享!"), f;
        break;
        case "sr-gl" : c.val( t + "买卖易真是太给力了,顶啊!"), f;
        break;
        case "sr-jy" : c.val( t + "买卖易加把劲,我看好你哦!"), f;
        break;        
        case "sr-sq" : c.val( t + "真是肺都气炸了,买卖易的资源太棒了!"), f;
        break;
    default:
        return !1;
    }
});

参考css

/*评论快捷回复文字按钮*/
#shortcut-reply{color:#aaa;background:#f6f6f6;padding:10px 20px;position:relative;overflow:hidden;margin:0px;}
#shortcut-reply span{float:left;font-size:15px;font-weight:bold;color:#737F99;padding:2px 0;margin-right:10px}
#shortcut-reply li{cursor:pointer;float:left;padding:2px 10px;background:#E8EBF2;color:#666;margin-right:5px;display: inline;}
#shortcut-reply li:hover{background:#737F99;color:#fff}

 

免责声明:
1、本站提供的一切软件、教程和内容信息等资源均仅限用于学习和研究目的,不保证其完整性,严禁将上述资源用于商业或者非法用途;
2、本站仅提供共享服务,不提供任何技术咨询服务,请知悉谅解;
3、如果对相关资源比较满意,请前往购买支持正版,得到更好的正版服务;
4、本站信息来自网络公开信息的收集整理,版权争议与本站无关。我们非常重视版权问题,如有侵权请联系我们,我们会第一时间进行处理。
本文链接:https://www.mmeasy.cn/3294.html

0
封面图
【严正声明】
1、本站所分享的工具及源代码仅供研究、学习所用,不保证其完整性,若要商用请联系原开发者或开发公司;
2、所有资源切记不能用于一切违法犯罪活动,否则一切法律后果自负,请不要贪图小利走上不归路;
3、本站资源均来自互联网收集或网友分享,若有侵权,请联系站长删除,谢谢。
没有账号? 注册  忘记密码?