README

这是一个创建美观、可定制的 Jigsaw 博客的入门模板，只需更改少量设置即可使用。

查看博客模板的预览。

安装

在安装 Jigsaw 后，从您的项目目录运行以下命令

./vendor/bin/jigsaw init jigsawboxes/simple-blog-template

此入门模板包括常见页面类型的示例，并预先配置了以下内容：

• 一个完全响应式的导航栏
• Tailwind CSS，这是一个实用 CSS 框架，允许您在不触摸一行 CSS 的情况下自定义设计
• Purgecss 从您的 CSS 中删除未使用的选择器，从而生成更小的 CSS 文件
• 使用 highlight.js 进行语法高亮显示
• 一个自动生成 sitemap.xml 文件的脚本
• 一个自定义 404 页面
• 一个用于接受 Mailchimp 订阅的组件
• 一个示例联系表单
• 一个由 Fuse.js 和 Vue.js 提供支持的搜索栏，自动索引您的内容，无需配置

配置您的网站

与所有 Jigsaw 网站一样，配置设置可以在 config.php 中找到；您可以在该文件中更新变量，以使用特定于您网站的设置。您还可以添加新的配置变量以在整个网站上使用；请参阅 Jigsaw 文档 了解更多信息。

// config.php
return [
    'baseUrl' => 'https://my-awesome-jigsaw-site.com/',
    'production' => false,
    'siteName' => 'My Site',
    'siteDescription' => 'Give your blog a boost with Jigsaw.',
    ...
];

提示：此配置文件也是您定义任何“集合”的地方（例如，您网站贡献者的集合，或按主题组织的博客文章集合）。请参阅官方 Jigsaw 文档 了解更多信息。

添加内容

您可以使用 多种文件类型 编写内容。默认情况下，此入门模板期望您的内容位于 source/_posts/ 文件夹中。

每个内容页面的顶部包含一个 YAML 头部，该头部指定了其渲染方式。使用 title 属性动态生成每个页面的 HTML title 和 OpenGraph 标签。使用 extends 属性定义此内容文件将使用哪个父 Blade 布局进行渲染（例如，_layouts.post 将与 source/_layouts/post.blade.php 一起渲染），而使用 section 属性定义期望将此内容放置其中的 Blade "部分"。

---
extends: _layouts.post
section: content
title: Getting Started
date: 2022-08-02
description: Getting started with the Jigsaw blog starter template
cover_image: /assets/img/post-cover-image-2.png
featured: true
---

添加资产

需要编译的任何资产（例如 JavaScript、Less 或 Sass 文件）都可以添加到 source/_assets/ 目录中，并在运行 npm run dev 或 npm run prod 时由 Laravel Mix 进行处理。处理后的资产将存储在 /source/assets/build/ 中（注意第二个 assets 目录中没有下划线）。

然后，当Jigsaw构建您的网站时，包含您的构建文件（以及您选择存储在那里的任何其他包含静态资源目录，如图像或字体）的整个/source/assets/目录将被复制到目标构建文件夹（在您的本地机器上的build_local）。

不需要处理（如图像和字体）的文件可以直接添加到/source/assets/。

更多关于使用Laravel Mix在Jigsaw中编译资源的说明。

构建您的网站

现在您已经编辑了配置变量并了解了如何自定义样式和内容，让我们开始构建网站。

# build static files with Jigsaw
./vendor/bin/jigsaw build

# compile assets with Laravel Mix
# options: dev, prod
npm run dev