3.添加页面

Answers to frequently asked questions.

自定义主页,添加博客文章,并添加文档页面。

自定义主页

在代码编辑器中打开。./layouts/index.html

区域

主页由三个部分组成: image 在:index.html

{{ define "main" }}
..
{{ end }}

{{ define "sidebar-prefooter" }}
.. 
{{ end }} 

{{ define "sidebar-footer" }} 
.. 
{{ end }}

每个部分,您可以自定义布局

  1. (可选)添加元素
  2. 添加容器
  3. 添加网格

组件

在网格中,可以使用按钮窗体卡片等组件。有关所有可用组件,请参阅引导程序文档。 示例

{{ define "sidebar-prefooter" }}
<section class="section section-sm"> 
 <div class="container">
  <div class="row justify-content-center text-center mt-lg-3">
    <div class="col-lg-5"> 
    <h2 class="h4">Full text search</h2> 
    <p>Search your Doks site with FlexSearch. Easily customize index settings and search options to your liking.</p>
     </div> 
   <div class="col-lg-5">
    <h2 class="h4">Page layouts</h2>
    <p>Build pages with a landing page, blog, or documentation layout. Add custom sections and components to suit your needs.</p> 
    </div> 
    <div class="col-lg-5"> 
     <h2 class="h4">Dark mode</h2> 
     <p>Switch to a low-light UI with the click of a button. Change colors with variables to match your branding.</p> 
    </div>
   </div>
 </div>
</section>
{{ end }}

添加博客文章

使用该命令添加博客文章。npm run create

示例

npm run create blog/say-hello-to-doks/index.md

index. md

--- 
title: "Say hello to Doks 👋"
description: "Introducing Doks, a Hugo theme helping you build modern documentation websites that are secure, fast, and SEO-ready — by default." 
lead: "Introducing Doks, a Hyas theme build by the creator of Hyas. Doks helps you build modern documentation websites that are secure, fast, and SEO-ready — by default." 
date: 2020-11-04T09:19:42+01:00 
lastmod: 2020-11-04T09:19:42+01:00 
draft: false 
weight: 50 
images: ["say-hello-to-doks.png"]
contributors: ["赵知了"] 
--- 
## Solid as a rock
Some website projects require a solid starting point. With a great developer experience and a sound user experience. Sometimes you just don’t want to start from scratch. That’s why I created Hyas 💚

输出结果

image

添加文档页面

同样使用该命令添加文档页面。npm run create

示例

npm run create docs/overview/introduction/index.md

index. md

--- title: "Introduction" 
description: "Doks is a Hugo theme helping you build modern documentation websites that are secure, fast, and SEO-ready — by default." 
lead: "Doks is a Hugo theme helping you build modern documentation websites that are secure, fast, and SEO-ready — by default."
date: 2020-10-06T08:48:57+00:00
lastmod: 2020-10-06T08:48:57+00:00 
draft: false 
images: [] 
menu: 
 docs:
  parent: "overview" 
weight: 010 
toc: true
---

## Get started 

There are two main ways to get started with Doks: ..

输出结果

image