Skip to content

michimani/simplog

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

simplog

FOSSA Status

simplog is a simple blog theme for Hugo.

screenshot-default

Demo site is here.

Features

  • Google Analytics
  • Disqus
  • Some theme colors
  • Responsive
  • Custom CSS
  • Adobe Fonts
  • Lazy load image
  • Support tags, categories and archives page
  • Show related tags and categories posts

Installation

git submodule add https://github.com/michimani/simplog.git ./themes/simplog

Updating

git submodule update --remote --merge

Detail of features

Google Analytics

You can insert the Google Analytics tracking code into top of head tag. If you insert the tag, set tracking ID at config.toml.

googleAnalytics = "<your tracking ID>"

Disqus

You can set the comment form via Disqus. If you set the comment form, set disqus short name at config.toml.

googleAnalytics = "<your disqus short name>"

And if you enable comment form, set true at config.toml and each post file.

  • config.toml

    [params]
        [params.enabled]
            comment = true
  • each post file

    +++
    # some
    # settings
    # of
    # post
    comments = true
    +++

The comment form will be enabled when both of them are true.

Custom CSS

If you want to use your own CSS, set value that is path to your CSS file at config.toml

[params]
  customCSS = ""

Adobe Fonts

If you use Adobe Fonts in your site, set value that is Adobe Fonts Kit ID at config.toml. In this case you will need to set custom css as well.

[params]
  adobeFontsKitId = "<your adobe fonts kit ID>"

Some theme colors

You can change theme color easily. Set the value one of default, dark, red, green and blue at config.toml.

[params]
  colorTheme = "default"
  • Dark

    screenshot-dark

  • Red/Green/Blue

    screenshot-red screenshot-green screenshot-blue

Lazy load image

You can easily set up an image tag for lazy loading by using the shortcode below.

{{< lazy src="image-file-name.jpg" alt="attribute for this image" >}}

In the above case, the image files under the images directory will be displayed. (e.g. /images/image-file-name.jpg)

If you want to specify another path or a path with a different domain, write the full path to the image file and add abs =" y ".

{{< lazy src="https://michimani.github.io/simplog/images/featured_image.jpg" alt="attribute for this image" abs="y" >}}

Mermaid

You can use the mermaid language in Markdown code blocks.

```mermaid
sequenceDiagram
    participant Alice
    participant Bob
    Alice->>John: Hello John, how are you?
    loop Healthcheck
        John->John: Fight against hypochondria
    end
    Note right of John: Rational thoughts <br/>prevail...
    John-->Alice: Great!
    John->Bob: How about you?
    Bob-->John: Jolly good!
``

Developmet

Install nodenv and install node 15.x

brew install nodenv
nodenv install 15.14.0

Install the node module for development such as CSS generation.

npm install

Generate CSS from SCSS

To generate CSS from SCSS, run the following command.

npm run css:scss

If you want to monitor SCSS changes, run the following command.

npm run watch:scss

License

FOSSA Status

About

SimpLog is a simple blog theme for Hugo.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published