1.导航栏中题目大改造
(1)无法同时设置标题和logo
主题head.php文件位置
...\wwwroot\default\usr\themes\pinghsu\header.php
修改head.php文件
主题head顶部调用了2个class,一个是div调用的“navbar-container",一个是a标签的文字调用的是"navbar-logo",a标签里嵌入的img调用的是“navbar-logo img”
<div class="navbar-container">
<a href="<?php $this->options->siteUrl(); ?>" class="navbar-logo">
<?php if($this->options->logoUrl): ?>
<img src="<?php $this->options->logoUrl();?>" alt="<?php $this->options->title() ?>" />
<?php else : ?>
<?php $this->options->title() ?>
<?php endif; ?>
</a>
想要修改typecho主题将标题和logo同时显示出来就要将其中的条件语句注释掉,即把if,else和endif都注释掉,如下
<div class="navbar-container">
<a href="<?php $this->options->siteUrl(); ?>" class="navbar-logo">
<?php # if($this->options->logoUrl): ?>
<img src="<?php $this->options->logoUrl();?>" alt="<?php $this->options->title() ?>" />
<?php # else : ?>
<?php $this->options->title() ?>
<?php # endif; ?>
</a>
(2)阴影样式标题修改
CSS样式文件位置
...\wwwroot\default\usr\themes\pinghsu\style.min.css
修改CSS文件
.navbar-logo{color:white;font-size:25px;line-height:25px;position:absolute;top:50%;left:0;display:block;width:auto;max-width:50%;height:25px;margin-top:-20px;margin-left:25px;text-decoration:none;font-family:"华文彩云";text-shadow:2px 2px 6px #444, 2px 2px 6px #777, 2px 2px 6px #aaa, 2px 2px 8px #ccc}
.navbar-logo img{width:auto;height:25px;outline:0;margin-top:-5px;}.navbar-menu{z-index:10;display:inline-block;width:auto;padding-right:5px}
其中做到白色阴影效果的关键css样式为color:white;text-shadow:2px 2px 6px #444, 2px 2px 6px #777, 2px 2px 6px #aaa, 2px 2px 8px #ccc,其他包括大小和颜色在内的样式可以自行根据需求修改
效果图如下
2.搜索页的建立和隐藏
(1)新建页面
管理--独立页面--新增
(2)选择模板Template Page of Search
自定义模板(右侧)选择模板Template Page of Search
(3)添加你自己想说的话
类似于文章编辑界面,在文本编辑器中输入你想说的话即可
如我写的是:
The following tabs can help you!
这里是帮助你的搜索页!
(4)设置搜索页隐藏属性
高级选项--公开度--隐藏
(5)添加自定义字段archive(可有可无)
添加自定义字段archive,这里是直接沿用了下面的maemo大佬的博客内容,不过我查了一下自定义字段archive的作用后认为这个字段可加可不加,起到的作用应该是设置页面最大显示信息条数为12,多于则自动翻页。
以下是从 ...\wwwroot\default\usr\themes\pinghsu\functions.php
查到的代码
function themeInit($archive){
Helper::options()->commentsMaxNestingLevels = 999;
if ($archive->is('archive')) {
$archive->parameter->pageSize = 12;
}
}
(6)设置搜索页
设置方式:
复制你的搜索页的访问地址,不要有空格,记得带上http://或https://
到外观设置那,在搜索页设置的输入框内,复制访问地址
效果图如下
3.使得rss正常工作
最新的typecho已经内置了feedURL()接口,但是主题没有对此进行适配,需要手动修改。
在设置-控制台-外观-编辑当前外观-footer.php中,按Command+F搜索关键词rss,找到语句,并将
siteUrl(); ?>feed/
替换为
feedUrl(); ?>
即
<a class="social rss" target="blank" href="<?php $this->options->siteUrl(); ?>feed/">RSS</a>
<a class="social rss" target="blank" href="<?php $this->options->feedUrl(); ?>">RSS</a>
4.文章封面的设立
(这个不属于改造的范畴,但是刚刚使用的时候不知道怎么设立封面很尴尬——涉及知识点自定义字段的使用)
以下两段代码均来自...\wwwroot\default\usr\themes\pinghsu\functions.php
,大致意思即thumb为封面字段,不设置则使用默认地址
$default_thumb = new Typecho_Widget_Helper_Form_Element_Text('default_thumb', NULL, '', _t('默认缩略图'),_t('文章没有图片时的默认缩略图,留空则无,一般为http://www.yourblog.com/image.png'));
function showThumb($obj,$size=null,$link=false){
preg_match_all( "/<[img|IMG].*?src=[\'|\"](.*?)[\'|\"].*?[\/]?>/", $obj->content, $matches );
$thumb = '';
$options = Typecho_Widget::widget('Widget_Options');
$attach = $obj->attachments(1)->attachment;
if (isset($attach->isImage) && $attach->isImage == 1){
$thumb = $attach->url;
if(!empty($options->src_add) && !empty($options->cdn_add)){
$thumb = str_ireplace($options->src_add,$options->cdn_add,$thumb);
}
}elseif(isset($matches[1][0])){
$thumb = $matches[1][0];
if(!empty($options->src_add) && !empty($options->cdn_add)){
$thumb = str_ireplace($options->src_add,$options->cdn_add,$thumb);
}
}
if(empty($thumb) && empty($options->default_thumb)){
return '';
}else{
$thumb = empty($thumb) ? $options->default_thumb : $thumb;
}
if($link){
return $thumb;
}
}
即想要设置文章封面即设置thumb字段的数值为对应图片的url地址即可
5.运行天数的设立
在本站的左下方可以看到运行xx天的字样
只需要修改Pinghsu主题的footer.php,搜索关键词copyright,找到下面这行代码:
<p>© <?php echo date('Y'); ?> <a href="<?php $this->options->siteUrl(); ?>"><?php $this->options->title(); ?></a></p>
然后在这一行代码的上方插入如下代码:
<script>
var s1 = '2021-2-27';//设置为你的建站时间
s1 = new Date(s1.replace(/-/g, "/"));
s2 = new Date();
var days = s2.getTime() - s1.getTime();
var number_of_days = parseInt(days / (1000 * 60 * 60 * 24));
document.getElementById('days').innerHTML = number_of_days;
</script>
在后台修改然后直接保存,刷新即可见效。
效果图如下
6.登录限制插件-LoginLimit
本节同基本摘自maemo大佬的博客
登录限制插件-LoginLimit
为了防止我们的管理员账号密码被暴力破解,我们需要限制在一定时间段内输错密码的次数。
有一个非常有用的插件:hongweipeng/LoginLimit_for_Typecho
下载插件
点开链接,从Github下载它的ZIP包,我们会得到一个名字带有-master
的文件夹。文件夹里面有个子文件夹叫做LoginLimit
,这就是插件本体了。
将LoginLimit
文件夹上传至Typecho博客目录/usr/plugins
里面。
修改代码
编辑var/Widget/User.php文件约第117行,将下列代码中的注释内容注释掉。
public function login($name, $password, $temporarily = false, $expire = 0)
{
//插件接口
$result = $this->pluginHandle()->trigger($loginPluggable)->login($name, $password, $temporarily, $expire);
// if ($loginPluggable) {
// return $result;
// }
注意!上面这一步非常重要,如果遗漏的话你会无法登陆自己的管理员账号,只能通过FTP重新上传修改后的User.php。
启用插件
修改成功后,访问博客后台插件管理面板启用插件。
可以在设置里面设置半小时允许出错的次数。
设置完成后,你可以登出账户,重新登录,如果输入一个错误的密码,它会提示你“无效的账号密码,您还可以尝试xx次”。
这样子,博客的安全性就有所上升了。
7.评论区的默认文字设立和强制性输入解除
主题comments.php文件位置
...\wwwroot\default\usr\themes\pinghsu\comments.php
搜索comment-container,即可发现对应设置评论区的代码,然后进行你的修改吧,我的修改如下:
将第一个span内容修改为:留下jio印
将第一个input内容修改为:呢称(敢问阁下尊姓大名)
将第二个input内容修改为:Email (如果想收到回复的通知~)
将第三个input内容修改为:你的站点 (奇怪的小伙伴增加了~(^▽^))"
将第一个button内容修改为:这里是提交按钮哟~
同时将邮箱和网址设置为非必填属性
8.
以上第2,3,4,5,6均来源于maemo大佬的博客,即转载自https://www.maemo.cc/2017/12/23/extend-typecho-site.html#directory03524971246665422624,且经过试用均可落实
本文由 javayuan 创作,采用 知识共享署名4.0 国际许可协议进行许可
本站文章除注明转载/出处外,均为本站原创或翻译,转载前请务必署名
最后编辑时间为: Aug 31, 2021 at 10:51 am