dyt5AAUI

魔改handsome主题
前排再次注意：底部因为行数过多，可能会其他内容展示 注意：只是为了自己以后更新主题方便改回来 1. 插件...
扫描右侧二维码阅读全文
29
2019/07

魔改handsome主题

  1.  Home
  2. Text  
    3. Share to：

前排再次注意：底部因为行数过多，可能会其他内容展示

注意：只是为了自己以后更新主题方便改回来

1. 插件浏览器标示 1老款typecho类都可用，后面发现了一款新的样式，但是只支持handsome

使用官方推荐的主题，修改comments.php文件（文件地址：usr/themes/handsome/component）大约70行

<?php UserAgent_Plugin::get_useragent($comments->agent,$comments->ip); ?>

2. 评论支持打卡，邮件通知等特性

同样修改omments.php文件（文件地址：usr/themes/handsome/component）第125行至145行，后面会有出入

                <form id="comment_form" method="post" action="<?php $this->commentUrl() ?>"  class="comment-form" role="form">
                    <div class="comment-form-comment form-group">
                        <label for="comment"><?php _me("评论") ?>
                            <span class="required text-danger">*</span></label>
                        <textarea id="comment" class="textarea form-control OwO-textarea" name="text" rows="5" placeholder="<?php _me("说点什么吧……") ?>" onkeydown="if(event.ctrlKey&&event.keyCode==13){document.getElementById('submit').click();return false};"><?php $this->remember('text'); ?></textarea>
                        <div class="OwO" style="display: inline;"></div><div class="OwO" style="display: inline;"><a href="javascript:addNumber('滴！访客卡！请上车的乘客系好安全带，现在是：')" class="OwO-logo"><i class="fontello fontello-user face"></i><span class="OwOlogotext">打卡</span></a></div>
                      <span><input name="receiveMail" type="checkbox" value="yes" checked /><label for="receiveMail"><strong>接收</strong>邮件通知</label></span>
                        <div class="secret_comment" id="secret_comment" data-toggle="tooltip"
                        data-original-title="<?php _me("开启该功能，您的评论仅作者和评论双方可见") ?>">
                            <label class="secret_comment_label control-label"><?php _me("私密评论") ?></label>
                            <div class="secret_comment_check">
                                <label class="i-switch i-switch-sm bg-dark m-b-ss m-r">
                                    <input type="checkbox" id="secret_comment_checkbox">
                                    <i></i>
                                </label>
                            </div>
                        </div>
                    </div>

还要在自定义CSS加上：

.secret_comment {
    top: 5px;
}
.OwO.OwO-open .OwO-body {
    display:table
}

3. 对于底部的版权信息修改

修改footer.php（文件地址：usr/themes/handsome/component）第8行和10行

<!--第八行--->
      Powered by <a target="blank" href="http://www.typecho.org">Typecho</a>&nbsp;|&nbsp;Theme by <a target="blank" href="https://www.ihewro.com/archives/489/">handsome</a>|&nbsp;Modify by <a target="blank" href="<?php $this->options->siteUrl(); ?>">dyt5AAUI</a>

      <!--第十行--->
<span class="text-ellipsis"><script type="text/javascript">
             <!-- Begin
              copyright=new Date();//取得当前的日期
              update=copyright.getFullYear();//取得当前的年份
              document.write("<i class='fab fa-html5'></i>Copyright©2016-"+ update + " <a href='<?php $this->options->siteUrl(); ?>'>(dyt5AAUI's blog)</a> All rights reserved.");//update为自动更新的年份
                //  End -->
               </script>&nbsp;

4. 对于头部修改

同样修改header.php（文件地址：usr/themes/handsome/component）第8行和10行

meta信息

    <meta http-equiv="Cache-Control" content="no-transform">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <meta charset="<?php $this->options->charset(); ?>">
    <!--IE 8浏览器的页面渲染方式-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <!--默认使用极速内核：针对国内浏览器产商-->
    <meta name="renderer" content="webkit">
    <!--另加标签-->
    <meta name="HandheldFriendly" content="true"/>
    <meta name="360-site-verification" content="5b31bf6b3564095a2665dcbc8c9a9e9f" />
    <meta name="msvalidate.01" content="113A7BA06CA22E0FA26D5728BF340975" />
    <!--chrome Android 地址栏颜色-->
    <?php if($this->options->ChromeThemeColor): ?>
    <meta name="theme-color" content="<?php $this->options->ChromeThemeColor() ?>" />
    <?php endif; ?>

    <?php echo Content::exportDNSPrefetch(); ?>

    <title><?php Content::echoTitle($this,$this->options->title,$this->_currentPage); ?></title>

JS信息

    <link href="https://cdn.staticfile.org/unslider/2/js/unslider-min.js" rel="stylesheet">

告知用户更新浏览器

    <!-- 告知用户更新浏览器 -->
    <script type="text/javascript">(function(w){if(!("WebSocket"in w&&2===w.WebSocket.CLOSING)){var d=document.createElement("div");d.className="browsehappy";d.innerHTML='<div style="width:100%;height:100px;font-size:20px;line-height:100px;text-align:center;background-color:#E90D24;color:#fff;margin-bottom:40px;">\u4f60\u7684\u6d4f\u89c8\u5668\u5b9e\u5728<strong>\u592a\u592a\u65e7\u4e86</strong>\uff0c\u592a\u592a\u65e7\u4e86 <a target="_blank" href="http://browsehappy.osfipin.com/" style="background-color:#31b0d5;border-color: #269abc;text-decoration: none;padding: 6px 12px;background-image: none;border: 1px solid transparent;border-radius: 4px;color:#FFEB3B;">\u7acb\u5373\u5347\u7ea7</a></div>';var f=function(){var s=document.getElementsByTagName("body")[0];if("undefined"==typeof(s)){setTimeout(f,10)}else{s.insertBefore(d,s.firstChild)}};f()}}(window));</script>

5. 添加天气在顶部

  • 或者自己去心知天气注册使用
    <div id="tp-weather-widget" class="navbar-form navbar-form-sm navbar-left shift"></div>
<script>
  (function (T, h, i, n, k, P, a, g, e) {
      g = function () {
          P = h.createElement(i);
          a = h.getElementsByTagName(i)[0];
          P.src = k;
          P.charset = "utf-8";
          P.async = 1;
          a.parentNode.insertBefore(P, a)
      };
      T["ThinkPageWeatherWidgetObject"] = n;
      T[n] || (T[n] = function () {
          (T[n].q = T[n].q || []).push(arguments)
      });
      T[n].l = +new Date();
      if (T.attachEvent) {
          T.attachEvent("onload", g)
      } else {
          T.addEventListener("load", g, false)
      }
  }(window, document, "script", "tpwidget", "//widget.seniverse.com/widget/chameleon.js"))
</script>
<script>
  tpwidget("init", {
      "flavor": "slim",
      "location": "WX4FBXXFKE4F",
      "geolocation": "enabled",
      "language": "zh-chs",
      "unit": "c",
      "theme": "chameleon",
      "container": "tp-weather-widget",
      "bubble": "enabled",
      "alarmType": "badge",
      "color": "#FFFFFF",
      "uid": "UB6953924F",
      "hash": "ce68b5b7b447ec5bda327f8c9c2d59f9"
  });
  tpwidget("show");
</script>
   <!-- 知心结束-->

    路径：/usr/themes/handsome/component/headnav.php
    此处需要注意的是需要将<div id="tp-weather-widget">改成<div id="tp-weather-widget" class="navbar-form navbar-form-sm navbar-left shift">，否则会发现样式显示异常！[1]
    注：参考来源飘若客

    6. 修改侧边栏

    同样修改sidebar.php文件（文件地址：usr/themes/handsome/component）第5行，后面会有出入

           <!--滚动广告（已删除该选项）-->
      <section id="a_d_sidebar" class="widget widget_categories wrapper-md clear">
      <h3 class="widget-title m-t-none text-md"><?php _me("滚动广告") ?></h3>
      <div id="myCarousel" class="carousel slide">  
        <!-- 轮播（Carousel）项目 -->
        <div class="carousel-inner">
            <div class="item active">
                 <a target="_blank" href="https://kms.whoit.top"><img src="https://www.whoit.top/image/banner1.png" /></a>
            </div>
            <div class="item ">
                <a target="_blank" href="https://www.whoit.top/image/banner3.png" ><img src="https://www.whoit.top/image/banner2.png" title="关注MIUI更新"/></a>
            </div>
            <div class="item ">
              <a target="_blank" href="https://www.foreverblog.cn/"><img src="https://www.whoit.top/image/snzy.png" /></a>
            </div>
        </div>
      <!-- 轮播（Carousel）导航 -->
        <a class="glyphicon carousel-control left" href="#myCarousel" 
           data-slide="prev"> <span _ngcontent-c3="" aria-hidden="true" class="glyphicon glyphicon-chevron-left"></span></a>
        <a class="glyphicon carousel-control right" href="#myCarousel" 
           data-slide="next"> <span _ngcontent-c3="" aria-hidden="true" class="glyphicon glyphicon-chevron-right"></span></a>
      </div>       
     </section>
           <!--举报-->
      <section id="a_d_sidebar" class="widget widget_categories wrapper-md clear">
      <h3 class="widget-title m-t-none text-md"><?php _me("举报中心") ?></h3>
     <a href="http://report.12377.cn:13225/mainNotice.html" target="_blank" rel="noopener"><img src="https://www.whoit.top/usr/themes/handsome/usr/img/ninja153907291410277.png" alt="网上有害信息举报" /></a>
        </section>
            <!--#-->
     <?php if ($this->is('index')) : ?>
      <section id="a_d_sidebar" class="widget widget_categories wrapper-md clear">
      <h3 class="widget-title m-t-none text-md"><?php _me("#") ?></h3>
          </section>
           <!--广告位置-->
       <section id="a_d_sidebar" class="widget widget_categories wrapper-md clear">
           <h3 class="widget-title m-t-none text-md"><?php _me("广而告之") ?></h3>
          <?php $this->options->adContentSidebar(); ?>
       </section>
       <?php endif; ?>
        <!--认证信息-->
     <?php if ($this->is('index')) : ?>
    <section id="categories-2" class="widget widget_categories wrapper-md clear">
     <h3 class="widget-title m-t-none text-md"><?php _me("认证信息") ?></h3>
     <a id="_pinganTrust" target="_blank" href="http://c.trustutn.org/show?type=1&sn=201904221002867240"><img src="http://c.trustutn.org/images/cert/cert_15_2.png" /></a>
      <a title="MySSL安全签章" id="myssl_seal" onclick="window.open('https://myssl.com/seal/detail?domain=www.whoit.top','MySSL安全签章','height=800,width=470,top=0,right=0,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no')"><img src="https://sealres.myssl.com/seal/img/1x/seal.png?domain=www.whoit.top" alt="www.whoit.top-MySSL安全签章"></a>
      <a><img src="https://verify.nic.xin/api/domain/showCreditLogo.do?logoToken=cca9f9d040ea1544e3659c8a7cefd62a"/></a>
    </section>
     <?php endif; ?>

    7. 修改文章版权信息

    修改page.php文件和post.php（文件地址：usr/themes/handsome），后面会有出入

         <!-- 此处page.php-->
<!-- 版权声明 （E语云博客 https://www.eyuyun.com）-->
<hr class="content-copyright" style="margin-top:50px" /><blockquote class="content-copyright" style="font-style:normal">
<p><strong>版权声明：</strong>本站原创文章，于<?php echo date("Y年m月d日", $this->modified);?>，由 <b><a href="<?php $this->options->siteUrl();?>" title="Posts by <?php $this->author();?>" rel="author"><?php $this->author();?></a></b> 最近修改。</p>
<p><strong>版权协议：</strong>本站遵循 <a rel="license" href="//creativecommons.org/licenses/by/4.0/deed.zh" target="_blank" rel="nofollow">CC BY-NC-SA 4.0</a>&nbsp;协议&nbsp;转载请注明出处</p>      
<p><strong>转载请注明：</strong><a href="<?php $this->permalink();?>" rel="bookmark" title="本文固定链接 <?php $this->permalink();?>"><?php $this->title();?> - <?php $this->options->title();?></a></p>
</blockquote>
                   <!-- 此处post.php-->
<!-- 版权声明 （E语云博客 https://www.eyuyun.com）-->
<?php if (($this->fields->copy_author) == ''): ?>
<hr class="content-copyright" style="margin-top:50px" /><blockquote class="content-copyright" style="font-style:normal">
<p><strong>版权声明：</strong>本站原创文章，于<?php echo date("Y年m月d日", $this->modified);?>，由 <b><a href="<?php $this->options->siteUrl();?>" title="Posts by <?php $this->author();?>" rel="author"><?php $this->author();?></a></b> 最近修改。</p>
<p><strong>版权协议：</strong>本站遵循 <a rel="license" href="//creativecommons.org/licenses/by/4.0/deed.zh" target="_blank" rel="nofollow">CC BY-NC-SA 4.0</a>&nbsp;协议&nbsp;转载请注明出处</p>      
<p><strong>转载请注明：</strong><a href="<?php $this->permalink();?>" rel="bookmark" title="本文固定链接 <?php $this->permalink();?>"><?php $this->title();?> - <?php $this->options->title();?></a></p>
</blockquote>
<?php else: ?>
<hr class="content-copyright" style="margin-top:50px" /><blockquote class="content-copyright" style="font-style:normal">
<p><strong>免责声明：</strong>本文主要内容转载自<a href="<?php echo $this->fields->copy_link;?>" rel="nofollow" title="文章来源 <?php echo $this->fields->copy_link;?>"><?php echo $this->fields->copy_author;?></a>，仅供用于学习和交流，若有侵权请邮件联系本站！</p>
<p><strong>本站联系方式：</strong>xxxxxx@gmail.com</p>
</blockquote>
<?php endif;?>

    functions.php的修改（添加底部）

         /*给文章增加自定义字段并绑定面板（易语云博客 https://www.eyuyun.com）*/
   $copy_author = new Typecho_Widget_Helper_Form_Element_Text('copy_author', NULL, NULL, _t('转载作者'), _t('文章转载自哪个网站，若为原创则留空'));
   $copy_author->input->setAttribute('class', 'w-100');
   $copy_link = new Typecho_Widget_Helper_Form_Element_Text('copy_link', NULL, NULL, _t('转载链接'), _t('转载文章的链接，若为原创则留空'));
   $copy_link->input->setAttribute('class', 'w-100');
   $layout->addItem($copy_author);
   $layout->addItem($copy_link);

Handsome 主题实现最新评论首页博客导航栏自动排第一功能

方法

1.下面是主要代码（插入到functions.php中）

function Autofirst(){
    $db = Typecho_Db::get();
    $query = $db->select()->from('table.comments')->where('authorId = ?','0')->order('coid',Typecho_Db::SORT_DESC)->limit(100);
    $result = $db->fetchAll($query);
    $arrUrl = array();
    $arrAuthor = array();
    foreach ($result as $value) {
        if($value["url"]!==null){
            array_push($arrUrl,$value["url"]);
            array_push($arrAuthor,$value["author"]);
        }
    }
    $su=array_filter(array_merge(array_unique($arrUrl)));
    $sa=array_filter(array_merge(array_unique($arrAuthor)));
    $num=0;
    for($i=0;$i<count(array_unique($su));$i++){
        if($su[$i]!=="" && $num<8){
            $num+=1;
            $db1 = Typecho_Db::get();
            $query1 = $db1->select()->from('table.comments')->where('url = ?',$su[$i])->order('coid',Typecho_Db::SORT_DESC)->limit(100);
            $result1 = $db1->fetchAll($query1);
            $arrAuthor1 = array();
            foreach ($result1 as $value) {
                    array_push($arrAuthor1,$value["author"]);
            }
            echo '<div class="col-lg-3 col-md-3 item"><a href="'.$su[$i].'" rel="external nofollow" class="btn btn-default btn-block overflow" target="_blank">'.$arrAuthor1[0].'</a></div>';
        }
    }
}

可以通过修改上述代码的num<8来调整显示最新评论者的数量，以4的倍数为宜。

2.这是调用代码和css（如果你跟我一样，用的是handsome主题，就直接插入到index.php的下面）

<div class="row visible-lg visible-md">
<div class="col-lg-12">
<div class="panel panel-default ggg">
    <div class="panel-heading">
        <i class="glyphicon glyphicon-th"></i> 您的每次评论都将会展示在本博客首页导航栏第一位
    </div>
    <div class="panel-body row autofirst1">
        <?php Autofirst(100) ?>
    </div>
</div>
</div>
</div>
    <style>
    .autofirst1 .item{
        padding:5px 10px
      }
    .item a{border-radius:10px}
    .overflow{
        overflow:hidden;
        white-space: nowrap;
        word-wrap: normal;
      }
    .autofirst1{
        padding:10px 20px
    }
    </style>

注：参考Handsome 主题实现最新评论首页博客导航栏自动排第一功能

Handsome 主题实现动态页面文字（user.js）

handsome\assets\js

// 个性化网页标题
var OriginTitile = document.title;
        var titleTime;
        document.addEventListener('visibilitychange', function () {
            if (document.hidden) {
                document.title = '快回来-- 网站崩溃了!  - whoit.top';
                clearTimeout(titleTime);
            }
            else {
                document.title = '￥￥￥-- 自动恢复了~ - whoit.top';
                titleTime = setTimeout(function () {
                    document.title = OriginTitile;
                }, 1500);
            }
        });

评论表情修改

本项修改评论表情，将原始表情替换成泡泡和阿鲁，只需要替换主题文件里的OwO.min.js和OwO.json文件就可以了。OwO.min.js在handsome/assets/js/features文件夹，OwO.json在handsome/usr文件夹。
文件（来自https://www.citrons.cn/jishu/211.html）：
滑稽表情.zip

版权属于：dyt5AAUI

本文链接：https://www.whoit.top/archives/913.html

转载时须注明出处及本声明

标签：主题，handsome，usr，themes，component，文件
Last modification：August 25th, 2019 at 01:56 pm
© 允许规范转载

Leave a Comment