使用BoltCMS构建小型企业网站

As the web continues to mature and the demand for the efficiency of content delivery increases, more and more slim and trim CMSs are coming into the fray. Developers (front-end and back-end) are branching away from the heavy-hitters like WordPress and Drupal, and into the likes of more streamlined, tailor-made solutions. Bolt CMS is one of these CMSs, and prides itself on being a dream for designers, developers, and content editors alike.

随着网络的不断成熟和对内容交付效率的需求的增加，越来越多的超薄和精简CMS备受关注。 开发人员(前端和后端)正在从繁琐的工作(如WordPress和Drupal)分支，而转向更精简，量身定制的解决方案。 Bolt CMS是这些CMS中的一种，并且以成为设计师，开发人员和内容编辑人员的梦想而自豪。

On the front-end side of things, Bolt uses the increasingly popular Twig templating language, allowing front-end devs to quickly and neatly generate templates the way they want, and how they want. On the back-end side of things, custom types and fields give us the freedom to organise things the way we want. Bolt is also built upon Silex with Symfony components, making it stable, powerful, open source, and free. Twig, Silex, and Symfony are all under the Sensio Labs umbrella, so you’re guaranteed one will never leave the other in the dust. It’s a great combination!

在事物的前端方面，Bolt使用了越来越流行的Twig模板语言，使前端开发人员可以按照自己想要的方式以及他们想要的方式快速整齐地生成模板。 在事物的后端，自定义类型和字段使我们可以自由地按自己的方式组织事物。 Bolt也基于Silex并带有Symfony组件而构建 ，使其稳定，强大，开源且免费。 Twig，Silex和Symfony都在Sensio Labs的保护下，因此您可以确保一个人永远不会把另一个人抛在脑后 。 这是一个很好的组合！

Bolt has a really nicely laid out documentation on their site, as well as a Stack Overflow tag with an increasing number of posts. Other ways to raise points or get support include the GitHub issue tracker. Read up on the community page for more info.

博尔特有一个非常很好的布局文件上他们的网站，以及一个堆栈溢出标签与越来越多的职位。 提出问题或获得支持的其他方法包括GitHub问题跟踪器 。 在社区页面上阅读以获取更多信息。

用螺栓建造 (Building With Bolt)

In this article, we’re going to take a look at the following key points which should set us up nicely for building our first project with Bolt:

在本文中，我们将研究以下关键点，这些关键点将使我们很好地使用Bolt构建第一个项目：

1. Requirements, setup and installation
   要求，设置和安装
2. Main configuration and theme set up
   主要配置和主题设置
3. Splitting up files into templates
   将文件拆分为模板
4. Introducing and creating content types
   介绍和创建内容类型
5. Retrieving content from database records
   从数据库记录中检索内容

From now on, I recommend you keep the docs open in your browser, because we’ll reference it a lot. Alright, let’s dig in!

从现在开始，我建议您在浏览器中打开文档 ，因为我们会大量引用它。 好吧，让我们深入研究！

要求，设置和安装 (Requirements, Setup & Installation)

Bolt requires the following in order to run:

Bolt需要以下条件才能运行：

• PHP 5.3.3 or higher
  PHP 5.3.3或更高版本
• Access to SQLite, MySQL, or PostgreSQL
  访问SQLite，MySQL或PostgreSQL

• Apache with mod_rewrite or Nginx

  带有mod_rewrite或Nginx的Apache

The PHP installation also has a few more requirements, but you can read up on those here. For the admin panel to run efficiently and optimally, modern browsers are recommended. Of course, this is just for the admin side of things. The front-end will be served on the various browsers according to the way you build it.

PHP安装也有一些其他要求，但是您可以在此处阅读这些要求。 为了使管理面板高效，最佳地运行，建议使用现代浏览器。 当然，这仅是管理方面的事情。 前端将根据您构建它的方式在各种浏览器中提供服务。

There are three ways to install Bolt. I’m going to use option 1, the command line way. Let’s open up terminal and from there on, run the following commands:

有三种安装Bolt的方法。 我将使用选项1(命令行方式)。 让我们打开终端，然后从那里运行以下命令：

curl -O http://bolt.cm/distribution/bolt-latest.tar.gz
tar -xzf bolt-latest.tar.gz --strip-components=1

From here on, make sure the correct files and directories have the correct permissions. Do this by running the following:

从这里开始，确保正确的文件和目录具有正确的权限。 通过运行以下命令来执行此操作：

chmod -R 777 files/ app/database/ app/cache/ app/config/ theme/ extensions/

关于777权限的快速说明 (A Quick Note About 777 Permissions)

777 is the number of the beast, and we should all be aware of this. You should be aware of why Bolt requires 777 on certain directories:

777是野兽的编号 ，我们都应该意识到这一点。 您应该知道为什么Bolt在某些目录上要求777：

1. It’s required on the /files/ directory, because Bolt needs to write to this directory when uploading media through the admin.

   它在/files/目录中是必需的，因为通过管理员上传媒体时Bolt需要写入此目录。

2. It’s required by the app/cache/ directory, because Bolt automatically caches and retrieves cached material from this directory.

   app/cache/目录需要它，因为Bolt会自动缓存并从该目录中检索缓存的资料。

3. The app/database/ permissions are totally optional, and completely unnecessary unless using SQLite. If you are using SQLite, Bolt will need to write to this directory to update the sqlite file.

   app/database/权限完全是可选的，除非使用SQLite，否则完全没有必要。 如果您使用的是SQLite，则Bolt将需要写入此目录以更新sqlite文件。

4. The app/config/ and theme/ permissions are also optional, and only required if users would like to edit the theme and configuration files through the bolt admin.

   app/config/和theme/权限也是可选的，并且仅当用户希望通过bolt admin编辑主题和配置文件时才需要。

5. The extensions/ directory is also optional, and only required if you’ll be uploading extensions via the Bolt admin.

   extensions/目录也是可选的，仅当您通过Bolt管理员上传扩展程序时才需要。

You should be totally aware of the implications of using 777 permissions, and try to configure your server to avoid having to do so. Moving on.

您应该完全了解使用777权限的含义，并尝试配置服务器以避免这样做。 继续。

继续安装 (Continuing With Setup)

Out of the box, Bolt works just fine with SQLite (a file-based database). We’re going to configure it to work with MySQL though, which is probably a more likely scenario in a production website. Let’s set that up quickly. Since we’re in the terminal already, let’s cd into the app/config directory. Bolt gives us the default config.yml.dist file to start with, which is ready to roll with SQLite. Let’s copy that and rename it to config.yml so we can use MySQL, and open that up in an editor.

开箱即用，Bolt可以与SQLite(基于文件的数据库)配合使用。 不过，我们将对其进行配置以使其与MySQL一起使用，这在生产网站中可能是更可能的情况。 让我们快速进行设置。 由于我们已经在终端中了，所以让我们进入cd app/config目录。 Bolt为我们提供了默认的config.yml.dist文件，该文件可与SQLite一起使用。 让我们将其复制并重命名为config.yml以便我们可以使用MySQL，并在编辑器中将其打开。

We edit the database section in accordance with the Bolt docs, but make sure to put your own values in:

我们根据Bolt文档编辑数据库部分，但请确保将您自己的值放在：

database:
  driver: mysql
  username: root
  password: password
  databasename: bolt
  host: localhost
  port: 3306

Point your virtual host to the root directory of the project (for the easiest way to do this, see Homestead Improved) and visit the desired URL in the browser. You should now be presented with the Bolt start up page, prompting you to create the first user. Go ahead and do that. Now, you can log into the admin panel and also view the front end! Awesome, let’s move onto content types – the heart of Bolt.

将您的虚拟主机指向项目的根目录(最简单的方法，请参阅Homestead Enhanced )，然后在浏览器中访问所需的URL。 现在，将显示Bolt启动页面，提示您创建第一个用户。 继续做吧。 现在，您可以登录管理面板并查看前端！ 太棒了，让我们进入内容类型-Bolt的核心。

主要配置和主题设置 (Main Configuration and Theme Setup)

By default, Bolt will load with the base-2014 theme. This is great for snooping around and getting started, but it’s very likely that you’ll want to create your own theme, and build from scratch. First of all, open up the project in your editor of choice. Navigate to the theme directory, and create a new directory called my-theme (you can call it whatever you want, really). Now, we want to change that theme on our back end.

默认情况下，Bolt会加载base-2014主题。 这非常适合窥探和入门，但是很有可能您想要创建自己的主题并从头开始构建。 首先，在您选择的编辑器中打开项目。 导航到theme目录，并创建一个名为my-theme的新目录(您可以随意命名，实际上)。 现在，我们想在后端更改该主题。

Remember that configuration file we edited before we first loaded our project? Well, it’s now accessible through the admin. Go to Configuration > Main configuration, and it’ll load up the file. There’s a whole host of configuration options here, but we’ll stick to just three for now:

还记得我们在首次加载项目之前编辑的配置文件吗？ 好了，现在可以通过管理员进行访问。 转到“ Configuration > Main configuration ，它将加载文件。 这里有很多配置选项，但现在我们只坚持三个：

1. Edit the sitename to your site name.

   编辑sitename ，以您的网站名称。

2. Edit the payoff to your site’s tagline

   编辑您网站标语的payoff

3. Edit the theme to the newly created theme (my-theme in my case)

   将theme编辑为新创建的主题(以my-theme为例)

After that, save the configuration file. Now go ahead and create an index.twig file inside your theme, and just input some boilerplate code like this:

之后，保存配置文件。 现在继续在主题内创建一个index.twig文件，然后输入一些样板代码，如下所示：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>My Website</title>
  <link rel="stylesheet" href="http://bootswatch.com/superhero/bootstrap.min.css">
</head>
<body>
  
<nav class="navbar navbar-default">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Site Title</a>
    </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li><a href="#">Lorem</a></li>
        <li><a href="#">Ipsum</a></li>
        <li><a href="#">Dolor</a></li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container -->
</nav>

<main>
  <div class="container">
    <div class="jumbotron">
      <h1>Hello, world!</h1>
      <p>Welcome to my first bolt site.</p>
    </div>
  </div>
</main>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>

</body>
</html>

Notice that I’ve included a bootstrap template so that we have some aesthetics going on. You’ll probably want to link to your own CSS files, and don’t worry, I’ll show you how to do that soon. Hit refresh on the front-end window, and voila, your brand new site is waiting to be filled with delicious templates and content! But with many pages in the mix, it’s a hugely unsustainable and terrible practice to copy and paste entire chunks of reusable template code into new files, over and over again. Let’s get into templating a little bit.

请注意，我包括了一个引导程序模板，以便我们进行一些美学设计。 您可能需要链接到自己CSS文件，不用担心，我将向您展示如何做到这一点。 在前端窗口上单击“刷新”，瞧，您的全新网站正等待充满美味的模板和内容！ 但是，由于要混合使用许多页面，因此将一整段可重复使用的模板代码复制并粘贴到新文件中是一种非常不可持续且可怕的做法。 让我们开始做一些示范。

将文件拆分为模板 (Splitting Up Files Into Templates)

As with any modern day website, particularly CMSs, we want to call upon different template files as needed. If you head on over to the “building templates” section of the docs, you’ll get some valuable information to help you out. Based on Bolt’s recommended file structure, and our current template, we can easily extract two main parts from our existing index.twig file:

与任何现代网站(尤其是CMS)一样，我们希望根据需要调用不同的模板文件。 如果转到文档的“构建模板”部分，您将获得一些有价值的信息来帮助您。 基于Bolt推荐的文件结构和当前模板，我们可以轻松地从现有index.twig文件中提取两个主要部分：

• _header.twig

  _header.twig

• _footer.twig

  _footer.twig

Now, our main index file should look like this:

现在，我们的主索引文件应如下所示：

{% include '_header.twig' %}

<main>
  <div class="container">
    <div class="jumbotron">
      <h1>Hello, world!</h1>
      <p>Welcome to my first bolt site.</p>
    </div>
  </div>
</main>

{% include '_footer.twig' %}

The relevant parts have been extracted into their respective files, but I won’t include them here to overstate the obvious. Now that we’ve touched on the basics of templating, let’s move on to content types and records, i.e. content creation, storage, and retrieval.

相关部分已被提取到各自的文件中，但是我不会在这里包括它们以夸大其词。 现在，我们已经涉及了模板的基础知识，让我们继续内容类型和记录，即内容创建，存储和检索。

内容类型介绍和创建 (Introducing and Creating Content Types)

We’re talking about a CMS here, so naturally, we’re going to be pulling some kind of content and records from a database. Let’s assume that we’re building a little business website, and we want to have three static pages and one testimonials page with multiple testimonial entires. So we’re looking at this sort of navigation:

我们在这里谈论的是CMS，因此自然而然地，我们将从数据库中提取某种内容和记录。 让我们假设我们正在建立一个小的商业网站，并且我们想要有三个静态页面和一个带有多个推荐整体的推荐页面。 因此，我们正在研究这种导航：

- home
- about
- testimonials
    - single testimonial
    - ...
- contact

Let’s roll with this idea for the remainder of this article, so that we have something to build on. This brings us to the next main feature, and perhaps the main feature, of Bolt CMS – Content types and records. They concatenate the two words in the docs, because that’s how we reference them in the code, so from now on we’ll be calling them “contenttypes”.

在本文的其余部分中，让我们继续探讨一下这个想法，以便我们可以有所建树。 这将带我们进入Bolt CMS的下一个主要功能，也许是主要功能 -内容类型和记录。 它们将文档中的两个词连接在一起，因为这就是我们在代码中引用它们的方式，因此从现在开始，我们将它们称为“内容类型”。

So what exactly is a contenttype? Here’s a little excerpt from the Bolt docs:

那么，内容类型到底是什么？ 以下是Bolt文档的一些摘录：

All content in Bolt is stored in the database in a logical and flexible fashion. In general…you have an idea what kind of content you’re going to be managing. All of these different types of content are called Contenttypes in Bolt, and you can add as many different contenttypes as you need.

Bolt中的所有内容均以逻辑和灵活的方式存储在数据库中。 总的来说……您会知道您将要管理哪种内容。 所有这些不同类型的内容在Bolt中称为Contenttypes，您可以根据需要添加任意数量的不同ContentType。

Apart from a couple required “Fields” that are used internally, we’re pretty much free to define how the Contenttype is structured. In the case of our static pages, we might want to include title, teaser, image, and body fields. In the case of our testimonials, we’ll probably want something like name, position, body, and date. Let’s examine this a bit more.

除了内部使用的几个必填“字段”外，我们几乎可以自由定义Contenttype的结构。 对于我们的静态页面，我们可能需要包括title ， teaser ， image和body字段。 就我们的个人鉴定而言，我们可能需要诸如name ， position ， body和date 。 让我们再研究一下。

If we head over to our admin dashboard, you’ll notice that under the Content section, there are three different types of content that we can enter:

如果我们转到管理仪表板，您会注意到在“内容”部分下，可以输入三种不同类型的内容：

• Pages
  页数
• Entries
  参赛作品
• Showcases
  展示柜

These are actually contenttypes, and are all defined inside our contenttypes.yml file. Bolt makes it easy for us, and we can access this file directly through the admin (Configuration > Contenttypes). After studying the current contents of this file, let’s go ahead and delete everything except the pagescontent type. Our file should now look like this:

这些实际上是contenttypes，并且都在我们的contenttypes.yml文件中定义。 Bolt使我们很容易，我们可以直接通过admin( Configuration > Contenttypes )访问此文件。 在研究了该文件的当前内容之后，我们继续删除pages内容类型以外的所有内容。 现在，我们的文件应如下所示：

# Pages - used for the static pages like about, contact, etc.

pages:
    name: Pages
    singular_name: Page
    fields:
        title:
            type: text
            class: large
            group: content
        slug:
            type: slug
            uses: title
        image:
            type: image
        teaser:
            type: html
            height: 150px
        body:
            type: html
            height: 300px
        template:
            type: templateselect
            filter: '*.twig'
    taxonomy: [ chapters ]
    recordsperpage: 100

When you save that, you should notice that you no longer have access to the entries and showcases contenttypes. Let’s try to create our own for testimonials before we add any content. Head over to the “defining contenttypes” section in the docs, and let’s read through a bit. We’ll definitely want a name and singular_name, and our fields will be as we mentioned above. Let’s add our testimonial contenttype:

保存该内容时，您应该注意到您不再有权访问这些entries并showcases类型。 在添加任何内容之前，让我们尝试创建自己的推荐书。 转到文档中的“定义内容类型”部分，让我们通读一些。 我们肯定会想要一个name和singular_name ，并且我们的字段将如上所述。 让我们添加我们的推荐内容类型：

# Testimonials

testimonials:
    name: Testimonials
    singular_name: Testimonial
    fields:
        name:
            type: text
            class: large
        position:
            type: text
        body:
            type: textarea
            height: 150px

Save, and now you might get an alert to go and update your database. Follow the instructions, refresh, and now we can add a testimonial. Let’s quickly create a new testimonial, add some dummy data to it, and save it. We’ve just created our first contenttype, added a new entry, and stored it in the database. We’re not quite there yet, though. You’re probably wondering how to access and display these records. Well, let’s look at that in the next section.

保存，现在您可能会收到警报来更新数据库。 按照说明进行操作，刷新，现在我们可以添加推荐。 让我们快速创建一个新的推荐书，向其中添加一些虚拟数据，然后保存。 我们刚刚创建了第一个内容类型，添加了一个新条目，并将其存储在数据库中。 不过，我们还没有到那儿。 您可能想知道如何访问和显示这些记录。 好吧，让我们在下一部分中进行研究。

从数据库记录中检索内容 (Retrieving Content From Database Records)

We’re going to backtrack just a little bit here, because we ignored a couple of important features. By default, Bolt looks for a record.twig template file to output the “record”, or the contenttype entry. If we preview that testimonial we just created, we’ll get an error thrown at us telling us that Bolt tried to use record.twig, and it doesn’t exist. Let’s create that and throw in some dummy content:

我们将在这里稍微回溯一下，因为我们忽略了几个重要功能。 默认情况下，Bolt查找record.twig模板文件以输出“ record”或contenttype条目。 如果我们预览刚刚创建的record.twig ，则会收到一个错误消息，告诉我们Bolt尝试使用record.twig ，但它不存在。 让我们创建它并添加一些虚拟内容：

{% include '_header.twig' %}

<main>
  <div class="container">
    <div class="page-header">
      <h1>Record!</h1>
      <p>This is a generic record.</p>
    </div>
    <div class="page-content">
      <h2>Record Stuff Here</h2>
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint eum tempore optio corporis aspernatur tempora temporibus vero maxime consectetur dolorum dolore vel numquam aut iure, esse, repudiandae nemo animi, vitae.</p>
    </div>
  </div>
</main>

{% include '_footer.twig' %}

Now if we hit refresh on our preview, we’ll see that we’ve generated the generic record page with dummy data. This brings us to point number two, though. It’s highly unlikely that the template for a testimonial will be the same as the template for a static page, so let’s fix that. Back in the defining contenttypes docs, we’ll see a few other things of interest:

现在，如果在预览中单击“刷新”，我们将看到已经使用伪数据生成了通用记录页面。 但是，这使我们指向第二点。 推荐模板与静态页面的模板极不可能相同，因此让我们对其进行修复。 回到定义contenttypes文档中 ，我们将看到其他一些有趣的东西：

• record_template – the template to display a single record of a contenttype

  record_template –显示内容类型的单个记录的模板

• listing_template – the template to display the collection of records of a contenttype

  listing_template –显示内容类型记录集合的模板

As we already know, by default, record_template will use the record.twig template file by default. For listing_template, it’ll search for the listing.twig file by default. We can, however, override these in our configuration of our contenttype. Let’s update it like this:

我们已经知道，在默认情况下， record_template将使用record.twig默认模板文件。 对于listing_template ，默认情况下它将搜索listing.twig文件。 但是，我们可以在我们的内容类型配置中覆盖它们。 让我们这样更新它：

# Testimonials

testimonials:
    name: Testimonials
    singular_name: Testimonial
    fields:
        name:
            type: text
            class: large
        position:
            type: text
        body:
            type: textarea
            height: 150px
    listing_template: testimonials.twig
    record_template: testimonial.twig

Now, let’s create the respective testimonials.twig and testimonial.twig files. Here are the two files I created:

现在，让我们分别创建testimonials.twig和testimonial.twig文件。 这是我创建的两个文件：

见证 (testimonials.twig)

{% include '_header.twig' %}

<main>
  <div class="container">
    <div class="page-header">
      <h1>Testimonials!</h1>
      <p>All the testimonials be here.</p>
    </div>
    <div class="page-content">
      <p>All testimonials...</p>
    </div>
  </div>
</main>

{% include '_footer.twig' %}

见证枝 (testimonial.twig)

{% include '_header.twig' %}

<main>
  <div class="container">
    <div class="page-header">
      <h1>Testimonial!</h1>
      <p>This is a testimonial.</p>
    </div>
    <div class="page-content">
      <p>Testimonial content...</p>
    </div>
  </div>
</main>

{% include '_footer.twig' %}

Now, we can access the overview page in the browser like via /testimonials, and our first record via /testimonial/1 (which is the default slug structure for records). Let’s focus on the single testimonial for now, and retrieve the data. Inside a single record page, we have access to the record values. To increase code readability, we can access it by the record name, in our case testimonial. If we go ahead and enter {{ dump(testimonial) }} in our record template, we’ll see the entire record dumped on our screen.

现在，我们可以通过/testimonials来访问浏览器中的概述页面，并通过/testimonial/1来访问我们的第一条记录(这是记录的默认段结构)。 现在，让我们集中讨论单个推荐，并检索数据。 在单个记录页面中，我们可以访问record值。 为了提高代码的可读性，我们可以通过记录名称(在本例中为testimonial 。 如果继续，在记录模板中输入{{ dump(testimonial) }} ，我们将在屏幕上看到整个记录。

So how do we access parts of it? With Twig templating, we can access the various values by simple dot-notation. In other words, if we wanted the “name” of the person who wrote the testimonial (as defined in our contenttype configuration), we’d access it like this:

那么我们如何访问其中的一部分呢？ 使用Twig模板，我们可以通过简单的点符号访问各种值。 换句话说，如果我们想要撰写推荐书的人的“姓名”(在我们的contenttype配置中定义)，我们可以这样访问它：

{{ testimonial.name }}

With that in mind, let’s configure our template to pull in the content:

考虑到这一点，让我们配置模板以获取内容：

{% include '_header.twig' %}

<main>
  <div class="container">
    <div class="page-header">
      <h1>{{ testimonial.name }} | <small>{{ testimonial.position }}</small></h1>
      <time>{{ testimonial.datecreated|date("jS F, Y") }}</time>
    </div>
    <div class="page-content">
      {{ testimonial.body }}
    </div>

  </div>
</main>

{% include '_footer.twig' %}

Now, creating more testimonials and viewing them should be a breeze. Let’s now head to our testimonials.twig template, and try to retrieve all testimonials. Just as we were able to before, we can access the “records” by name. We can call upon records, or in this case, testimonials. Go ahead and dump that out onto your page, and you’ll see them all.

现在，创建更多推荐书并查看它们应该很容易。 现在，让我们转到我们的testimonials.twig模板，并尝试检索所有推荐书。 就像以前一样，我们可以按名称访问“记录”。 我们可以要求提供records ，或者在这种情况下，可以提供testimonials 。 继续并将其转储到您的页面上，您将看到所有内容。

Twig templating offer neat ways to iterate over arrays, along with some filters. I won’t get into too much detail here, but you’ve seen the first filter in action above when we formatted the date. I’ll use another filter to truncate the testimonial body to 100 characters. Our testimonials template should now look like this:

Twig模板提供了遍历数组以及一些过滤器的巧妙方法。 我在这里不做过多介绍，但是当我们格式化日期时，您已经看到了上面的第一个过滤器。 我将使用另一个过滤器将推荐正文截断为100个字符。 我们的推荐模板现在应如下所示：

{% include '_header.twig' %}

<main>
  <div class="container">
    <div class="page-header">
      <h1>Testimonials</h1>
      <p>All the testimonials for this great company be here.</p>
    </div>
    <div class="page-content">
      {% for testimonial in testimonials %}
        <div class="testimonial">
          <h3>{{ testimonial.name }} | <small>{{ testimonial.position }}</small></h3>
          <p>{{ testimonial.body|excerpt(100) }}</p>
        </div>
      {% endfor %}
    </div>
  </div>
</main>

{% include '_footer.twig' %}

And there you go! Navigate over to /testimonials, and you’ll see the looped, formatted output. Go ahead now and populate your about page and contact page, and try to output the records in the generic record.twig template file. If you feel like you want a specific template for pages, create a page.twig file and go from there the same way as above. You’re now properly on your way to building up your site just the way you want.

然后你去！ 导航到/testimonials ，您将看到循环的格式化输出。 现在，继续并填充您的“关于”页面和“联系”页面，然后尝试将记录输出到常规record.twig模板文件中。 如果您想为页面使用特定的模板，请创建一个page.twig文件，并按照与上述相同的方式从那里开始。 现在，您可以按照自己的方式正确构建网站。

图片和媒体注意事项 (A Note On Images & Media)

One thing we haven’t touched on at all here is how Bolt handles media uploads. If you’re coming from a WordPress background, you’re most likely interested in the way WordPress handles media, with its robust, and (personally speaking) easy to use media library. Bolt is a constant work in progress, and there’s no doubt that there’s some room for improvement here. But once you get accustomed to the file management system, it becomes a bit easier.

我们在这里根本没有涉及的一件事是Bolt如何处理媒体上传。 如果您来自WordPress，那么您可能会对WordPress处理媒体的方式感兴趣，它具有健壮且易于使用的媒体库。 Bolt是一项持续不断的工作，毫无疑问，这里还有一些改进的空间。 但是，一旦您习惯了文件管理系统，它就会变得容易一些。

In Bolt terminology, images are kept “on the stack”. This just means that there’s a stack of images that you manually uploaded. If you take a look at the directory structure, you’ll see the files directory. Here is where uploads are stored. When you upload a file in the admin, it’ll store it in a sub-directory referencing the year and month of the upload. Now, if you have a regular HTML field in your contenttype, and you’re trying to get an image in there, you might be a bit confused at this point. There’s no actual button to upload the image! Why is this?

用Bolt术语来说，图像是“堆叠”的。 这只是意味着您手动上传了一堆图像。 如果查看目录结构，您将看到files目录。 这是上传文件的存储位置。 当您在管理员中上传文件时，它将存储在引用上载年份和月份的子目录中。 现在，如果您的内容类型中有一个常规HTML字段，并且您试图在其中获取图像，那么此时您可能会有些困惑。 没有实际的按钮可以上传图像！ 为什么是这样？

By default, Bolt disables the image button from the WYSIWYG editor. Lucky for us, that’s easily accessible from the main configuration file. Inside the admin, head to settings -> configuration -> main configuration, and scroll down to the WYSIWYG section. There, you can change the images setting to true. Back in your record editor, you can now insert images the way you’d expect.

默认情况下，Bolt禁用所见即所得编辑器中的图像按钮。 对我们来说幸运的是，可以从主配置文件中轻松访问它。 在管理员内部，转到settings -> configuration -> main configuration ，然后向下滚动至所见即所得部分。 在那里，您可以将图像设置更改为true。 返回记录编辑器，您现在可以按期望的方式插入图像。

从这往哪儿走 (Where To Go From Here)

There’s a whole lot more to Bolt than what we’ve seen, and that’s what makes it beautiful to work with. It’s feature rich, but only when you want it to be. It remains lightweight and fast throughout development and production, and just feels natural and easy to use. From here on, I recommend reading through the documentation. It’s really well written and easy to follow, and it answers a lot of your questions. My two top choice sections in the docs to boost your knowledge and workflow would be content fetching and template tags. After that, you’re looking at pagination, search, extending Bolt, and the works.

Bolt的功能远远超过我们所看到的，这就是使它与之一起工作的美丽所在。 它具有丰富的功能，但仅在您需要时才具有。 在整个开发和生产过程中，它始终保持轻量化和快速的状态，并且感觉自然且易于使用。 从这里开始，我建议您通读文档。 它确实写得很好并且易于遵循，并且可以回答您的许多问题。 我在文档中用来提高知识和工作流程的两个首选部分是内容获取和模板标签 。 之后，您要查看分页，搜索，扩展Bolt及其工作。

Thanks for reading, and I hope this article gave you some great insight into building with Bolt CMS. If you’re a WordPress or Drupal developer, I highly encourage you to open your mind to new platforms like Bolt. You will not be disappointed at all!

感谢您的阅读，我希望本文能为您提供有关使用Bolt CMS进行构建的深刻见解。 如果您是WordPress或Drupal开发人员，我强烈建议您对Bolt等新平台敞开胸怀。 您将不会失望！

翻译自: https://www.sitepoint.com/using-boltcms-build-small-business-website/