Giter Site home page Giter Site logo

panshangzhidi / hexo-theme-material-x Goto Github PK

View Code? Open in Web Editor NEW

This project forked from volantis-x/hexo-theme-volantis

0.0 0.0 0.0 3.21 MB

一个简约的卡片式Hexo博客主题。文档:https://xaoxuu.com/wiki/material-x/

License: MIT License

HTML 18.20% JavaScript 49.41% CSS 32.39%

hexo-theme-material-x's Introduction

Material X

一个简约的卡片式Hexo博客主题。

完全自由的模块化、易于定制化设计

  • 可以自由决定每个页面是否需要封面、封面是否需要背景图片、多少图片、是否需要轮播、速度如何。
  • 可以自由决定每个页面是否需要侧边栏、侧边栏小部件显示什么卡片、顺序如何。
  • 可以自由决定每个页面的主体结构(默认文章+评论),可以按需增加卡片(与侧边栏小部件共用卡片库)。
  • 可以自由决定每篇文章的meta标签(日期、更新日期、分类、标签、分享、阅读统计、置顶)显示与否、放置在文章开头还是末尾。标题、缩略图、小图标(用于归档页面)、页面专属的音乐播放器也算做meta标签,但是它们的位置固定。
  • 大部分按钮可以自由设置图标、文字、target、nofollow等
  • 方便更换主题色、自定义字体、边距、圆角、阴影等视觉效果,快速实现暗色主题。

易于扩展

  • 使用 import 字段方便导入css和js到主题中。

移动端优化

  • 针对移动端布局进行了大量优化。

更多功能的支持

  • 支持4种评论系统:Disqus、Gitalk、来必力和Valine评论。
  • 提供主题CDN,也可自定义CDN。
  • 使用卡片设计元素以及交互动效。
  • 使用 fontawesome 5.6.3 免费版图标。
  • 支持APlayer播放器,可以播放网易云、QQ音乐、虾米、酷狗平台以及其它服务器的音乐。
  • 支持不蒜子阅读统计、百度分析、Google分析。
  • 支持渲染MathJax数学公式,优化了渲染效果。

博客示例

博客 源码 说明
@mxclub https://github.com/xaoxuu/blog-example master分支默认效果
@xaoxuu 暂未开源 myblog分支效果

下载安装

A. 使用脚本全自动安装(目前仅支持macOS)

  1. 打开终端输入下面命令安装脚本,脚本文档见#hexo.sh
curl -s https://xaoxuu.com/install | sh -s hexo.sh
  1. 安装成功后,在你的博客路径打开终端,输入下面命令即可安装主题和依赖包。
hexo.sh i x

B. 手动安装

  1. 下载主题到 themes/ 文件夹
git clone https://github.com/xaoxuu/hexo-theme-material-x themes/material-x
  1. 然后安装必要的依赖包
npm i -S hexo-generator-search hexo-generator-json-content hexo-renderer-less

文档

https://xaoxuu.com/wiki/material-x/

hexo-theme-material-x's People

Contributors

xaoxuu avatar crainyday avatar zhaohaihao avatar ic3evi1 avatar phikn1ght avatar lunhui1994 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.