Jekyll 模板项目教程

随笔3个月前发布 宁静学远
46 0 0

Jekyll 模板项目教程

edition-jekyll-template:books: Product documentation template for Jekyll项目地址:https://gitcode.com/gh_mirrors/ed/edition-jekyll-template

1. 项目的目录结构及介绍

  1. .

  2. ├── _config.yml

  3. ├── _data

  4. │ └── navigation.yml

  5. ├── _includes

  6. │ ├── footer.html

  7. │ ├── head.html

  8. │ ├── header.html

  9. │ ├── hero.html

  10. │ ├── page_blocks.html

  11. │ └── scripts.html

  12. ├── _layouts

  13. │ ├── default.html

  14. │ ├── page.html

  15. │ └── post.html

  16. ├── _posts

  17. │ └── 2023-01-01-welcome-to-jekyll.markdown

  18. ├── _sass

  19. │ ├── _base.scss

  20. │ ├── _layout.scss

  21. │ └── _syntax-highlighting.scss

  22. ├── assets

  23. │ ├── css

  24. │ │ └── main.scss

  25. │ ├── images

  26. │ └── js

  27. │ └── main.js

  28. ├── about.md

  29. ├── index.html

  30. └── search.json

目录结构介绍

  • _config.yml: 项目的配置文件。
  • _data: 存储数据文件,如 navigation.yml 用于导航菜单。
  • _includes: 包含可重用的 HTML 片段,如页眉、页脚等。
  • _layouts: 定义页面的布局模板。
  • _posts: 存储博客文章。
  • _sass: 包含 SASS 文件,用于生成 CSS。
  • assets: 存储静态资源,如 CSS、JavaScript 和图片。
  • about.md: 关于页面。
  • index.html: 首页。
  • search.json: 用于搜索功能的 JSON 文件。

2. 项目的启动文件介绍

项目的启动文件是 index.html,它是网站的首页。这个文件通常包含了网站的基本结构和内容。在 Jekyll 项目中,index.html 会使用 _layouts 目录下的布局文件来渲染页面。

  1. ---

  2. layout: default

  3. ---

  4. <header>

  5. {% include header.html %}

  6. </header>

  7. <main>

  8. {{ content }}

  9. </main>

  10. <footer>

  11. {% include footer.html %}

  12. </footer>

3. 项目的配置文件介绍

项目的配置文件是 _config.yml,它包含了 Jekyll 项目的所有配置选项。以下是一些常见的配置项:

  1. title: 我的 Jekyll 网站

  2. email: example@example.com

  3. description: >-

  4. 这是一个使用 Jekyll 构建的示例网站。

  5. baseurl: "" # 网站的子路径,如 "/blog"

  6. url: "http://example.com" # 网站的完整 URL

  7. twitter_username: jekyllrb

  8. github_username: jekyll

  9. # 构建设置

  10. markdown: kramdown

  11. theme: minima

  12. plugins:

  13. - jekyll-feed

配置文件介绍

  • title: 网站的标题。
  • email: 联系邮箱。
  • description: 网站的描述。
  • baseurl: 网站的子路径。
  • url: 网站的完整 URL。
  • twitter_username: Twitter 用户名。
  • github_username: GitHub 用户名。
  • markdown: 使用的 Markdown 处理器。
  • theme: 使用的主题。
  • plugins: 启用的插件列表。

通过这些配置,可以自定义网站的外观和行为。

edition-jekyll-template:books: Product documentation template for Jekyll项目地址:https://gitcode.com/gh_mirrors/ed/edition-jekyll-template

© 版权声明

相关文章

暂无评论

您必须登录才能参与评论!
立即登录
暂无评论...