Hexo 页脚增加网站运行时间统计

本文摘自,Blog - LuoV(鸣谢)

效果图:
在这里插入图片描述

  1. 找到 \themes\next\layout\_partials\ 下面的 footer.swig 文件

  2. 在合适的位置添加下面代码(通过运行调试,查看运行时间出现的位置)

<span id="sitetime"></span>
<script language=javascript>
	function siteTime(){
		window.setTimeout("siteTime()", 1000);
		var seconds = 1000;
		var minutes = seconds * 60;
		var hours = minutes * 60;
		var days = hours * 24;
		var years = days * 365;
		var today = new Date();
		var todayYear = today.getFullYear();
		var todayMonth = today.getMonth()+1;
		var todayDate = today.getDate();
		var todayHour = today.getHours();
		var todayMinute = today.getMinutes();
		var todaySecond = today.getSeconds();
		/* 
		Date.UTC() -- 返回date对象距世界标准时间(UTC)1970年1月1日午夜之间的毫秒数(时间戳)
		year - 作为date对象的年份,为4位年份值
		month - 0-11之间的整数,做为date对象的月份
		day - 1-31之间的整数,做为date对象的天数
		hours - 0(午夜24点)-23之间的整数,做为date对象的小时数
		minutes - 0-59之间的整数,做为date对象的分钟数
		seconds - 0-59之间的整数,做为date对象的秒数
		microseconds - 0-999之间的整数,做为date对象的毫秒数
        */
		var t1 = Date.UTC(2020,02,13,15,00,00); //北京时间2018-2-13 00:00:00
		var t2 = Date.UTC(todayYear,todayMonth,todayDate,todayHour,todayMinute,todaySecond);
		var diff = t2-t1;
		var diffYears = Math.floor(diff/years);
		var diffDays = Math.floor((diff/days)-diffYears*365);
		var diffHours = Math.floor((diff-(diffYears*365+diffDays)*days)/hours);
		var diffMinutes = Math.floor((diff-(diffYears*365+diffDays)*days-diffHours*hours)/minutes);
		var diffSeconds = Math.floor((diff-(diffYears*365+diffDays)*days-diffHours*hours-diffMinutes*minutes)/seconds);
		document.getElementById("sitetime").innerHTML=" 已运行"+/*diffYears+" 年 "+*/diffDays+" 天 "+diffHours+" 小时 "+diffMinutes+" 分钟 "+diffSeconds+" 秒";
	}
	siteTime();
</script>
  1. 我的代码粘贴位置: footer.swig (仅供参考)
{%- if theme.footer.beian.enable %}
  <div class="beian">
    {{- next_url('http://www.beian.miit.gov.cn', theme.footer.beian.icp + ' ') }}
    {%- if theme.footer.beian.gongan_icon_url %}
      <img src="{{ theme.footer.beian.gongan_icon_url }}" style="display: inline-block;">
    {%- endif %}
    {%- if theme.footer.beian.gongan_id and theme.footer.beian.gongan_num %}
      {{- next_url('http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=' + theme.footer.beian.gongan_id, theme.footer.beian.gongan_num + ' ') }}
    {%- endif %}
  </div>
{%- endif %}

<div class="copyright">
  {% set copyright_year = date(null, 'YYYY') %}
  &copy; {% if theme.footer.since and theme.footer.since != copyright_year %}{{ theme.footer.since }}{% endif %}
  <span itemprop="copyrightYear">{{ copyright_year }}</span>
  <span class="with-love">
    <font color="red"><i class="fa fa-heartbeat" aria-hidden="true"></i></font>
  </span>
  <span class="author" itemprop="copyrightHolder">{{ theme.footer.copyright or author }}</span>

  {%- if config.symbols_count_time.total_symbols %}
    <span class="post-meta-divider">|</span>
    <span class="post-meta-item-icon">
      <i class="fa fa-area-chart"></i>
    </span>
    {%- if theme.symbols_count_time.item_text_total %}
      <span class="post-meta-item-text">{{ __('symbols_count_time.count_total') + __('symbol.colon') }}</span>
    {%- endif %}
    <span title="{{ __('symbols_count_time.count_total') }}">{{ symbolsCountTotal(site) }}</span>
  {%- endif %}

  {%- if config.symbols_count_time.total_time %}
    <span class="post-meta-divider">|</span>
    <span class="post-meta-item-icon">
      <i class="fa fa-coffee"></i>
    </span>
    {%- if theme.symbols_count_time.item_text_total %}
      <span class="post-meta-item-text">{{ __('symbols_count_time.time_total') }} &asymp;</span>
    {%- endif %}
    <span title="{{ __('symbols_count_time.time_total') }}">{{ symbolsTimeTotal(site, config.symbols_count_time.awl, config.symbols_count_time.wpm, __('symbols_count_time.time_minutes')) }}</span>
  {%- endif %}
</div>
<!--添加运行时间-->
<span id="sitetime"></span>
<script language=javascript>
	function siteTime(){
		window.setTimeout("siteTime()", 1000);
		var seconds = 1000;
		var minutes = seconds * 60;
		var hours = minutes * 60;
		var days = hours * 24;
		var years = days * 365;
		var today = new Date();
		var todayYear = today.getFullYear();
		var todayMonth = today.getMonth()+1;
		var todayDate = today.getDate();
		var todayHour = today.getHours();
		var todayMinute = today.getMinutes();
		var todaySecond = today.getSeconds();
		/* 
      Date.UTC() -- 返回date对象距世界标准时间(UTC)1970年1月1日午夜之间的毫秒数(时间戳)
      year - 作为date对象的年份,为4位年份值
      month - 0-11之间的整数,做为date对象的月份
      day - 1-31之间的整数,做为date对象的天数
      hours - 0(午夜24点)-23之间的整数,做为date对象的小时数
      minutes - 0-59之间的整数,做为date对象的分钟数
      seconds - 0-59之间的整数,做为date对象的秒数
      microseconds - 0-999之间的整数,做为date对象的毫秒数
     */
		var t1 = Date.UTC(2020,03,14,18,12,20); //北京时间2018-2-13 00:00:00
		var t2 = Date.UTC(todayYear,todayMonth,todayDate,todayHour,todayMinute,todaySecond);
		var diff = t2-t1;
		var diffYears = Math.floor(diff/years);
		var diffDays = Math.floor((diff/days)-diffYears*365);
		var diffHours = Math.floor((diff-(diffYears*365+diffDays)*days)/hours);
		var diffMinutes = Math.floor((diff-(diffYears*365+diffDays)*days-diffHours*hours)/minutes);
		var diffSeconds = Math.floor((diff-(diffYears*365+diffDays)*days-diffHours*hours-diffMinutes*minutes)/seconds);
		document.getElementById("sitetime").innerHTML=" 已运行"+/*diffYears+" 年 "+*/diffDays+" 天 "+diffHours+" 小时 "+diffMinutes+" 分钟 "+diffSeconds+" 秒";
	}
	siteTime();
</script>
<!--// 添加运行时间-->

<!-- 新增访客统计代码 -->
<div class="busuanzi-count">
    <script async="" src="https://dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js"></script>
    <span class="site-uv">
      <i class="fa fa-user"></i>
      访问量 <span class="busuanzi-value" id="busuanzi_value_site_uv"></span><span class="post-meta-divider">|</span>
    </span>
    <div class="powered-by"></div>
    <span class="site-uv">
      <i class="fa fa-eye"></i>
      总访客 <span class="busuanzi-value" id="busuanzi_value_site_pv"></span></span>
    <!--
    <span class="site-pv">
      <i class="fa fa-pencil"></i>
      本站博客共 <span class="post-count">{{ totalcount(site) }}</span></span>
    -->
</div>
<!-- 新增访客统计代码 END-->

{%- if theme.footer.powered.enable %}
  <div class="powered-by">
    {{- __('footer.powered', next_url('https://hexo.io', 'Hexo', {class: 'theme-link'})) }}
    {%- if theme.footer.powered.version %} v{{ hexo_version }}{%- endif %}
  </div>
{%- endif %}

{%- if theme.footer.powered.enable and theme.footer.theme.enable %}
  <span class="post-meta-divider">|</span>
{%- endif %}

{%- if theme.footer.theme.enable %}
  <div class="theme-info">
    {%- set next_site = 'https://theme-next.org' %}
    {%- if theme.scheme !== 'Gemini' %}
      {%- set next_site = 'https://' + theme.scheme | lower + '.theme-next.org' %}
    {%- endif %}
    {{- __('footer.theme') }}{{ next_url(next_site, 'NexT.' + theme.scheme, {class: 'theme-link'}) }}
    {%- if theme.footer.theme.version %} v{{ next_version }}{%- endif %}
  </div>
{%- endif %}

{%- if theme.add_this_id %}
  <div class="addthis_inline_share_toolbox">
    <script src="//s7.addthis.com/js/300/addthis_widget.js#pubid={{ theme.add_this_id }}" async="async"></script>
  </div>
{%- endif %}

{{- next_inject('footer') }}
  • 6
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
在宝塔面板中,我们可以使用Hexo搭建个人博客,并且可以让Hexo在后台运行。下面是具体步骤: 1. 安装宝塔面板:通过官方网站下载对应系统版本的宝塔面板安装包,然后按照安装向导进行安装。 2. 登录宝塔面板:安装完成后,打开浏览器,在地址栏输入服务器IP地址或者域名,即可进入宝塔登录界面。输入初始用户名和密码登录。 3. 添加网站:在宝塔面板首页中,点击左侧菜单栏中的网站,然后点击添加网站按钮。填写网站域名、路径、PHP版本等信息,点击确认即可添加网站。 4. 安装Node.js:在宝塔面板的软件商店中,搜索Node.js,点击安装。安装完成后,在网站的设置-基础设置中,将网站的Node.js版本设置为安装的版本。 5. 设置Hexo:通过SSH连接到服务器,在网站根目录下运行以下命令安装Hexo: ``` npm install -g hexo-cli // 全局安装hexo-cli命令行工具 hexo init blog // 初始化一个博客文件夹 cd blog // 进入博客文件夹 npm install // 安装博客所需依赖 ``` 6. 配置Hexo:在博客文件夹中,找到_config.yml文件,使用编辑器打开,修改站点的url和root路径为你的网站域名。 7. 后台运行Hexo:在SSH中运行以下命令,将Hexo以后台方式运行: ``` nohup hexo server -d & ``` 这样,Hexo就会在后台运行,并且可以通过你的网站域名访问博客了。 通过以上步骤,我们可以在宝塔面板中成功搭建Hexo博客,并实现后台运行。这样,我们就可以方便地管理和更新博客内容,同时提供稳定的博客访问服务。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值