grav cms_Grav:构建快速灵活的网站

grav cms

I've been friends with Djamil Legato for almost a decade. We were on the MooTools team in its early days, trying to forge a more useful way of working with JavaScript. Fast forward to today, Djamil is working on an awesome flat-file CMS called Grav. Have a look at what he and his team have created!

我已经与Djamil Legato成为朋友近十年了。 我们在MooTools团队成立之初就致力于建立一种更有用JavaScript处理方式。 快进到今天,Djamil正在一个真棒平面文件名为CMS GRAV 。 看看他和他的团队创造了什么!

Grav is an open source flat-file CMS, that requires no database and that is built to be modular, easy to use, and incredibly fast. Its database-free structure offers users the advantage of simple setup, straightforward customization, and rapid deployment to any server running php 5.4 or higher, including the all new php 7.

Grav是一个开放源代码的平面文件CMS,它不需要数据库,并且构建为模块化,易于使用且速度非常快。 它的无数据库结构为用户提供了以下优点:设置简单,直接定制,可快速部署到任何运行php 5.4或更高版本的服务器,包括所有新的php 7。

The Grav project started about a year ago, and has recently gone into a release candidate stage. It has been largely created by a very small team of talented developers with experience working with larger content management systems, including Joomla and WordPress.

Grav项目大约一年前开始,最近进入了候选发布阶段。 它主要是由一个很小的才华横溢的开发人员团队创建的,他们具有与大型内容管理系统(包括Joomla和WordPress)一起工作的经验。

为什么要重力? (Why Grav?)

The inspiration behind Grav's development was to create a CMS that fills a gap between simple, static sites and complex multiuser blogs. When the project's founder, Andy Miller, took a look at the flat-file solutions already out there, he found current options were either commercial, underpowered, or both.

Grav开发背后的灵感是创建一个CMS,填补了简单,静态站点和复杂的多用户博客之间的空白。 当该项目的创始人安迪·米勒(Andy Miller)审视已经存在的平面文件解决方案时,他发现当前的选择要么是商业的,要么是动力不足的,要么两者都是。

This isn't for lack of technology. Twig tempting, YAML configuration, markdown content support, and other exceptionally user-friendly features were out there, but they hadn't been assembled into a single CMS available for free.

这不是因为缺乏技术。 Twig诱人,YAML配置,降价内容支持以及其他异常用户友好的功能已经存在,但它们尚未组合成一个免费的CMS。

We felt it was important to make Grav not only free, but open source. This enables its community of developers to contribute code, have a definite say in the project's development, and to easily create plugins and themes that take full advantage of Grav's capabilities.

我们认为让Grav不仅免费而且开源是很重要的。 这使它的开发人员社区能够贡献代码,在项目开发中享有明确的发言权,并轻松创建可充分利用Grav功能的插件和主题。

平面文件结构 (Flat-file Structure)

One of Grav's biggest features is its flat-file structure. This enables it to not only break free of the need of a database, but for its content to be simply created, swapped, and edited.

Grav最大的功能之一就是其平面文件结构。 这使它不仅可以摆脱数据库的需求,而且可以轻松地创建,交换和编辑其内容。

Installing Grav on a server is as simple as downloading the Grav core, or a skeleton which includes demo content to get you started, and unpacking it on your server.

在服务器上安装Grav就像下载Grav核心(或包含演示内容的框架)一样简单,然后开始在服务器上解压缩。

There is no database to set up or installation wizard to work through.

没有可以设置的数据库或安装向导。

User Folder

Grav has an intuitive organizational structure, as well. For example, just about everything that isn't core to Grav is stored in a user folder. This includes any custom configuration and settings, user accounts, themes, site-specific assets, plugins, and content.

Grav也具有直观的组织结构。 例如,几乎所有非Grav核心的内容都存储在用户文件夹中。 这包括任何自定义配置和设置,用户帐户,主题,特定于站点的资产,插件和内容。

At its basic level, backing up a Grav site is as simple as making a copy of the user folder.

从根本上讲,备份Grav站点就像复制用户文件夹一样简单。

The site's content is stored in the user/pages directory. Here, pages are organized using a directory structure. Each blog post, for example, would have its own folder containing a markdown file and any images used in the post. Images can be stored in many different ways, but this is one popular example.

该站点的内容存储在user / pages目录中。 在这里,页面使用目录结构进行组织。 例如,每个博客帖子都将有其自己的文件夹,其中包含markdown文件和该帖子中使用的所有图像。 图像可以以许多不同的方式存储,但这是一个受欢迎的示例。

User Folder

You can separate categories, or types of pages by directory as well. For example, if your site has a dedicated Authors area where profiles of authors are maintained, putting this content in its own folder is an easy way to set it apart in Grav's menu system.

您也可以按目录分隔类别或页面类型。 例如,如果您的站点上有一个专门的“作者”区域,用于维护作者个人资料,则将该内容放在其自己的文件夹中是在Grav菜单系统中进行区分的一种简便方法。

A theme can have several page templates that enable you to create unique styling and layouts for different areas of the site. Page templates are loaded depending on the name of the markdown file. For example, if a blog post's markdown file is named item.md, this tells Grav to use the item.html.twig template when rendering the page.

主题可以具有多个页面模板,使您可以为网站的不同区域创建独特的样式和布局。 页面模板的加载取决于markdown文件的名称。 例如,如果博客文章的markdown文件名为item.md,这将指示Grav在呈现页面时使用item.html.twig模板。

In the example seen in the image a couple paragraphs above, you we used blog.md to reference a parent blog page template included with the Antimatter theme.

在上图中的几段示例中,您使用blog.md引用了Antimatter主题随附的父博客页面模板。

强大的命令行 (Powerful Command Line)

Grav is designed to fit the needs of its user. This includes giving users the ability to decide if they want to control Grav almost entirely using the command line, or through its simple, yet powerful, admin plugin.

Grav旨在满足其用户需求。 这包括使用户能够决定是否几乎完全使用命令行或通过其简单但功能强大的管理插件来控制Grav。

Once you have Grav's core on your server, installing just about any theme or plugin is a breeze. We have detailed documentation of Grav's GPM (Grav Package Manager) and CLI commands, but we'll give a basic example of how you can hit the ground running here.

一旦在服务器上安装了Grav的核心,便可以轻松安装几乎任何主题或插件。 我们有Grav的GPM(Grav软件包管理器)和CLI命令的详细文档 ,但是我们将给出一个基本的示例,说明如何在此处运行。

演示地址

Let's say you just installed the Grav core, and want to add the TwentyFifteen theme. All you have to do is type bin/gpm install twentyfifteen.

假设您刚刚安装了Grav核心,并想要添加TwentyFifteen主题。 您所要做的就是键入bin/gpm install twentyfifteen

Want to back up your site's content? Simply type bin/grav backup from within the site's directory to generate a zip file, pre-labeled with the date and time the backup was performed. Plugins The very flexible and modular architecture of Grav, allows for anything to be just written as a Plugin. Grav Core can work alone, all you will need is a theme and nothing else, but to enrich your experience or compliment requirements for a site, it all comes down to plugins.

是否要备份您网站的内容? 只需从站点目录中键入bin/grav backup即可生成一个zip文件,该文件预先标记了执行备份的日期和时间。 插件Grav的非常灵活和模块化的体系结构允许将任何内容编写为插件。 Grav Core可以单独工作,您只需要一个主题,仅此而已,但是要丰富您对网站的体验或称赞要求,所有这些都归结为插件。

Plugins can attach to an extensive number of Events that Grav Core triggers while performing its tasks. Every event and task is greatly optimized to maintain the #1 priority of Grav, which is speed.

插件可以附加到Grav Core在执行任务时触发的大量事件。 每个事件和任务都得到了极大的优化,以保持Grav#1的优先级,即速度。

Grav is so flexible that we were able to create the whole Admin manager in a single plugin.

Grav非常灵活,我们能够在单个插件中创建整个Admin Manager。

Grav's Admin plugin gives users an intuitive, easy-to-follow interface for managing Grav's configuration and content. The goal behind the plugin was to make Grav accessible to anyone, regardless of their level of technical know-how.

Grav的Admin插件为用户提供了直观,易于操作的界面,用于管理Grav的配置和内容。 该插件背后的目标是使任何人都可以访问Grav,无论他们的专业技术水平如何。

Its dynamic structure is made possible by Grav's YAML configuration system, pulling in options and settings from plugins and themes and presenting them in a way that is intuitive and natural to the user.

Grav的YAML配置系统使它的动态结构成为可能,它从插件和主题中提取选项和设置,并以用户直观自然的方式呈现它们。

Grav's current free plugin library features over 70 plugins, with more being produced all the time.

Grav当前的免费插件库具有70多个插件,并且一直在生产更多插件。

Even if there isn't a plugin already available that meets your needs, creating one for Grav is as simple as it gets, thanks in large part to its YAML + Twig code base.

即使没有可用的插件可以满足您的需求,为Grav创建一个插件也非常简单,这在很大程度上要归功于其YAML + Twig代码库。

社区驱动的发展 (Community-driven Development)

Perhaps the most important element in Grav's DNA is its community. From day one, development has occurred in public on GitHub, with participation encouraged in a variety of ways.

Grav DNA中最重要的元素也许就是其社区。 从第一天开始,开发就在GitHub上公开进行,并通过各种方式鼓励参与。

From GitHub issues to the Gitter chat room, users are able to interact directly with the Grav development team to offer feedback, ask questions, and raise any issues that they find. There is even a forum, powered by Muut, where users can go to find information, request more detailed support, and meet other Grav users.

从GitHub问题到Gitter聊天室,用户都可以直接与Grav开发团队进行交互以提供反馈,提出问题并提出他们发现的任何问题。 甚至还有一个由Muut提供支持的论坛,用户可以在其中找到信息,寻求更详细的支持以及与其他Grav用户会面。

It's this dedication to community-driven development, along with Grav's free and open philosophy, that makes it a unique choice for anyone seeking a CMS that is fast, light, and simple to understand.

正是这种对社区驱动开发的奉献精神以及Grav的自由和开放理念,使其成为寻求快速,轻便,易于理解的CMS的任何人的独特选择。

使用自定义字段创建新的页面类型 (Creating a new page type with custom fields)

The best way to get an idea of how Grav works from a development standpoint is to dive right in and see it in action. You can download Grav's core, some plugins, and even free themes from GetGrav.org. You can even find skeletons to help you get up and running with Grav, a theme, and some sample content.

从开发的角度了解Grav的工作原理的最佳方法是深入研究并付诸实践。 您可以从GetGrav.org下载Grav的核心,一些插件,甚至免费主题。 您甚至可以找到骨骼来帮助您使用Grav,主题和一些示例内容来启动和运行。

To get us started, we will go over the process of creating a new page template with some unique styling and functionality. For the purpose of this example, we will assume that you have already installed the Core Grav package that includes a single home page, and the Antimatter theme.

为使我们入门,我们将介绍创建具有某些独特样式和功能的新页面模板的过程。 就本示例而言,我们假设您已经安装了Core Grav软件包,该软件包包括一个主页和Antimatter主题。

A feature list is a common modern user interface technique that can quickly convey the major features of your product, company or service. These commonly take the appearance of a simple icon with a title and subtitle below.

功能列表是一种常见的现代用户界面技术,可以快速传达您的产品,公司或服务的主要功能。 这些通常采用带有以下标题和副标题的简单图标的外观。

It would be great if there were a simple way to easily create some initial features, and be able to modify them easily and add more if needed. This can be accomplished with Grav's built-in custom header functionality combined with a custom Twig template to render, and even a custom blueprint to provide an interface for the Admin plugin.

如果有一种简单的方法可以轻松地创建一些初始功能,并且能够轻松地对其进行修改并在需要时添加更多功能,那将是很好的。 这可以通过Grav的内置自定义标头功能,自定义的Twig模板进行渲染,甚至是自定义的蓝图为Admin插件提供接口来实现。

Let's get cracking!

让我们开始吧!

1.创建一个新页面 (1. Create a new page)

The first thing we need to do is create a folder to house the markdown file which will represent the content. The folder also has the added ability to provide a default URL slug and order in the navigation. You will already have a homepage contained in 01.home, so simply create another folder at the same level called 02.features. This will ensure the features page comes after home, reachable by the slug /features.

我们需要做的第一件事是创建一个文件夹来容纳将代表内容的markdown文件。 该文件夹还具有在导航中提供默认URL段和顺序的附加功能。 您将已经在01.home包含了主页,因此只需在同一级别上创建另一个名为02.features文件夹02.features 。 这将确保功能页面返回首页 ,然后通过/features

In this folder, create a new file called features.md. By using the name features, we are also going to tell Grav to use a template file from our theme called features.html.twig. We will create this template later.

在此文件夹中,创建一个名为features.md的新文件。 通过使用名称功能 ,我们还将告诉Grav使用主题中的模板文件,名为features.html.twig 。 我们将在稍后创建此模板。

In this features.md file we need to define some headings in YAML format between --- markers. We commonly call this YAML frontmatter.

在这个features.md文件中,我们需要在---标记之间以YAML格式定义一些标题。 我们通常将其称为YAML前题。

---
title: Features
features:
    - title: Crazy Fast
      subtitle: So fast it will make your head spin
      icon: fighter-jet
    - title: Easily Extended
      subtitle: Built to be highly extensible
      icon: puzzle-piece
    - title: Fun to Use
      subtitle: Making web development work fun again
      icon: truck
---

# Features List

Check out a taste of our amazing features

Although Grav supports a powerful set of header settings, all are optional.

尽管Grav支持一组强大的标头设置 ,但所有都是可选的。

However, we set the title for clarity. We have also created a custom field called features that consists of a YAML list. Each of the three feature items (denoted by the -) contains three elements: title, subtitle, and icon.

但是,我们为清楚起见设置了标题。 我们还创建了一个名为features的自定义字段,该字段由YAML列表组成。 三个功能项(以-表示)中的每一个都包含三个元素: titlesubtitleicon

These names are completely arbitrary, and are simply named appropriately for our needs. Of course you can add more items if you wish, but these three will suffice for our example.

这些名称完全是任意的,只是为了满足我们的需要而适当命名。 当然,您可以根据需要添加更多项,但是对于我们的示例,这三个就足够了。

NOTE: We are using FontAwesome icon names, however the Antimatter theme already loads this for us. If you use a custom theme, you will need to ensure this is loaded.

注意:我们正在使用FontAwesome图标名称,但是Antimatter主题已经为我们加载了此名称。 如果使用自定义主题,则需要确保已加载该主题。

Below the frontmatter section (as denoted by the --- markers) we have some basic markdown headers to provide a title a description for the features that will displayed in a grid.

在“最重要的部分”下面(用---标记表示),我们有一些基本的markdown标头,以提供标题来描述将在网格中显示的要素。

2.创建一个Twig模板 (2. Create a Twig template)

When Grav initializes it will parse this page information and store the resulting object in cache. This is then available to be used to render appropriate HTML in the form of a Twig template.

当Grav初始化时,它将解析此页面信息并将结果对象存储在缓存中。 然后可以将其用于以Twig模板的形式呈现适当HTML。

Twig templates are typically stored in the templates/ folder or your current theme. Create a new file in your theme called features.html.twig. This will automatically be used to render the page because we used the page filename of features.md. In this file we will need to loop over the features we defined in the page and display them in a format we can easily manipulate with CSS:

Twig模板通常存储在templates/文件夹或您当前的主题中。 在主题中创建一个新文件,名为features.html.twig 。 这将自动用于呈现页面,因为我们使用了features.md的页面文件名。 在此文件中,我们将需要遍历页面中定义的功能,并以易于使用CSS操纵的格式显示它们:

{% extends 'partials/base.html.twig' %}

{% block content %}
<div class="features">
    {{ content }}
    <ul>
    {% for feature in page.header.features %}
        <li>
            <i class="fa fa-fw fa-{{ feature.icon }}"></i>
            <h4>{{ feature.title }}</h4>
            <p>{{ feature.subtitle }}</p>
        </li>
    {% endfor %}
    </ul>
</div>
{% endblock %}

The {% extends %} and the {% block %} definition are used to instruct Twig to extend the partials/base.html.twig template and replace the empty base content block with this custom one. The {{ content }} element will display the markdown content section of the features page. Below this, we loop over each of the list items in the page.header.features which is where we defined each feature item.

{% extends %}{% block %}定义用于指示Twig扩展partials/base.html.twig模板,并用此自定义模板替换空的基本内容块。 {{ content }}元素将显示功能页面的markdown内容部分。 在此之下,我们遍历page.header.features中的每个列表项,这是我们定义每个功能项的位置。

3.给它一些样式 (3. Give it some style)

All that is left is to provide some CSS styling to ensure the features list is rendered appropriately. We can do this by creating a file in our theme's css/ folder called custom.css. In the Antimatter theme, this is automatically inserted into the page if it exists:

剩下的就是提供一些CSS样式,以确保正确显示功能列表。 为此,我们可以在主题的css/文件夹中创建一个名为custom.css文件。 在“反物质”主题中,如果存在,它将自动插入页面中:

.features {
    text-align: center;
}

.features h1, .features h4 {
    margin-bottom: 0;
    line-height: 1.2;
}

.features > p {
    font-size: 1.1rem;
}

.features p {
    margin-top: 0;
}

.features ul {
    margin: 3rem 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

.features li {
    padding: 1rem 2rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.features li i {
    font-size: 6rem;
    margin: 0 auto;
}

@media all and (min-width: 40em) {
    .features li {
        width: 50%;
    }
}
@media all and (min-width: 60em) {
    .features li {
        width: 33.33%;
    }
}

That is enough CSS to provide a basic representation that will display our features in a grid of 3 items across.

足够CSS可以提供​​基本的表示形式,以3个项目的网格形式显示我们的功能。

All that is left is to test the results. Simply point your browser to your Grav homepage and then add /features to the URL address. You should see something like this:

剩下的就是测试结果。 只需将浏览器指向Grav主页,然后将/features添加到URL地址即可。 您应该会看到以下内容:

4.管理员蓝图 (4. Admin Blueprint)

Because Grav is a flat-file CMS, everything can be accomplished from the file system.

由于Grav是平面文件CMS,因此可以从文件系统完成所有操作。

However, when providing a solution to clients, a Web-based administration UI is huge help to those who are unfamiliar or uncomfortable with these concepts. Grav has a flexible administration plugin that can be used in these cases, and the forms within it can be extended and modified with the use of YAML files called Blueprints.

但是,在为客户提供解决方案时,基于Web的管理UI对那些不熟悉或不熟悉这些概念的人有很大的帮助。 Grav有一个灵活的管理插件,可以在这些情况下使用,并且可以使用称为Blueprints的YAML文件扩展和修改其中的表单。

A blueprint defines a form, and in the case of our custom features page, we want to add a new tab to house the list of features. This can be done by adding a new features.yaml file the blueprints/ folder of the Antimatter theme.

蓝图定义了一个表单,对于我们的自定义功能页面,我们想添加一个新选项卡来容纳功能列表。 这可以通过在Antimatter主题的blueprints/文件夹中添加一个新的features.yaml文件来完成。

This basically tells the admin what the form for the feature template should look like in order to save the data appropriately in the features.md frontmatter. Below is an example of the blueprint file:

这基本上告诉管理员功能模板的形式应该是什么样,以便将数据适当地保存在features.md frontmatter中。 以下是蓝图文件的示例:

title: Features
@extends: 
    type: default
    context: blueprints://pages 

form:
  fields:
    tabs:
      fields:
        features:
          type: tab
          title: Features
          fields:
            header.features:
              name: features
              type: list
              label: Features

              fields:
                .title:
                  type: text
                  label: Title
                .subtitle:
                  type: text
                  label: Subtitle
                .icon:              
                  type: text
                  label: Icon

If you look over this file, you will discover it's very readable. In essence it simply extends the default.yaml blueprint that is provided by Grav. Then it adds a new tab with title fetaures. In that tab is a field of type list and that list contains a set of text fields for the title, subtitle and icon. After saving this file you will be able to view, edit and add new features via the admin panel:

如果查看此文件,将会发现它非常可读。 本质上,它只是扩展了default.yaml提供的default.yaml蓝图。 然后,它增加了与标题均铺有一个新的标签。 在该选项卡中是一个类型为list的字段,该列表包含一组用于标题副标题图标文本字段。 保存此文件后,您将可以通过管理面板查看,编辑和添加新功能:

That's it! You're now ready to hit the ground running with Grav. If you are interested in finding out more, or would like to learn more about how Grav works, you can check out Grav's detailed documentation.

而已! 现在,您已经准备好使用Grav运行。 如果您有兴趣了解更多信息,或者想了解有关Grav工作原理的更多信息,可以查阅Grav的详细文档

翻译自: https://davidwalsh.name/grav-building-fast-flexible-websites

grav cms

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值