截图演示
把下列代码加入到子主题 functions.php 中
require get_stylesheet_directory()."/emoji.php";
把下列代码加入到 css样式文件中.
[content_hide]
/**表情tabs**/
.bq-close {
top: 0;
position: fixed;
width: 100%;
height: 100%;
left: 0;
}
.tabPanel ul li:hover {
background: #eaeaea;
}
.comt-smilies a:hover {
box-shadow: 0px 2px 5px #b5b5b5;
}
.tabPanel ul {
background: #fff;
display: flex;
height: 30px;
position: absolute;
bottom: 0;
}
.tabPanel ul li {
z-index: 5;
float: left;
margin: 0 2px 0 0;
font-size: 11px;
height: 29px;
line-height: 30px;
width: 88px;
text-align: center;
border-radius: 4px;
background: #fff;
}
.tabPanel .hit {
border-bottom: 1px solid #fff;
cursor: pointer;
color: black;
text-shadow: 0 1px 0 #fff;
background: #eaeaea;
}
.pane {
margin-left: 15px;
margin-top: 10px;
min-height: 100px;
background-color: #fff;
display: none;
}
.panes {
z-index: 4;
width: 347px;
height: 230px;
position: absolute;
overflow: scroll;
}
.wp-smiley{
max-height:50px!important;
width: 50px!important;
height: 50px!important;
}
.comt-smilies img {
width: 50px;
height: 50px;
}
.comt-smilies a {
list-style-type: none;
background: #f7f7f7;
padding: 5px 10px;
border-radius: 5px;
display: inline-block;
font-size: 12px;
line-height: 14px;
margin: 0 10px 12px 0;
cursor: pointer;
-webkit-transition: .3s;
transition: .3s;
}
.comt-smilies1 {
box-shadow: 0px 2px 5px rgb(181 181 181 / 32%);
border: 1px solid #b7b7b780;
padding: 10px;
background: #ffffff;
z-index: 4;
display: none;
width: 350px;
height: 230px;
position: absolute;
margin-top: -240px;
overflow: scroll;
}
.comt-smilies {
border-radius: 4px;
height: 256px;
box-shadow: 0px 2px 5px rgb(181 181 181 / 32%);
border: 1px solid #b7b7b780;
background: #fff;
width: 350px;
margin-top: -260px;
z-index: 3;
position: absolute;
display: none;
overflow: hidden;
}
.comt-addsmilies {
margin-right: 20px;
color: #888;
background: #fff;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 13px;
padding: 2px 15px;
height: 22px;
box-sizing: border-box;
z-index: 1;
}
.mrxu-item-xu-w {
background-position: center center;
background-repeat: no-repeat;
width: 100%;
height: 100%;
background-color: rgba(51,51,51,.2);
background-size: 50%;
position: absolute;
top: 0;
z-index: 2;
display: none;
}
.post-module-thumb:hover .mrxu-item-xu-w{
display: block;
}
.tt-slider {
height: 50px;
overflow: hidden;
}
.tt-slider .swiper-wrapper{
height: 50px;
overflow: hidden;
}
.swiper-backface-hidden .swiper-slide {
transform: initial;
-webkit-backface-visibility: hidden;
backface-visibility: initial;
}
.swiper-button-prev:after, .swiper-button-next:after {
color: #fff;
font-size: 27px;
}
.swiper-button-prev, .swiper-button-next {
z-index: 6;
background: #8e8e8e63;
border-radius: 9px;
top: 37%;
width: 25px;
height: 38px;
}
把下列代码加入到 child.js 中
$(function(){$('.tabPanel ul li').click(function(){$(this).addClass('hit').siblings().removeClass('hit');
$('.panes>div:eq('+$(this).index()+')').show().siblings().hide();})})
$(function(){ $(".bq-close").click(function(){ $('.comt-smilies').hide(); });});
$(function(){ $(".comt-addsmilies").click(function(){ $('.comt-smilies').toggle(); });});
$(function(){ $("textarea").click(function(){ $('.comt-smilies').hide(); });});
$(function(){ $(".bq-clos").click(function(){ $('.comt-smilies').hide(); });});
function mrxubq(mrxu){var content = $('#textarea').val();var xu=content+mrxu;$('#textarea').val(xu);}
[/content_hide]
把下面文件放入主题根目录后解压到当前目录，然后强制刷新即可
