Using the theme

November 08, 2021 Documentation

#usage #installation #documentation #meta

content-theme-blog-minimal is a standalone theme for creating your blog within minutes!

Feature overview
Usage
Future plans

Feature overview

Write your content in markdown with full access to TailwindCSS utilities for styling.
Categories & tags
Syntax highlighting with 30+ themes to chose from
Light and dark mode
Sitemap
Cloudflare analytics support
Gallery component for rendering image grids in markdown
Out of the box continuous deployment for GitHub pages

Usage

Setup

Clone this repository.
Run yarn install.
1. Don't have node installed?
2. Install nvm.
3. Install node using nvm. (The theme was created and tested on node 12.)
4. npm install -g yarn
5. Now you should be all set to run yarn install.

Writing and customization

Modify the default config in blog.config.js.
Run yarn start to start the development server.
Start writing by adding markdown files in /content/posts and update /content/about.md.

For more configuration options, check out Markdown and theme configuration.

Deploy

Make sure there are no errors by running yarn lint. Run yarn lint --fix to fix the auto-fixable ones.
Make sure productionPublicPath in blog.config.js is set correctly.
If you're deploying to GitHub pages, push your changes to master and that's it.
For deploying to other services, modify the Deploy step in deploy.yml and then push to master.

Markdown and theme configuration

blog.config.js

All the high level customizations should be done using this file. Documentation for individual attributes is provided in blog.config.js.

Frontmatter

Frontmatter block should be added at the very top of the markdown files.

All fields are optional. If none of the posts have category or tags set then those links will be hidden from the navbar respectively.

Attribute	Type	Description
`title`	string	Title of the post. Defaults to the path.
`description`	string	Description for the post. This is used on listing page and for meta:description.
`createdAt`	string	Post creation datetime. Defaults to the datetime when the file was created.
`category`	string	Category under which the post should be grouped into.
`tags`	array	Tags for the post.

Example

---
title: "First post"
createdAt: "2018-12-31"
category: "Web Development"
tags: ["javascript", "vue", "html"]
---

Images and other static content

Images should be put under static/images. They can then be linked using this syntax ![Alt text](images/name.png) or img tags.

Other static content can be put under static/ as well. Each file inside this directory is mapped to /.

Custom components

The theme comes with these custom components that can be used inside markdown files just like HTML tags.

social - By default, this is shown on the footer when social links are present. Use <social></social> to add that section in other places like about.md.

gallery and gallery-item - A basic set of components for showcasing images. Check out the contents directory to see them in action.

For more details, check out https://content.nuxtjs.org/writing.

Getting new features

git remote add upstream https://github.com/dumptyd/content-theme-blog-minimal.git
git fetch upstream master
git checkout master
git rebase upstream/master

content-theme-blog-minimal