点击登录
  • 欢迎访问乐趣公园网站,WordPress信息,WordPress教程,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站,欢迎加入乐趣公园 QQ群
  • Git主题现已支持PHP7版本,速度应该会提高不少,不过云落的网站本来就很快了,所以感觉不是太明显
  • 最新版Git主题已支持说说碎语功能,可像添加文章一样直接添加说说,新建说说页面即可,最后重新保存固定连接,演示地址
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏乐趣公园吧
  • 云落的淘宝店铺已经开张了哦,传送门:https://kimipet.taobao.com

一个或许比较有趣又或者无聊的WordPress小功能

WordPress 云落 1周前 (10-10) 49次浏览 已收录 3个评论
文章目录[隐藏]

现在网上流行微信对话聊天截图,通过对话截图,也可以写一段比较有意思的文章,今天云落也来做一下这个功能。

一个或许比较有趣又或者无聊的WordPress小功能

前言


我不知道其他朋友有没有这样的经历,比如有时候你介绍一个东西或者文章的时候,总想吐槽几句或者夸一句。一般这个时候我们可能有一个文本框,或者引用来表示这段文字。但是如果将这段文字用做,表情加文字泡的现实可能会更好一点。

实现方法

云落是比较喜欢用短代码的形式,所以这个功能同样是用短代码来实现。在这个功能里面,我设置了说两个人物,然后有九个表情。根据需要不同的文字来使用不同的表情。比如说一段很正常文字,我们就会使用冷漠脸。如果是高兴的话,我们可以用一个,非常开心的表情。当然我们也可以用吐槽的表情。

  • 当然啦,如果有时候自己犯傻的话也可以自嘲几句。毕竟像云落这样可是经常犯错的。比如这个就是,这个是头像在左侧的,表情属于是冷漠脸的,这个人物是谁还真不知道

  • 当然了,由于这个功能更偏向娱乐,所以这个功能不打算加入主题里面,几句短代码实现的小功能,感觉没必要加入主题里面,下面云落把主要代码贴一下,有需要的自己添加

代码

define( 'SP_URI', plugin_dir_url(__FILE__) );//返回本插件链接,以/结尾
// 对话
function bq_comment($atts, $content=null){
    extract(shortcode_atts(array("p"=>'',"x"=>''), $atts));
		if($p == '0'){
			$pclass = 'even';
			$bqclass1 = 'n';
		}elseif($p=='1') {
			$pclass = 'odd';
			$bqclass1 = 'y';
		}
		if($x=='0'){
			$bqclass2 ='none';
		}elseif($x=='1'){
			$bqclass2 ='happy';
		}elseif($x=='2'){
			$bqclass2 ='angry';
		}elseif($x=='3'){
			$bqclass2 ='sad';
		}elseif($x=='4'){
			$bqclass2 ='cry';
		}elseif($x=='5'){
			$bqclass2 ='baga';
		}elseif($x=='6'){
			$bqclass2 ='anxious';
		}elseif($x=='7'){
			$bqclass2 ='surprise';
		}elseif($x=='8'){
			$bqclass2 ='excited';
		}
			return '<ul class="dlg">
	<li class="dlg_clear '.$pclass.'">
		<div class="bqavatar bq_'.$bqclass1.'_'.$bqclass2.'"></div>
		<div class="comment-content">'.$content.'</div>
	</li>
</ul>';

}
add_shortcode('bqshuo','bq_comment');

//加载密码可见的样式
function bqshuo_css() {
	global $post,$posts;
		foreach ($posts as $post) {
			if ( has_shortcode( $post->post_content, 'bqshuo') && is_singular() ){
    echo '<style type="text/css">
.dlg { width: 100%; }
.dlg_clear { clear:both; }
.dlg li {
	margin-bottom: 15px;
	overflow: hidden;
}
.dlg li div {
	*width:72%; max-width:72%; line-height:160%; letter-spacing:1px;color:#333;
}
  .article-content .dlg{
    margin-left: 0px;
  }
.bqavatar {
	float: left;
	height:98px;
	margin:5px 15px 0 15px;
	padding: 1px;
	width: 88px;
	border-radius:5px;
	border:1px solid #fff;
}
.comment-content {
	background: #eee;
	float: left;
	padding: 10px 15px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	margin-top:8px;
}
.even .comment-content {
	padding-left: 7px;
}
.odd .comment-content {
	padding-right: 7px;
}
.odd .bqavatar, .odd .comment-content {
	float:right;
	position:relative;
}
  .article-content .dlg li:before {
    content: "";
  }
.even .comment-content:before, .odd .comment-content:after {
	content: "";
	width: 0;
	height: 0;
	font-size: 0;
	position: relative;
	border: 8px solid transparent;
	overflow: hidden;
	top:-2px;
}
.even .comment-content:before {
	border-right-color: #eee;
	border-left: 0;
	left: -15px;
  top:20px;
}
.odd .comment-content:after {
	position:absolute;
	top:20px;
	border-left-color: #eee;
	border-right: 0;
	right: -8px;
}
.bq_n_none { background-image:url('.SP_URI.'static/img/n_0_none.jpg); }
.bq_n_happy { background-image:url('.SP_URI.'static/img/n_1_happy.jpg); }
.bq_n_angry { background-image:url('.SP_URI.'static/img/n_2_angry.jpg); }
.bq_n_sad { background-image:url('.SP_URI.'static/img/n_3_sad.jpg); }
.bq_n_cry { background-image:url('.SP_URI.'static/img/n_4_cry.jpg); }
.bq_n_baga { background-image:url('.SP_URI.'static/img/n_5_baga.jpg); }
.bq_n_anxious { background-image:url('.SP_URI.'static/img/n_6_anxious.jpg); }
.bq_n_surprise { background-image:url('.SP_URI.'static/img/n_7_surprise.jpg); }
.bq_n_excited { background-image:url('.SP_URI.'static/img/n_8_excited.jpg); }
.bq_n_leiben { background-image:url('.SP_URI.'static/img/n_9_leiben.jpg); }
.bq_y_none { background-image:url('.SP_URI.'static/img/y_0_none.jpg); }
.bq_y_happy { background-image:url('.SP_URI.'static/img/y_1_happy.jpg); }
.bq_y_angry { background-image:url('.SP_URI.'static/img/y_2_angry.jpg); }
.bq_y_sad { background-image:url('.SP_URI.'static/img/y_3_sad.jpg); }
.bq_y_cry { background-image:url('.SP_URI.'static/img/y_4_cry.jpg); }
.bq_y_baga { background-image:url('.SP_URI.'static/img/y_5_baga.jpg); }
.bq_y_anxious { background-image:url('.SP_URI.'static/img/y_6_anxious.jpg); }
.bq_y_surprise { background-image:url('.SP_URI.'static/img/y_7_surprise.jpg); }
.bq_y_excited { background-image:url('.SP_URI.'static/img/y_8_excited.jpg); }
.bq_y_fuhei { background-image:url('.SP_URI.'static/img/y_9_fuhei.jpg); }</style>';}
}
}
add_action('wp_head', 'bqshuo_css');

由于这个功能是写在插件里面的,所以有些代码自己可以改下.

  • 恩,感觉棒棒的

-- OVER --
乐趣公园 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:一个或许比较有趣又或者无聊的WordPress小功能
喜欢 (2)
云落
关于作者:
无折腾,不生活,我是一个WordPress菜鸟,一个玩淘宝的卖家,欢迎你认识我,我是云落!
发表我的评论
取消评论
表情 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(3)个小伙伴在吐槽
  1. 这个挺有意思的~ :wink:
    龙笑天2017-10-14 15:01 (6 days前)Reply Windows 7 | Firefox浏览器 28.0
  2. 待会儿试试看 :mrgreen:
    祭夜2017-10-13 16:42 (1 week前)Reply Android 7.1.2 | Firefox浏览器 56.0
  3. 云落-怎么用
    农村小伙2017-10-10 22:01 Reply Windows XP | Chrome 11.0.672.0