Hagura 开源项目使用教程
haguraA light weight, minimal Jekyll theme.项目地址:https://gitcode.com/gh_mirrors/ha/hagura
1. 项目的目录结构及介绍
Hagura 是一个基于 Jekyll 的主题,适用于静态网站生成。以下是项目的目录结构及其介绍:
hagura/
├── _includes/ # 包含页面的各个部分,如头部、底部等
├── _layouts/ # 页面布局模板
├── _posts/ # 存放博客文章的目录
├── _sass/ # Sass 样式文件
├── assets/ # 静态资源文件,如图片、CSS、JavaScript 等
├── _config.yml # 项目的配置文件
├── Gemfile # Ruby 依赖管理文件
├── index.html # 首页文件
└── README.md # 项目说明文档
主要目录和文件介绍
_includes/
: 包含页面的各个部分,如头部 (header.html
)、底部 (footer.html
) 等。_layouts/
: 页面布局模板,如默认布局 (default.html
)、文章布局 (post.html
) 等。_posts/
: 存放博客文章的目录,文章文件通常以YYYY-MM-DD-title.md
格式命名。_sass/
: Sass 样式文件,用于定义网站的样式。assets/
: 静态资源文件,如图片 (images/
)、CSS (css/
)、JavaScript (js/
) 等。_config.yml
: 项目的配置文件,包含网站的基本设置和配置。Gemfile
: Ruby 依赖管理文件,定义了项目所需的 Ruby 包。index.html
: 首页文件,网站的入口页面。README.md
: 项目说明文档,包含项目的介绍、使用方法等。
2. 项目的启动文件介绍
Hagura 项目的启动文件主要是 index.html
和 _config.yml
。
index.html
index.html
是网站的首页文件,它定义了网站的入口页面。在这个文件中,你可以看到 Jekyll 的 Front Matter 部分,用于定义页面的变量和布局。
---
layout: default
---
<div class="home">
{% if site.theme_settings.header_text %}
<div class="call-box-top">
{% include search.html %}
<a href="{{ site.theme_settings.facebook_username | prepend: 'https://www.facebook.com/' }}" class="button"><i class="fa fa-facebook"></i> Facebook</a>
<a href="{{ site.theme_settings.twitter_username | prepend: 'https://twitter.com/' }}" class="button"><i class="fa fa-twitter"></i> Twitter</a>
<a href="{{ site.theme_settings.github_username | prepend: 'https://github.com/' }}" class="button"><i class="fa fa-github"></i> GitHub</a>
</div>
{% endif %}
<div class="call-box-bottom">
<a href="{{ site.baseurl }}/about" class="button">About</a>
</div>
</div>
_config.yml
_config.yml
是 Jekyll 项目的配置文件,包含网站的基本设置和配置。以下是一些常见的配置项:
title: Hagura
description: A minimalist Jekyll theme for bloggers
baseurl: "" # the subpath of your site, e.g. /blog
url: "http://example.com" # the base hostname & protocol for your site
theme_settings:
header_text: "Welcome to Hagura"
facebook_username: your-username
twitter_username: your-username
github_username: your-username
3. 项目的配置文件介绍
_config.yml
是 Hagura 项目的配置文件,它包含了网站的基本设置和配置。以下是一些常见的配置项及其介绍:
基本配置
title
: 网站的标题。description
: 网站的描述。baseurl
: 网站的子路径,例如/blog
。url
: 网站的基本主机名和协议,例如http://example.com
。
主题设置
theme_settings
: 主题相关的设置。header_text
: 头部显示
haguraA light weight, minimal Jekyll theme.项目地址:https://gitcode.com/gh_mirrors/ha/hagura