GithubHelp home page GithubHelp logo

makesmallprogresseveryday / hugo-theme-meme Goto Github PK

View Code? Open in Web Editor NEW

This project forked from reuixiy/hugo-theme-meme

0.0 0.0 0.0 9.37 MB

You can’t spell aWEsoME without MEME! 😝

Home Page: https://io-oi.me/tech/documentation-of-hugo-theme-meme

License: MIT License

JavaScript 13.16% HTML 55.77% SCSS 31.07%

hugo-theme-meme's Introduction

English | 简体中文 | 繁體中文

MemE

Description

MemE is a powerful and highly customizable GoHugo theme for personal blogs. MemE focuses on elegance, simplicity, modernity, and code correctness. Also, I hope you would enjoy MemE like a meme and share MemE like a meme! Just like what your blog and articles do! 😝

Preview

tn.png

Browser support

MemE uses CSS variables and let statements extensively. These features are supported by the following browsers:

  • Chrome 49+
  • Firefox 44+
  • Edge 15+
  • Opera 36+
  • Safari 10+

Internet Explorer does not support CSS variables.

Quick Start

https://gohugo.io/getting-started/quick-start/

Install Hugo (extended version)

For Arch Linux users:

~ $ sudo pacman -S hugo
~ $ hugo new site blog

For users of other systems, see: https://gohugo.io/getting-started/installing/

Install MemE

~ $ cd blog
~/blog $ git init
~/blog $ git submodule add --depth 1 https://github.com/reuixiy/hugo-theme-meme.git themes/meme

Blogging

  1. Replace config.toml with config examples.

    ~/blog $ rm config.toml && cp themes/meme/config-examples/en/config.toml config.toml
  2. Create a new post and the about page:

    ~/blog $ hugo new "posts/hello-world.md"
    ~/blog $ hugo new "about/_index.md"
  3. Now:

    ~/blog $ hugo server -D

Customize MemE

MemE uses SCSS via Hugo Pipes to generate CSS instead of static CSS file and provides a _custom.scss for customization.

Just create a ~/blog/assets/scss/custom/_custom.scss and add your own styles into this file. Your _custom.scss will override ~/blog/themes/meme/assets/scss/custom/_custom.scss and your custom CSS will be applied correctly.

Actually, you can override any template of theme in Hugo, see this unofficial mirror page: https://gohugobrasil.netlify.com/themes/customizing/

Update MemE

~/blog $ git submodule update --rebase --remote

If failed, try:

  1. Delete meme folder, e.g.

    ~/blog $ rm -rf themes/meme
  2. Clone MemE again

    ~/blog $ git clone --depth 1 https://github.com/reuixiy/hugo-theme-meme.git themes/meme

Note that MemE makes some brand new features or breaking changes sometimes, so please be sure to check the modification history of config.toml and update the related items after the update!

Awesome MemE

See #2.

Supported Front Matter

Click to expand!
Name Description Notes
title * string
linkTitle * string
subtitle displayed below the title string, Markdown supported
date * string
lastmod * string
publishDate * string
expiryDate * string
<taxonomies> eg: categories, tags, series * array
description * string, Markdown supported
summary * string, Markdown supported
images * array
slug * string
url * string
draft * boolean
isCJKLanguage * boolean
weight * integer
type * string, if equal to "poetry", will use a special layout for it
layout * string
outputs * array
aliases * array
markup * string
meta set false to disable post-meta boolean
toc display TOC boolean, override enableTOC in config.toml
tocNum display TOC number boolean, override displayTOCNum in config.toml
anchor enable headings anchor boolean, override enableHeadingsAnchor in config.toml
displayCopyright display post-copyright boolean, override displayPostCopyright in config.toml
badge display updated-badge boolean, override displayUpdatedBadge in config.toml
gitinfo display post-gitinfo boolean, override displayPostGitInfo in config.toml
share display post-share boolean, override displayPostShare in config.toml
related display related-posts boolean, override displayRelatedPosts in config.toml
katex add KaTeX support boolean, override enableKaTeX in config.toml
mathjax add MathJax support boolean, override enableMathJax in config.toml
mermaid add Mermaid support boolean, override enableMermaid in config.toml
comments set false to disable comments in mainSections or set true to enable comments in non-mainSections boolean
smallCaps small caps? boolean, override enableSmallCaps in config.toml
dropCap drop cap? boolean, override enableDropCap in config.toml
dropCapAfterHr drop cap after every horizontal rule tag? boolean, override enableDropCapAfterHr in config.toml
deleteHrBeforeDropCap delete horizontal rule tag before drop cap? boolean, override deleteHrBeforeDropCap in config.toml
indent indent instead of margin? boolean, override paragraphStyle in config.toml
indentFirstParagraph indent the first paragraph? boolean, override indentFirstParagraph in config.toml
align normal, justify, center string, if equal to "normal", will override enableJustify in config.toml
original original? You can add the following 8 terms if you set false. The author is required, other optional boolean, override original in config.toml
author author of original post string
link link of original post string, URL
copyright license of the post string, Markdown supported
website author’s website string
email author’s email string
motto author’s description string
avatar author’s avatar string, URL
twitter author’s twitter id string
disqus_url * string, if not set, will use Permalink as default
disqus_identifier * string, if not set, will use RelPermalink as default
disqus_title * string, if not set, will use Title as default

*: see https://gohugo.io/content-management/front-matter/
and https://gohugo.io/templates/internal/#configure-disqus

hugo-theme-meme's People

Contributors

blleng avatar coelacanthushex avatar curtaintears avatar glamcoder avatar grizz-pl avatar h1z3y3 avatar hucste avatar ichenh avatar jianse avatar kunoisayami avatar makisevon avatar muratagawa avatar nagyv avatar nu50218 avatar palant avatar reuixiy avatar rochefort avatar rxrw avatar sleepdevil avatar syralist avatar yusbk avatar zjc17 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.