Typecho仿百度响应式主题Xaink

关于

因为想学习响应式布局练练手,所以萌生了写一个typecho主题的想法,而我正好在使用百度,何不就做个和百度一样的主题

Github:https://github.com/awinds/xaink

说明:https://xiaoa.me/archives/theme_xaink.html

Demo:https://www.xa.ink

screenshot2.png

特点

  • 仿百度。
  • 响应式设计,支持明亮和黑暗模式。
  • 文章列表支持缩略图(字定义thumbnail),右侧悬停。
  • 支持评论表情OwO
  • 文章和页面直接支持点赞和取消,不使用插件。
  • 支持配置作者个人社交账号显示。
  • 支持配置是否显示文章版权信息。
  • 支持归档页面、友链页面(Links插件支持)、时间线页面。

插件配合

  • Links插件,可直接生成友链页面
  • Sitemap插件,可生成网站地图
  • Stat插件,可显示文章浏览人数
  • CodeHighlighter插件,可高亮代码
  • Sticky插件,可置顶文章,需做以下修改配合(使用plugins下面带的插件已修改)
    //增加字段,外面可以自定义判断 
    $sticky_post['istop'] = 1;

安装

直接下载 zip 源码->解压后移动到 Typecho 主题目录->改名为xaink->启用。

设置

主题设置页面位置:Typecho 后台->控制台->外观->设置外观。

技术栈

License

Open sourced under the MIT license.

页脚带上Theme by Xaink,谢谢!

更新说明

1.6.1

  1. 修改配置目录数量的bug

1.6.0

  1. 增加头部Open GraphTwitter Card
  2. og和twitter Mate信息中,如果有缩略图,则使用缩略图作为image信息。
  3. 增加站点favicon图标地址的配置。

1.5.3

  1. 优化文章版权显示效果。
  2. 增加统计代码配置项。

1.5.2

  1. 修正page页面无法生成导读的问题。
  2. 友链的a标签rel=nofollow由插件控制。

1.5.1

  1. 优化正文内容表格中图片过宽问题和超链接问题。
  2. 优化评论回复和取消回复点击问题。
  3. 优化版权链接换行问题。

1.5.0

  1. 修改代码过长没自动换行的问题。
  2. 如果使用高亮插件,要解决换行问题,要改插件中样式pre[class*="language-"]white-space值为pre-wrap
  3. 修正暗样式问题。

1.4.9

  1. 增加友链的页面插件下载地址。
  2. 打包配套插件到github,目录plugins,可选择使用。

1.4.8

  1. 分类目录显示控制数量,增加更多下拉显示一级目录。
  2. 控制台->外观->设置外观->目录显示的分类数。
  3. 优化文章导读的高亮显示颜色。
  4. 优化评论提示显示效果。

1.4.7

  1. 分类目录增加自定义设置icon显示(svg)。
  2. 控制台->外观->设置外观->分类对应图标SVG。

1.4.6

  1. 评论表情使用Emoji问题修复(在非utf8mb4下不使用Emoji)。
  2. 修改小设备上按钮显示问题。
  3. 调整手机设备上回复评论显示效果。

1.4.5

  1. 替换icons的<i>直接使用svg,省掉字体的加载。

1.4.4

  1. 修改网站描述写太长,头像变形问题。
  2. 修改php8环境下,搜索界面500错误的bug。
  3. 修改文章中标签支持换行显示。

1.4.3

  1. 优化tabler字体预加载,用户信息图标直接使用svg。

1.4.2

  1. 优化评论锚点和图片懒加载。

1.4.1

  1. 优化评论显示效果。

1.4

  1. 文章和页面右侧减少了一栏目,增加了文章导读和相关推荐。
  2. 修复了首次点赞时不成功的问题。

1.3

  1. 修复QQ头像显示问题。
  2. 修改个人区域签名和简介显示问题。

1.2.1

  1. 修复移动浏览器上左侧菜单无法滚动的问题。

1.2

  1. 修改归档页面按年显示统计,不再显示文章,只显示按年再按月统计。
  2. 增加时间线页面,按年显示文章,当年显示,其它折叠。
  3. 修复一些小问题。

1.1

  1. 修改在响应式移动适配时的问题。
  2. 修改右侧栏标题和评论过长没有换行的问题。
  3. 增加了文章和页面新增和编辑直接支持缩略图和来源页的字段。
  4. 增加了可配置列表分类,类似专题或小说,菜单子分类不下拉,点击进去直接显示子分类的列表(专题名),再点子分类(专题名)进去直接显示标题目录(专题目录),可去看demo小说分类,不配置不影响正常使用。
  5. 修改了分页显示的一些问题。

1.0

  1. 手搓typecho主题
  2. CSS写的有问题,没有规划好,写到哪改到哪,没有做过明亮黑暗CSS,后续有时间再优化。
版权属于: 小A 本文链接: https://xiaoa.me/archives/theme_xaink.html 转载申明: 转载请保留本文转载地址,著作权归作者所有。

评论 52

  1. https://ziyege.rf.gd/
    https://ziyege.rf.gd/

    这个设置功能 还是少了,,还有,我调了这个显示8个,怎么还是6个,,,,目录显示的分类数(包括首页),超过使用更多下拉,更多只显示一级分类

    4 天前 - 中国陕西省宝鸡市联通
    1. 小A
      @https://ziyege.rf.gd/

      目录显示分类数量问题已修改。
      如果还有别的设置功能需求可以反馈

      4 天前 - 中国广东省深圳市电信
      1. https://ziyege.rf.gd/
        https://ziyege.rf.gd/
        @小A

        建议建立个QQ群,大家去交流使用问题

        4 天前 - 中国陕西省宝鸡市联通
      2. https://ziyege.rf.gd/
        https://ziyege.rf.gd/
        @小A

        是需要覆盖安装吗,,,可以参考一下BearSimple的后设置,不过它这个主题没有你的简洁,

        4 天前 - 中国陕西省宝鸡市联通
        1. 小A
          @https://ziyege.rf.gd/

          github拉取main分支覆盖安装即可。

          4 天前 - 中国广东省深圳市电信
  2. 小赵

    你好,大佬,现在遇到个问题需要求救...

    我今天测试用mweb pro这个上面的api发布文章,然后遇到个问题,就是在系统后台手工发布的文章,和api发布的文章,在首页的排序是分开的,首页现在是将后台的从最新排到最旧显示完之后,再将api发布的从最新排到最旧,目前是这样一个现状,我希望的是不管哪里发布的,都应该是从最新展示到最旧,但我不知道从哪里解决问题,如果大会看到,有空请帮忙告之一下,谢谢!!!
    20 天前 - 中国湖南省长沙市电信
    1. 小A
      @小赵

      具体去看看api发布的文章的发布日期是不是正确的

      17 天前 - 中国广东省深圳市电信
      1. 小赵
        @小A

        上面 12:23 和 11:58 的是系统后台发布的,下面三个是api 发布的,我这边测试到的效果就是,首页的排序逻辑是先将后台发布的遍历展示完,然后才会展示api 发布的,我用的是 mweb pro 发布,辛苦大佬有空检查一下看是哪里问题?谢谢!已经发了截图到邮箱~~

        12 天前 - 中国湖南省长沙市电信
        1. 小A
          @小赵

          文章的排序使用的是typecho自带的排序,主题并没有修改排序,另外,我在typecho的issues中发现了同样的问题,你可以参考一下:https://github.com/typecho/typecho/issues/915

          10 天前 - 中国广东省深圳市电信
          1. 小赵
            @小A

            确实是这个位置的问题,也按照方法二进行修改,问题已经解决~~感谢大佬!ヾ(≧∇≦*)ゝ

            10 天前 - 中国湖南省长沙市电信
  3. TommyNoigh
    TommyNoigh

    hi

    21 天前 - 俄罗斯
  4. 索玛

    真不错的主题👍👍

    04-13 - 中国广东省东莞市联通
    1. 小A
      @索玛

      感谢!🌝

      04-13 - 中国广东省深圳市电信
  5. 小赵

    大佬,今天我的logo突然不显示了,未做任何改动,网络也正常,请问这个怎么检查问题?

    04-08 - 中国湖南省娄底市电信
    1. 小A
      @小赵

      F12看下你的logo的地址正不正确,复制出来单独打开看能不能显示,如果是引用的别的地方的,有可能存在不能引用显示,最好是存在自己网站里面

      04-08 - 中国广东省深圳市电信
      1. 小赵
        @小A

        找到原因了,谢谢大佬 ,是我在设置外观的时候,浏览器自动填充,把住宅地址填到了logo一栏。。。。φ( ̄∇ ̄o)

        04-09 - 中国湖南省娄底市电信
        1. 小A
          @小赵

          解决了就好!😀

          04-09 - 中国广东省深圳市电信
  6. 网盘资源局

    为什么网站做这么久了,文章也都是原创的。百度就是不收录呢。这是程序的问题吗?我site好几个Typecho的博客站都是一样。你这个只有3个收录。其他两个站收录也是个位数。
    我还想用这个程序也做个博客呢!

    02-26 - 中国广东省佛山市电信
    1. 小A
      @网盘资源局

      你可以使用百度收录插件试试

      02-26 - 中国广东省深圳市电信
  7. 爱情塔罗

    这个主题是仿百度搜索吗?看着真赞!

    02-24 - 中国移动
    1. 小A
      @爱情塔罗

      是的,感谢!

      02-24 - 中国广东省深圳市电信
  8. 3321.net
    3321.net

    博主好,我使用了您的主题,但是首页文章只显示5个,这个在哪可以修改么,感谢

    01-24 - 中国江苏省南京市联通
    1. 小A
      @3321.net

      每页显示数量是在后台的设置-阅读,和主题无关

      01-24 - 中国湖南省移动
      1. 3321.net
        3321.net
        @小A

        哈哈,改好了,我一直以为这个是在模版修改呢,感谢!

        01-24 - 中国江苏省南京市联通
  9. 夜雨

    不错啊,请问有WP版本吗?

    2024-12-20 - 中国广东省江门市移动
    1. 小A
      @夜雨

      没有WP版本👻

      2024-12-21 - 中国广东省深圳市电信
  10. Jdeal

    好有趣,哈哈,不错不错~

    2024-11-27 - 中国江苏省无锡市电信
  11. 蜡客小生

    😀又成熟了一个版本。

    2024-11-23 - 中国广西玉林市移动
  12. 王航
    王航

    有点意思,进来突然懵了一下😂 好看

    2024-11-22 - 中国广东省广州市电信
  13. 蜡客小生

    😊😊我这边更新好啦。嘿嘿

    2024-10-08 - 中国广西玉林市移动
  14. router

    感谢分享!

    2024-10-07 - 中国香港电讯盈科有限公司
  15. 宝宝起名

    博主网站用的哪个程序啊,太喜欢了!

    2024-08-28 - 中国移动
    1. 小A
      @宝宝起名

      typecho

      2024-08-28 - 中国广东省深圳市电信
  16. 蜡客小生

    加载资源有点卡噢。。尽量资源本地化哇。。

    2024-08-27 - 中国广西桂林市移动
    1. 小A
      @蜡客小生

      icon要加载字体有点慢,实际上也没用多少icon,可以考虑直接使用svg,不再引用更多的字体。

      2024-08-27 - 中国广东省深圳市电信
      1. 蜡客小生
        @小A

        ╮(╯▽╰)╭ 每次浏览网站和切换浏览器标签都要“顿”一下,难受ING。。。

        2024-08-27 - 中国广西桂林市移动
        1. 小A
          @蜡客小生

          升级了,升级到1.4.5直接去掉了icons使用,不用下载字体,等待图标加载。

          2024-08-28 - 中国广东省深圳市电信
          1. 蜡客小生
            @小A

            😀没想到是utf8mb4引起的问题。一般用TYPECHO前期都会把UTF8改utf8mb4的说。

            2024-08-30 - 中国广西桂林市移动
          2. 小A
            @小A

            😊可以emoji了!

            2024-08-30 - 中国广东省深圳市电信
  17. 肖寒武

    被高仿百度吓到,提个建议,文章页面可以仿百度知道的样式,更吓人。

    2024-04-25 - 美国Akamai科技公司CDN网络节点
    1. 小A
      @肖寒武

      文章页面都自己编辑的,不太好控制,慢慢来,有空再更新

      2024-04-25 - 中国广东省深圳市电信
  18. 随风落叶

    很棒,支持支持

    2024-04-23 - 中国山东省临沂市联通
  19. 湘铭呀!

    2024-04-23 - 加拿大
  20. 蜡客小生

    哎呀。不错哇。威武!必须支持!

    2024-04-22 - 中国广西桂林市移动
    1. 小A
      @蜡客小生

      欢迎试用发现问题

      2024-04-22 - 中国广东省深圳市电信
  21. 泽泽

    这个有意思,收藏了改天汇总到我主题站

    2024-04-22 - 中国辽宁省本溪市电信
    1. 小A
      @泽泽

      感谢,彩蛋插件也收藏了

      2024-04-22 - 中国广东省深圳市电信
  22. 永恒末匕

    我来学习啦,Demo好像看不了

    2024-04-22 - 中国广西南宁市移动
    1. 小A
      @永恒末匕

      可以用啊,我刚试了可以打开

      2024-04-22 - 中国广东省深圳市电信
  23. 刘郎

    早啊

    2024-04-22 - 中国贵州省黔南州惠水县移动
没有更多啦