Giter Site home page Giter Site logo

jiejie-coding / hexo-theme-oranges Goto Github PK

View Code? Open in Web Editor NEW

This project forked from zchengsite/hexo-theme-oranges

0.0 0.0 0.0 397 KB

🍊A simple hexo-theme of minimalism

Home Page: https://hexo.theme.oranges.zcheng.site/

License: MIT License

HTML 50.02% CSS 41.33% JavaScript 8.65%

hexo-theme-oranges's Introduction

English | 简体中文

hexo-theme-oranges

A simple hexo theme

demo

Installation

$ git clone https://github.com/zchengsite/hexo-theme-oranges.git themes/oranges

Usage

Edit the theme field in the _config.yml file under the project root:

theme: oranges

configuration

tags page (click to show)

To add tags page:

$ hexo new page tags

Generate tags folder, edit the index.md file, make sure that type field is tags:

---
title: tags
date: 2019-05-03 12:03:35
type: "tags"
---

Enable tags in the theme _config.yml file:

navbar:
  -
    name: tags
    enable: true
    path: /tags/
categories page (click to show)

To add categories page:

$ hexo new page categories

Generate categories folder, edit the index.md file, make sure that type field is categories:

---
title: categories
date: 2019-05-03 12:03:35
type: "categories"
---

Enable categories in the theme _config.yml file:

navbar:
  -
    name: categories
    enable: true
    path: /categories/
friends page (click to show)

To add friends page:

$ hexo new page friends

Generate friends folder, edit the index.md file, make sure that type field is friends:

---
title: friends
date: 2019-05-03 12:03:35
type: "friends"
---

Enable friends in the theme _config.yml file:

navbar:
  -
    name: friends
    enable: true
    path: /friends/
about page (click to show)

To add about page:

$ hexo new page about

Generate about folder, edit the index.md file, make sure that type field is about:

---
title: about
date: 2019-05-03 12:03:35
type: "about"
---

Enable about in the theme _config.yml file:

navbar:
  -
    name: about
    enable: true
    path: /about/
catalog(contents) (click to show)

Enable catalog in the theme _config.yml file:

catalog:
  enable: true
RSS (click to show)

Install the hexo-generator-feed plugin:

$ npm install hexo-generator-feed --save

add or edit configuration in your root _config.yml:

feed:
  type: atom
  path: atom.xml
  limit: 20
  hub:
  content:
  content_limit: 140
  content_limit_delim: ' '
  order_by: -date
  icon: icon.png
  autodiscovery: true
  template:

Display the RSS button on the page(currently only display in footer is supported):

footer:
  social:
    -
      name: rss
      icon: rss
      path: atom.xml
Comments (click to show)

supported:

First, Enable Comments in the theme _config.yml file:

comments:
  enable: true

Then, select a comment system to use, take valine for example:

View the official tutorial to get the appId & appKey:

valine:
  enable: true
  appId: j73OlR7xxxxxPDrO-gzGzoHsz
  appKey: mhyUfuxxxxk41wc25
  placeholder: welcome!
  avatar: retro
Google Analytics (click to show)

First, view Google Analytics to get the gtagkey:

Then, enable gtag in the theme _config.yml file:

gtag:
  enable: true
  gtagkey: UA-xxxxxxx-x
PREV & NEXT (click to show)

enable prevnext in the theme _config.yml file:

prevnext:
  enable: true
lazy image loading (click to show)

Install the hexo-lazyload-image plugin:

$ npm install hexo-lazyload-image --save

add or edit configuration in your root _config.yml:

lazyload:
  enable: true
  onlypost: false # optional
  loadingImg: # optional eg ./images/loading.gif
  isSPA: false # optional

more hexo-lazyload-image

search (click to show)

Install hexo-generator-search plugin:

$ npm install hexo-generator-search --save

add or edit configuration in your root _config.yml:

search:
  path: search.xml
  field: post
  content: true

more hexo-generator-search

edit configuration in the theme _config.yml

  search:
    enable: true
    placeholder: 搜索...
pinned posts (click to show)

Remove default hexo-generator-index and Install the hexo-generator-index-pin-top plugin:

$ npm uninstall hexo-generator-index --save
$ npm install hexo-generator-index-pin-top --save

add or edit configuration in your root _config.yml:

index_generator:
  path: ''
  per_page: 10
  order_by: -date

more hexo-generator-index-pin-top

Add top: true to the top of the post you want

  ---
  title: Hello World
  date: 2020-03-11 14:19:04
  top: true
  tags:
  - Welcome
  categories:
  - [Welcome, 欢迎]
  ---
internationalization (i18n) (click to show)

You can use internationalization to present your site in different languages, add or edit configuration in your root _config.yml:

Some examples:

English:

language: en

Simplified Chinese:

language: zh-CN

Japanese:

language: ja

The default value is en,Optional in the 'languages' file under the theme。

To Do List

  • Custom navigation✔
  • post directories✔
    • the directory follows the article scroll[2020.5.24]
  • Fancybox✔
  • back to top[2020.5.4]
  • RSS Feed[2020.5.7]
  • NEXT & PREV[2020.5.10]
  • H1 - h6 anchor[2020.5.3]
  • comments[2020.5.7]
  • share
  • word count
  • traffic statistics
  • Google Analytics[2020.5.8]
  • post encryption
  • pinned posts[2020.9.1]
  • search[2020.8.23]
  • dark mode
  • smooth scrolling[2020.5.4]
  • theme styles are customizable
  • Internationalization (i18n), multilanguage support[2020.9.10]

End

If you have any questions, please submit the Issue. Fork is welcome.

🍻

License

MIT

hexo-theme-oranges's People

Contributors

zchengsite avatar zexiplus 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.