Drary, A Typecho Theme
, It's sunny
前言
这个主题第一个版本是好几年前写的了,四五年了吧,这么久的原因当然是高考和学习(被其他人类有趣的事物)吸引住了,抄袭仿照了好多的东西,比如首页仿照了卡片日记(不知道构不构成侵权,如果侵权了请作者联系我删除GitHub库)这个软件,大部分css都是复制别的主题的,所以你能在这个主题看到很多其他主题的影子,具体不列举了,时隔多年,我都忘了是哪些了。
这个主题十分的粗糙,不过有些地方我还是挺满意的,粗糙的点是好多地方没上动画,例如链接的动画,Div块的动画,色彩方面也比较随意,没有形成一套系统
20241112-20241114新增了几个页面如Archives(改)、Tags、Mumble。这次改动没有动js,因为我不会,基本都是css和html还有一丢丢丢的php,感觉加载速度有点差,我觉着可以再优化一下,不过优化哪方面我还不知道2333
具体效果看我这个网站吧,不细说,响应式啥的还是有的,下面想到什么写什么,或者我去参考一下别人的
该主题在typecho2.1,PHP7.4,MySql5.6.50和Nginx1.24.0上运行良好
使用方法
下载主题重命名为Drary,我觉着还是别改成其他的好,我现在也不确定有没有什么资源是引用是用绝对路径的
然后进入typecho后台,控制台,外观启用
主题介绍
后台
当然我也是有东抄抄西抄抄,整了个设置外观的,主要是这个在这里填入一个搜索 URL 地址功能,好久远了,我想我当时的想法是把这个搜索变成像百度或者bing一样,改成百度或者Bing,忘了
伪静态
我用的是这个
if (!-e $request_filename) {
rewrite ^(.*)$ /index.php$1 last;
}
首页缩略图
自带10张缩略图
当文章又图时会用文章第一张图做缩略图
自定义缩略图 :设置自定义字段的名称为 img 值则添加图片链接
weather
首页天气默认 sunny , 需要自定义天气时请 设置自定义字段的字段名称为 weather , 字符值为以下
- cloudy day --> 阴天
- cloudy --> 多云
- lightning --> 闪电
- rain --> 下雨
- snowing --> 下雪
- storm --> 暴雨
- sunny --> 晴天
引用金言的作者
注:我也忘记金言是啥意思了,这主题4,5年前写的,忘记很正常吧2333
!!!
<p class="author">作者</p>
!!!
效果
林花谢了春红,太匆匆。无奈朝来寒雨晚来风。
友情链接
目前有两种方法,当然你也可以创建自己的友链方式
方法一(默认)
默认的意思是,用本主题之后,你需要安装Links插件,然后将SHOW_TEXT模式源码规则改为下面的代码,然后创建一个独立界面,选择 Links 即可,后续的不用看。
<a class="link" href="{url}" target="_blank"><span class="name">{name}</span><span class="label">{title}</span></a>
然后在page-link.php中添加
<h2 id="友情链接">友情链接</h2>
<div class="menu adsila">
<?php $this->links(); ?>
<?php $this->content(); ?>
</div>
在添加友链时,需要添加友链名称、友链地址和友链描述
方法二(旧)
在page-link.php中添加这段js
<script>function link(link, name, label){document.write("<a class=\"link\" href=\"\/\/");document.write(link);document.write("\" target=\"_blank\">");document.write("<span class=\"name\">");document.write(name);document.write("<\/span>");document.write("<span class=\"label\">");document.write(label);document.write("<\/span>");document.write("<\/a>");
} </script>
例如
<?php
/**
* Links
*
* @package custom
*/
if (!defined('__TYPECHO_ROOT_DIR__')) exit;
?>
<?php $this->need('header.php'); ?>
<div id="main">
<article class="page post">
<h1 class="post-title frame" itemprop="name headline"><?php $this->title() ?></h1>
<div class="post-content frame" itemprop="articleBody">
<div itemprop="articleBody">
<script>function link(link, name, label){document.write("<a class=\"link\" href=\"\/\/");document.write(link);document.write("\" target=\"_blank\">");document.write("<span class=\"name\">");document.write(name);document.write("<\/span>");document.write("<span class=\"label\">");document.write(label);document.write("<\/span>");document.write("<\/a>");
} </script>
<?php $this->content(); ?>
</div>
</div>
<!--目录树-->
<div class="top-box post">
<div id="toc-wrapper">
<div id="toc"></div>
</div>
</div>
<!--目录树-->
</article>
<?php $this->need('comments.php'); ?>
</div>
<?php $this->need('footer.php'); ?>
之后创建一个独立页面选择 Links 然后,如下面所示创建你的友链,链接不需要加https://和http://
!!!
document.write('<div class="menu adsila">');
link('链接1', '站点名1', '介绍1');
link('链接2', '站点名2', '介绍2');
link('链接3', '站点名3', '介绍3');
link('链接4', '站点名4', '介绍4');
document.write('</div>');
!!!
文章Markdown展示
展示并为我后面修改提供参考
这段内容参考了MARKDOWN 中文1
标题
段落
我真的很喜欢使用
Markdown。
我想从现在开始使用它来格式
化我所有的文档。
换行
后跟两个空格的第一行。
以及下一行。
后跟 HTML 标签的第一行。<br>
以及下一行。
加粗
星号加粗 加粗文本。
横线加粗 __加粗文本__。
Loveisbold
斜体
斜体文本是 cat's meow。
斜体文本是 _cat's meow_。
Acatmeow
加粗和斜体
此文本 非常重要。
此文本是 ___非常重要___。
此文本是 __非常重要__。
此文本是 非常重要。
这是非常非常重要的文本。
删除线
The world is flat. We now know that the world is round.
引用块
Dorothy followed her through many of the beautiful rooms in her castle.
Dorothy followed her through many of the beautiful rooms in her castle.
The Witch bade her clean the pots and kettles and sweep the floor and keep the fire fed with wood.
嵌套引用块
Dorothy followed her through many of the beautiful rooms in her castle.
The Witch bade her clean the pots and kettles and sweep the floor and keep the fire fed with wood.
包含其他元素的引用块
The quarterly results look great!
- Revenue was off the chart.
Profits were higher than ever.
Everything is going according to plan.
列表
有序列表
- 第一个项目
- 第二个项目
- 第三项
- 第四项
带缩进的有序列表
- 第一个项目
- 第二个项目
第三项
- 缩进项
- 缩进项
- 第四项
无序列表
- 第一项
- 第二项
- 第三项
- 第四项
带缩进的无序列表
- 第一项
- 第二项
第三项
- 缩进项
- 缩进项
- 第四项
在列表中添加元素
段落
- This is the first list item.
Here's the second list item.
I need to add another paragraph below the second list item.
- And here's the third list item.
引用块
- This is the first list item.
Here's the second list item.
A blockquote would look great below the second list item.
- And here's the third list item.
代码块
- Open the file.
Find the following code block on line 21:
<html> <head> <title>Test</title> </head>
- Update the title to match the name of your website.
图像
- Open the file containing the Drary.
Marvel at its beauty.
- Close the file.
列表
- First item
- Second item
Third item
- Indented item
- Indented item
- Fourth item
代码
在命令提示符下,键入 nano
。
代码块
{
"firstName": "John",
"lastName": "Smith",
"age": 25
}
水平线
_
链接
My favorite search engine is Duck Duck Go.
添加标题
My favorite search engine is Duck Duck Go.
URL 和电子邮件地址
http://markdownguide.cn
mailto:[email protected]
格式化链接
I love supporting the EFF.
This is the Markdown Guide.
See the section on code
.
HTML链接
图像
链接图片
表格
Syntax | Description |
---|---|
Header | Title |
Paragraph | Text |
对其
Syntax | Description | Test Text |
---|---|---|
Header | Title | Here's this |
Paragraph | Text | And more |
脚注
Here's a simple footnote,2 and here's a longer one.3
Indent paragraphs to include them in the footnote.
`{ my code }`
Add as many paragraphs as you like.
定义列表
First Term
: This is the definition of the first term.
Second Term
: This is one definition of the second term.
: This is another definition of the second term.
任务列表
- [x] Write the press release
- [ ] Update the website
- [ ] Contact the media
高亮
I need to highlight these ==very important words==.
I need to highlight these very important words.
下标
H~2~O
H2O
上标
X^2^
X2
更新日志
Drary更新日志-----Copy 日志 2333
计划
Drary新的想法-----需要改进的地方
- 大部分是从MARKDOWN 中文 copy 的,查重率高达99%,2333 ↩
- This is the first footnote. ↩
- Here's one with multiple paragraphs and code. ↩
MoXiify
很有趣,看到了不少巧思:D
MuYang
谢谢大佬的肯定2333