一个或许比较有趣又或者无聊的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');

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

恩,感觉棒棒的

-- 完 --

发表评论取消回复

10 Replies to “一个或许比较有趣又或者无聊的WordPress小功能”

moi说道：

2020年2月1日上午9:59

天吖，研究了半小时，总算开窍了，把这个功能给添加上了！ 😛

回复
moi说道：

2019年10月23日下午4:34

黑呼呼的，啥也看不见~

回复
moi说道：

2019年10月11日下午1:20

🙁 搞不了，这也太难了~~~

回复
shengkui说道：

2018年2月5日下午11:36

可以考虑把这个对话引用功能集成到主题里嘛！

回复
1. 云落说道：
  
  2018年2月6日上午10:41
  
  @shengkui 不考虑，很简单的小功能，自己用小插件
  
  回复
叶良辰说道：

2017年12月20日下午3:36

贴上能把代码贴全？贴一半还不如不贴。

回复
1. 云落说道：
  
  2017年12月20日下午5:06
  
  @叶良辰不实用的小玩意
  
  回复
龙笑天说道：

2017年10月14日下午3:01

这个挺有意思的~ 😉

回复
祭夜说道：

2017年10月13日下午4:42

待会儿试试看

回复
农村小伙说道：

2017年10月10日下午10:01

云落-怎么用

回复