Coder Social home page Coder Social logo

beautifulhugo's Introduction

Beautiful Hugo - A port of Beautiful Jekyll Theme

Beautiful Hugo Theme Screenshot

Why fork from the original repo?

The original repo is great but it doesn't suit for the Chinese language and China users because of some well known reasons.

There are some additional features beside of the original Beautiful-hugo theme:

  • Support Chinese word count
  • Mobile devices adaptive
  • Use Baidu Analysis(百度统计)
  • Use prism for syntax highlighting
  • Use algolia for searching
  • livere(来必力) 评论插件

Installation

$ mkdir themes
$ cd themes
$ git clone https://github.com/rootsongjc/beautifulhugo.git beautifulhugo

See the Hugo documentation for more information.

Usage

Let me show you how to add and debug a new post and push it to Github pages and building a new searching index.

1. Add a new post

Use this command to create a new post:

hugo add posts/new.md

After the new post created, it is located at ./content/posts/new.md.

2. Post head matters

Classic example:

date: "2017-06-01T20:18:57+08:00"
draft: false
title: "微服务管理框架service mesh——istio安装笔记"
subtitle: "手把手教你安装Istio service mesh"
categories: "cloud-native"
tags: ["kubernetes","istio","service-mesh"]
description: "对文章的简要描述 SEO used for description"
bigimg: [{src: "https://res.cloudinary.com/jimmysong/image/upload/images/2017052801.jpg", desc: "Beijing China|May 28,2017"}]
nocomment: true
postmeta: false
notoc: ture

bigimg:an array, you can specify multiple images in map lists.

postmeta:whether show the post meta data below a post title/subtitle

nocomment: whether show the comment box

notoc: enable the TOC for single blog

3. Preview and debug

Execute this command the build a preview:

hugo server

Visit http://localhost:1313 for the website preview.

4. Update algolia index

Execute this command to build a new algolia index at the project's base path:

hugo-alogolia
grep -v '"content":' algolia.json>rootsongjc-hugo.json
rm -f algolia.json

As the new post created there should be a new record added to this file public/rootongjc-hugo.json.

Acknowledgements


Extra Features

Responsive

This theme is designed to look great on both large-screen and small-screen (mobile) devices.

Syntax highlighting

This theme has support for both server side and client side highlighting.

Server side syntax highlighting

Use the highlight shortcode (with Pygments), see the Hugo documentation for more information.

To use this feature install Pygments (pip install Pygments) and add pygmentsuseclasses = true to your config.toml.

Client side syntax highlighting

Use triple backticks ( ``` ) or triple tilde ( ~~~ ) around code blocks.

Client side highlighting does not require pygments to be installed.

Disqus support

To use this feature, uncomment and fill out the disqusShortname parameter in config.toml.

Google Analytics

To add Google Analytics, simply sign up to Google Analytics to obtain your Google Tracking ID, and add this tracking ID to the googleAnalytics parameter in config.toml.

Commit SHA on the footer

If the source of your site is in a Git repo, the SHA corresponding to the commit the site is built from can be shown on the footer. To do so, two environment variables have to be set (GIT_COMMIT_SHA and GIT_COMMIT_SHA_SHORT) and parameter commit has to be defined in the config file:

[Params]
  commit = "https://github.com/<username>/<siterepo>/tree/"

This can be achieved by running the next command prior to calling Hugo:

  GIT_COMMIT_SHA=`git rev-parse --verify HEAD` GIT_COMMIT_SHA_SHORT=`git rev-parse --short HEAD`

See at xor-gate/xor-gate.org an example of how to add it to a continuous integration system.

About

This is a port of the Jekyll theme Beautiful Jekyll by Dean Attali. It supports most of the features of the original theme.

License

MIT Licensed, see LICENSE.

beautifulhugo's People

Contributors

halogenica avatar rootsongjc avatar rayjolt avatar royalbeff avatar esaezgil avatar sjp38 avatar haidelber avatar liwenyip avatar oshliaer avatar cite avatar tomhoover avatar ykfq avatar lzjluzijie avatar axilleas avatar rawkode avatar xor-gate avatar hukacode avatar supersam654 avatar astonbitecode avatar ginuerzh avatar stevenshchin avatar chalvern avatar

Watchers

James Cloos avatar  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.