Skip to content

Latest commit

 

History

History
136 lines (88 loc) · 4.25 KB

README.md

File metadata and controls

136 lines (88 loc) · 4.25 KB

Uç! Uç!

Welcome to the source repository of Uç! Uç! website.

Installation

Make sure you have these installed in your system:

Download the project by running this command:

# Clone the repo
git clone [email protected]:uc-uc/uc-uc.github.io.git

# Navigate to project directory
cd uc-uc.github.io

# Install project dependencies
npm install 

Start live preview:

npm start

Then open http://localhost:3000 in your browser.

Preview will automatically update itself as you make changes.

Making changes

Content

Everything content-related resides inside content folder.

Writ-CMS works in a simple way:

  • Text files inside content become posts,
  • Text files inside content/pages become subpages,
  • A text file named index or homepage inside content becomes the homepage,
  • Folders inside content become categories,
  • In content or in a category, a folder containing a post.md becomes a foldered post.
  • In pages, a folder containing a page.md becomes a foldered subpage.
  • Posts inside categories become categorized posts.
  • Any other files are registered as local assets to their closest parent entry (e.g. a post)

Sub-categories are currently not supported.

Text files

Text files can be written in HTML, markdown or plain text. You can use handlebars expressions.

Accepted file extensions: .md, .markdown, .txt, .html, .hbs, .handlebars

Regardless of the format, text files may contain a front-matter section in the beginning like this:

---
tags: web, hello world
---
Content comes here

More details can be found here: https://github.com/scriptype/writ-cms?tab=readme-ov-file#manual

Theme

Everything theme-related resides inside theme folder.

Making quick changes

You can quickly make changes to the theme using script.js, style.css and theme-settings.css.

scripts.js and style.css recognize theme/assets/custom as the current directory.

Let's say you want to have a colors.css and import it into style.css:

  • Put colors.css into theme/assets/custom
  • Import it in style.css with: @import url('./colors.css');

Full editing

You can change how everything looks and behaves by making changes in theme/templates folder.

All templates are rendered using Handlebars.

  • templates/base handles the lower-level html organization
  • templates/components and templates/layouts contain some reusable templates
  • templates/features is automatically generated based on your settings, but your edits are preserved.
  • templates/pages contains the templates for each page type.
  • templates/helpers.js contains Handlebars helpers.

After making changes to the Handlebars helpers, you need to restart the watcher. By default, all posts will have 'text' type.

Adding new post types

templates/pages/post has a few subfolders, corresponding to different post types. By adding another, you simply introduce a new post type.

You can set a post's type by adding type: nameOfTheType in its front-matter.

Configuration

Writ-CMS is configured in the settings.json and extended programmatically inside _scripts.

_scripts folder is used by npm scripts. Here _scripts/writ.js extends the writ-cms by using a hook for customizing the content model.

Releasing changes to website

  • Stop the preview
  • Build final output: npm run build
  • Commit and push changes using git

The website is served from the docs folder, where the final output be built to.