某储备粮的“学习笔记”

by 咳嗽di小鱼

之前的浮云主题也用了快一年了, 有些腻味.
主题本身也有很多问题, 比如代码质量不是很好, 主题的CSS对博客文章的Typography没有很规范的支持, 浮云比较吃CPU...

一直想换主题却没有找到好的. 最近对Bootstrap很是痴迷, 又有了点空闲, 就顺手仿着Bootstrap官网风格做了一个Typecho的主题.
自己觉得效果还不错, po出来给喜欢的朋友.

设计风格

  • 黑白灰
  • 简洁明了

特色功能

  • 自动吸附顶端的导航栏
  • 在各种设备上自适应显示 (如: iPhone/iPad)
  • 侧栏的新浪微博展示插件
  • 集成Google Code Prettify

应用的技术

  • Bootstrap + jQuery
  • HTML5 + CSS3
  • Responsive CSS

下载

下载我放在doLast.com上了, 点Download即可

http://dolast.com/pages/trapecho
https://github.com/gregwym/Trapecho/zipball/master


功能详解

新浪微博

  • /admin/options-theme.php主题设置页中填入新浪微博的UID, 侧栏中就会显示新浪微博的插件.
  • 在设置中删除UID号码并保存, 即可关闭插件

根据分辨率自适应布局

  • 如果您在看我的博客, 现在把浏览器缩小就能看出效果.
  • 在iPhone/iPad等移动设备上也能有很好的博客阅读体验
  • 支持iOS的阅读器模式

侧栏可选项

  • 显示最新文章
  • 显示相关文章
  • 显示最近回复
  • 显示标签
  • 显示分类
  • 显示归档
  • 显示友情链接(需要友情链接插件)
  • 显示其它杂项

Google Code Prettify

  • 为了统一主题风格, 也特别定义了代码的高亮方式, 如果有朋友不喜欢, 从footer.php最后删除和pre有关的几行JavaScript即可.
  • 使用很简单, 展示大段的代码, 使用<pre>将代码括住, 就会自动高亮, 语言类型自动识别.



    <pre>
        <!--你的代码放在中间-->
    </pre>
    
  • 比如,



    int main(){
        cout << "Welcome to Trapecho" << endl;
        return 0;
    }
    
  • 更多使用方法请参考, google-code-prettify README


47 comments »

  1. 这个板子不错,挺简洁的!

    1. 哈哈`欢迎Neal...你站现在用的什么主机? 我这个从国内访问还是有点慢.

  2. 现在用的是linode的vps,选的是日本数据中心的,国内速度还是挺不错的,你的还是原来的quickweb不?

    1. 是啊`还是那个...挺好用的, 我在加拿大的时候访问速度非常行, 但这段时间回国感觉还是有点卡, ping都在500以上. 考虑中...

    2. 一直用linode的。。。

    3. linode还是贵>_

  3. 你的验证码怎么回事?教教我呗!

    1. Typecho的插件, http://typecho.us/plugins/comments-fancy-captcha.html

  4. 喜欢下面这个防垃圾评论的。。。哈哈
    悲剧,刚才没完全拖进,结果提示验证码错误了

    1. 哈哈`时不时有垃圾评论...普通的验证码又很难看. 碰巧看到这个插件, 我也喜欢的很.

    2. 于是这是te上的一个插件?还是都可以通用的~

    3. 是TE一个插件, 不过可以移植到别的地方...

  5. 比我做的主题好看多了

    1. 小盒子你太谦虚了...哈哈`

  6. 之前我做了个WP的,后来我发现 那是对IE来说是一个悲剧........你的 ..那个验证的东西是什么?

    1. IE 6就算了...Bootstrap对IE7以后的支持还说得过去. 验证是Fancy Captcha

  7. xue xue

    微博秀提示“XXX微博秀好像出了点小问题”

    1. 非常感谢...没想到新浪还+了个类似密钥的东西.
      已经更新解决了, 改成直接填写代码, 代码里包含密钥, 还可以自定义样式, 哈哈.

      重新下载即可.

    2. xue xue

      能提供你用的验证码插件么/?很好看。。我找不到。。。。

    3. 你搜Typecho Fancy Captcha

  8. 好喜欢这么简洁的主题啊

  9. 使用了你提供的主题,报个BUG,分类里面会有一个重复的条目,用其它的主题没有。
    我的网站可以看到。

    1. 确实有这个问题, 删掉header里的

      <?php $this->widget('Widget_Metas_Category_List')->to($categories); ?>
      <?php while($categories->next()): ?>
      <li<?php if($this->is('category', $categories->slug)): ?> class=\"current\"<?php endif; ?>><a href="<?php $categories->permalink(); ?>" title="<?php $categories->name(); ?>"><?php $categories->name(); ?></a></li>
      <?php endwhile; ?>
      

      就可以了.
      感觉是Typecho的bug, 前边调用过->to($**)然后用while($**->next()), 后边再输出的时候就会出重复项. 但导航栏因为要高亮当前页面, 不能直接用parse, 不知道有什么别的办法修复.

  10. 好喜欢你这个代码高亮,能不能单独提供一个插件啊?我自己看了好久都无从下手啊。

    1. 这...`我抽空研究下吧, 但估计得等放假, 哈哈. 上学太忙了.

    2. 好的好的,今天弄这个代码高亮,整了一天都没像样。。然后随便找了一个。

  11. 博主你好,感谢分享你的主题,我现在正在使用,但是有一个问题想麻烦你,验证码怎么添加上去的,我按照那个插件的说明做还是失败了。。。

    1. <div class="control-group">
          <label class="control-label" for="url">Captcha</label>
          <div class="controls">
              <?php FancyCaptcha_Plugin::output(); ?>
          </div>
      </div>
      
    2. 加在"提交评论"的div之前应该就可以了

      <div class="form-actions">
      	<button type="submit" class="btn btn-primary"><?php _e(\'提交评论\'); ?></button>
      </div>
      
  12. 故作调 故作调

    非常感谢这个主题,挺喜欢的
    可以自己DIY咩。。。

  13. 故作调 故作调

    感谢主题,可以下载自己更改么。。

    1. 项目在Github上, 请随意fork

  14. labchy labchy

    放在apache 下面访问报错 错误代码如下
    Fatal error: Using $this when not in object context in /var/www/Trapecho/index.php on line 11
    能否指点一下?

    1. 这是一个Typecho博客程序用的主题, 不是独立的网页网站, 不能直接打开index.php.

    2. labchy labchy

      非常感谢 ~

  15. 这个主题很好,我悄悄地偷过去了,只是友链那个要怎么弄,还麻烦指点下。

    1. 友链插件么? http://www.imhan.com/typecho/

  16. 友链插件弄好了,你那个验证码插件我很喜欢,麻烦发个链接给我。谢谢。

    1. http://typecho.us/plugins/comments-fancy-captcha.html
      Fancy Captcha

  17. 下载了,但是在调试的时候遇到了一些麻烦,需要你继续知道,麻烦加下我Q406237346

    1. 抱歉`不加生人...你可以在这里留言, 或者去微博私信我. 不好意思哈`

  18. astaxie astaxie

    我在使用你的主题Typecho过程中,装好之后就出现如下错误: PHP Fatal error: Using $this when not in object context in wp-content/themes/trapecho/index.php on line 11" while reading response header from upstream

  19. sadf sadf

    afsafsafsaf

  20. 验证码绕过测试 验证码绕过测试

    测试绕过验证码,博主抱歉了

  21. Bootstrap我经常用来做后台面板...相当舒坦

  22. 我也在用typecho,小巧玲珑,稍微改了以下默认模板,站现在简洁速度也不错,点击我的昵称可以访问。

Add new comment »

Enter your comment here...

captcha
请输入验证码