Wordpress / Wordpress教程

WordPress添加文章字数统计代码+添加文章字数统计代码+头像旋转

TSY · 5月11日 · 2020年本文共2320个字 · 预计阅读8分钟658次已读
WordPress添加文章字数统计代码+添加文章字数统计代码+头像旋转

今天偶尔想到的这个
就发出来了,简9rQCxMP4aMR2A3ZH68MP4I5o1coJzqMZ单一段代码,给访客查看文章时自动开始统计阅读文章多少esfrdgrsGSSDXCSFD9rQCxMP4aMR2A3分多少秒
很有意思的一个小功能
上图

注:此为精简版,本人比较喜欢吧

代码:

将以下代码加入到WordPress主题目录中的“文章页:single.php”文件合适的位置。

esfrdgrsGSSDXCSFD9rQCxMP4aMR2A3

Emlog应该是主题目录下的:echo_log.php文件合适位置(图片需要下载出来,小编用了防盗链)

<p style="text-align: center;"><img src="https://www.ly522.com/wp-images/tishi.gif"</span> &nbsp;<span>您阅读这篇文章共花了:</span>
<span id="stime"></span>
<script language="JavaScript">var ss=0,mm=0,hh=0;function TimeGo(){ss++;if(ss>=60){mm+=1;ss=0}if(mm>=60){hh+=1;mm=0}ss_str=(ss<10?"0"+ss:ss);mm_str=(mm<10?"0"+mm:mm);
tMsg=""+hh+"小时"+mm_str+"分"+ss_str+"秒";document.getElementById("stime").innerHTML=tMsg;setTimeout("TimeGo()",1000)}TimeGo();</script></p>

完整版/如图

WordPress添加文章字数统计代码+添加文章字数统计代码+头像旋转

代码

<div id="tingliu"><span class="tingliu2 hint--top hint--bounce" data-hint="希望这篇文章能给你带来收获,去发表评论吧!?">
<a href="##"><img src="https://www.ly522.com/wp-images/tishi.gif" class="tingliu5"></a>
</span> &nbsp;<span class="tingliu2">您阅读这篇文章共花了:</span>&nbsp;<span class="tingliu3" id="stime"></span></div>
<script language="JavaScript">var ss=0,mm=0,hh=0;function TimeGo(){ss++;if(ss>=60){mm+=1;ss=0}if(mm>=60){hh+=1;mm=0}ss_str=(ss<10?"0"+ss:ss);mm_str=(mm<10?"0"+mm:mm);tMsg=""+hh+"小时"+mm_str+"分"+ss_str+"秒";document.getElementById("stime").innerHTML=tMsg;setTimeout("TimeGo()",1000)}TimeGo();</script>

css

#tingliu{margin: 30px 0px 15px 0px; padding: 5px 0px 10px 0px; height: 100%; line-height: 2; text-align:center; font-size:14px; background: #F1E8DF; border: 1px dashed #CEB8A3; width: 100%; transition:all 0.2s ease-in-out 0s; -moz-transition:all 0.2s ease-in-out 0s;-webkit-transition:all 0.2s ease-in-out 0s;} .tingliu2{color:#7C4500;} .tingliu3{color: #C03131;} .tingliu5{position:relative; left:0px; top:5px;}

WordPress添加文章字数统计代码

代码实现前台文章esfrdgrsGSSDXCSFD9rQCxMP4aMR2A3界面显示文章字数统计代码 之前只能后台显示,现在前台也就可以显示啦

主题 全局配置文件 中
functions.php文件中加入以下代码:
有些主esfrdgrsGSSDXCSFD9rQCxMP4aMR2A3题会是在functions-theme.php文件中:

//字数统计
function count_words ($text) {
global $post;
if ( '' == $text ) {
$text = $post->post_content;
if (mb_strlen($output, 'UTF-8') < mb_strlen($text, 'UTF-8')) $output .= '本文共' . mb_strlen(preg_replace('/\s/','',html_entity_decode(strip_tags($post->post_content))),'UTF-8') . '个字';
return $output;
}
}

调用代码

<?php echo count_words ($text); ?>

放在文章配置文件(合适的位置就可以了)测试中文统计正常,英文统计字母

WordPress添加文章字数统计代码+添加文章字数统计代码+头像旋转

WordPress头像旋转

/*头像旋转*/
.avatar{
-webkit-transition:0.4s;
-webkit-transition:-webkit-transform 0.4s ease-out;
transition:transform 0.4s ease-out;
-moz-transition:-moz-transform 0.4s ease-out;
}
.avatar:hover{
transform:rotateZ(360deg);
-webkit-transform:rotateZ(360deg);
-moz-transform:rotateZ(360deg);
}
0 条回应