Azure · 蔚蓝简洁的Typecho主题

转载自:jimmycai

在下载主题之前请先想好,在下载主题后会不会去除链接,如果是请直接ALT+F4,这是一款开源免费主题但是不代表你可以随便去除作者链接,主题以Creative Commons Attribution 3.0 License发布,不保留链接你就不要用。 如果你还是去除了链接那我也没办法,自己看着办吧。

因为Bootstrap被诟病太臃肿,所以这次就用PureCSS来制作了。嘛,之前我也没听说过这个框架,是前几天Google的时候发现的,Yahoo旗下的~
言归正传,整个主题的架构是官方的一个模版,觉得好看就顺便移植到了Typecho,有一些感觉没什么用的CSS我就顺带给精简了下,然后自己写了一些

原模版是FlatUI样式的,自己比较喜欢Metro所以就修改了下色调~

特点

  • 自适应
  • 简洁快速(无JS)

下载

我把它发布在了GitHub上,欢迎移植到其他平台上~
地址 → Typecho版本WordPress版本

更新记录

1.6版本:
首先祝各位51快乐,这次更新后如果不是很大的BUG我应该就不会再更新了,所以怕更新频繁的同学们可以放心用了。*推荐重新下载*

    友情链接样式美化(来自@山炮不二)

<ol修复opensans字体无法引用的问题(多打了个 )<=”” ol=””>

    把”主页”改成”首页”(@iKirby)
    同上,把”登陆”改成”登录”
    修改状态样式,改为方框
    把页脚的链接改为在新窗口打开
    这次把CDN的文件地址修改成了style.min.css,不过原来的style.css我还是会保留的,下个月应该就要删了。

1.5.5版本:

      -加入CDN设置,默认启动

CDN

    -解决CODE破框的问题
    加入友情链接
    加入IE9以下的版本兼容提醒(IE9不兼容Placeholder)
    评论回复链接变成按钮
    修复在移动端上评论区的资料框挤在一起的情况。

1.5版本:
突然发现好像最近我都是20多天才更新一次,都有点成规律了xD。 这次直接跳过了1.4版本,因为我想要已经比较圆♂润点的数字。 BTW,这次我吸取了评论区的意见,例如发布动画效果,侧边栏变窄和中文字体不好看什么的。

    去除主页的面包屑导航,修改面包屑导航class名字
    加入动画(不喜欢的请使用关于里面的联系方式来向我索取,我也可以借此统计下比例)
    加入自定义字体:OpenSans,中英文字体显示更加完美
    把侧边栏修改成20%,内容区可以容纳更多东西了
    首页文章概括字体颜色变淡,可以更好的与标题区分
      加入警告框(来自Bootstrap),

使用方法

1.3版本
这个是这20天中我修改的自用版,不过还是去除了动画,因为总会有人不喜欢的。 因为修改了许多东西所以没法一一列举,就随便说几个吧:

    再次精简style.css
    搜索框完美~
    修改文章日期,评论数量的显示位置,效果可以看我的博客
    优化侧边栏按钮的显示
    优化字体显示

1.2.5版本:

    去除border-radius
    去除按钮的阴影

1.2版本:

    大幅度精简框架
    零零碎碎的细节

1.1.5版本:

    更改页脚的显示方式,改为blockquote
    修改了分页方块的大小

P.S:也许是最终版本了

1.1版本:

    再次完善搜索栏的样式(太折腾了)
    改善了文章的日期,分类的显示样式,改为小色块

1.0.5版本:

    删除多余的样式,手机下的搜索框和站点介绍
      加入一个文章样式(状态),一个简单blockquote,在需要使用的文章添加自定义字段

Status

    即可
    改善了评论资料框的样式(之前没发现…现在已经是33%每个框了)

警告框

这个是1.5版本以后版本的功能,在使用之前请先检查下你的主题版本。
一共有4种类型的警告框,顺便感谢下Bootstrap。
使用方法就是把DIV复制到你的文章,把内容修改下就可以了
PS:刚刚更新了下警告框的样式名字,所以请把GitHub上的style.css内容复制到你的主题里面即可。 – 2014/04/20

<div class="alert warning">内容</div>
<div class="alert danger">内容</div>
<div class="alert success">内容</div>
<div class="alert info">内容</div>
k

状态样式

发布文章时在下方的自定义字段中添加一个Status的字段即可。
样式为一个blockquote方框

CDN

主题默认是启动CDN功能的(在主题设置里面开关),CDN服务器搭建在AppFog上,速度还行。
之所以要做这个CDN是因为更新有点频繁,所以才做了这个CDN,像是一些小的CSS更新各位在启动CDN后就不用再下载替换了。
至于那些想要DIY样式的可以在主题目录下创建一个新的CSS文件然后引用,里面复制粘贴你想要DIY的样式然后修改,这样子就不会被版本更新所影响了。

碎碎念


从2月23号发布到现在的主题,说实话我真的很欣慰,从中也学到了许多东西,同时感谢你们的支持。
其实刚刚开始移植这个主题的时候也想过放弃,因为出现了很多的BUG,而且还要自己去规划主页以外的页面。
1.0版本在现在看起来真心是不堪入目,说句自私点的话,我感觉现在的主题已经和官方版本完全不同了。
BTW,请随意下载,你可以在评论区给我意见,但是反馈BUG请先看看是不是主题修改不当所引发的问题。

P.S

第一次发布主题,难免会有些缺点啥的,欢迎在Github或者在本文评论留下建议(博客现在有邮件通知)
主题以Creative Commons Attribution 3.0 License发布,就是说可以随便修改主题,不过要保留链接
感谢 @夕虚 的测试~
主题的分页部分是从Bootstrap中拿的。
评论样式来自Cho的Maupassant主题。

  • 通告关闭
  • 评论 (1)
  1. 博主,你的文章目录不好看吧

评论关闭

请访问主站 suiyuanjian.com

回到顶部~