dyt5AAUI

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

魔改handsome主题

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


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

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

标签:主题handsomeusrthemescomponent文件
Last modification:August 25th, 2019 at 01:56 pm

Leave a Comment