Structure

Ghost主题包含静态HTML模板,这些模板使用helper类从站点输出数据,并使用定制的CSS进行样式化

A Ghost theme contains static HTML templates that make use of helpers to output data from your site, and custom CSS for styling.

Structure

Ghost主题的推荐文件结构是:

The recommended file structure for a Ghost theme is:

Structure
.
├── /assets
| └── /css
| ├── screen.css
| ├── /fonts
| ├── /images
| ├── /js
├── default.hbs
├── index.hbs [required]
└── post.hbs [required]
└── package.json [required]

一个可选的/partials目录允许您在整个站点中使用部分模板。这允许您在多个模板之间共享HTML块,并减少代码重复。

An optional /partials directory allows you to use partial templates across your site. This allows you to share blocks of HTML between multiple templates and reduce code duplication.

Structure
.
├── /assets
├── /css
├── screen.css
├── /fonts
├── /images
├── /js
├── /partials
├── list-post.hbs
├── default.hbs
├── index.hbs [required]
└── post.hbs [required]
└── package.json [required]

Templates模板

需要两个模板文件:index.hbs和post.hbs。所有其他模板都是可选的。我们强烈建议使用default.hbs文件作为你的主题的基本布局。如果对于不同的页面或内容类型有明显不同的布局,则可以使用动态路由配置层,或使用partials来封装主题的公共部分。

Two template files are required: index.hbs and post.hbs. All other templates are optional. We highly recommended using a default.hbs file as a base layout for your theme. If you have significantly different layouts for different pages or content types, you can use the dynamic routing configuration layer, or use partials to encapsulate common parts of your theme.

主题模板是层次化的,因此一个模板可以扩展另一个模板。这可以防止重复基本HTML。以下是一些常用的主题模板及其用途

Theme templates are hierarchical, so one template can extend another template. This prevents base HTML from being repeated. Here are some commonly used theme templates and their uses:

default.hbs

default.hb是一个基本模板,它包含存在于每个页面上的乏味的HTML位,如< HTML >、<head>或<body>,以及所需的{{ghost_head}}和{{ghost_foot}}和任何用于页眉和页脚的HTML。

default.hbs is a base template that contains the boring bits of HTML that exist on every page such as <html><head> or <body> as well as the required {{ghost_head}} and {{ghost_foot}} and any HTML for the header and footer.

index.hbs

这是发布列表所需的标准模板。如果您的主题没有标记,也可以使用tag.hbs,author.hbs或index.hbs的模板。index.hbs模板通常扩展默认值。并使用{{#foreach}}帮助器传递一个帖子列表。

This is the standard required template for a list of posts. It is also used if your theme does not have a tag.hbsauthor.hbs or index.hbs template. The index.hbs template usually extends default.hbs and is passed a list of posts using the {{#foreach}} helper.

home.hbs

为主页提供特殊内容的可选模板。这个模板只用于渲染/。

An optional template to provide special content for the home page. This template will only be used to render /.

post.hbs

扩展默认值的单个post所需的default.hbs并使用{{#post}}帮助器输出post细节。可以使用post-:slug.hbs创建各个帖子的自定义模板。

The required template for a single post which extends default.hbs and uses the {{#post}} helper to output the post details. Custom templates for individual posts can be created using post-:slug.hbs.

page.hbs

静态页面的可选模板。如果没有指定,那么post。将使用hbs。可以使用page-:slug.hbs创建各个页面的自定义模板。

An optional template for static pages. If this is not specified then post.hbs will be used. Custom templates for individual pages can be created using page-:slug.hbs.

custom-{{template-name}}.hbs

一个可选的自定义模板,可以在管理界面中选择每一篇文章的基础上。它们可以用于文章和页面。

An optional custom templates that can be selected in the admin interface on a per-post basis. They can be used for both posts and pages.

tag.hbs

标签存档页面的可选模板。如果没有指定 index.hbs模板。可以使用tag-:slug创建单个标记的自定义模板。

An optional template for tag archive pages. If not specifed the index.hbs template is used. Custom templates for individual tags can be created using tag-:slug.

author.hbs

一个可选的作者档案页模板。如果没有指定index.hbs模板。可以使用author{{slug}}为个别作者创建自定义模板。

An optional template for author archive pages. If not specified the index.hbs template is used. Custom templates for individual authors can be created using author{{slug}}.

private.hbs

密码保护发布上的密码表单页的可选模板。

An optional template for the password form page on password protected publications.

error.hbs

一个可选的主题模板,用于404或500错误,这些错误不能通过特定于错误或类的模板来处理。如果没有指定,Ghost将使用默认值。

An optional theme template for any 404 or 500 errors that are not otherwise handled by error- or class-specific templates. If one is not specified Ghost will use the default.

error-{{error-class}}xx.hbs

一个可选的主题模板,用于处理属于特定类的错误(例如error-4xx.hbsfor 400级错误)。匹配的错误类模板优先于这两个 error.hbs用于呈现错误的hbs和Ghost默认模板。

An optional theme template for errors belonging to a specific class (e.g. error-4xx.hbsfor 400-level errors). A matching error class template is prioritized over both error.hbs and the Ghost default template for rendering the error.

error-{{error-code}}.hbs

状态代码特定错误的可选主题模板(例如error-404.hbs)。匹配的错误代码模板优先于呈现错误的所有其他错误模板。

An optional theme template for status code-specific errors (e.g. error-404.hbs). A matching error code template is prioritized over all other error templates for rendering the error.

amp.hbs

AMP(加速移动页面)的可选主题模板。如果你的主题没有提供amp.hbs文件,Ghost将使用它的默认值。

An optional theme template for AMP (Accelerated Mobile Pages). If your theme doesn't provide an amp.hbs file, Ghost will use its default.

robots.txt

主题可以包括一个robots.txt,它覆盖Ghost提供的默认robots.txt。

默认主题Casper的开发版本可以用来探索Ghost主题是如何工作的,或者你可以定制Casper并使它成为你自己的!

Themes can include a robots.txt which overrides the default robots.txt provided by Ghost.

The development version of the default theme Casper can be used to explore how Ghost themes work, or you can customise Casper and make it your own!

Helpers

Ghost模板是由HTML和handlebars helper构造的。有几个要求:

为了让Ghost主题发挥作用,您必须使用所需的帮助程序:{{asset}}、{{body_class}}、{{post_class}}、{{ghost_head}}、{{ghost_foot}}。

有关特定Handlebars助手的详细信息,请参阅助手的完整列表。

Ghost templates are constructed from HTML and handlebars helpers. There are a few requirements:

In order for a Ghost theme to work, you must make use of the required helpers: {{asset}}{{body_class}}{{post_class}}{{ghost_head}}{{ghost_foot}}.

See the full list of helpers for more detailed information about specific Handlebars helpers.

Contexts

Ghost主题中的每个页面都属于由URL确定的上下文。上下文将决定使用什么模板,什么数据可用,以及{{body_class}} helper将输出什么。

Each page in a Ghost theme belongs to a context which is determined by the URL. The context will decide what template will be used, what data is available and what is output by the {{body_class}} helper.

Styling

在构建主题时,一定要考虑类和id的范围,以避免主样式和post样式之间的冲突。id是自动为标题生成的,并在文章中使用,所以最好将内容限定在页面的特定部分。例如:#themename-my-id优先于#my-id。

When building themes it is important to consider the scope of classes and IDs to avoid clashes between your main styling and your post styling. IDs are automatically generated for headings and used inside a post, so it's best practice to scope things to a particular part of the page. For example: #themename-my-id is preferrable to #my-id.

Development mode

建议使用本地安装使用开发模式构建自定义主题-请参阅本地安装指南,以便开始您自己的本地安装进行开发。

在生产模式中,模板文件由服务器加载和缓存。要反映hbs文件中的任何更改,请使用ghost restart命令。

当你上传你的主题到Ghost管理时,Ghost将自动检查致命错误。对于开发期间的完整验证报告,请使用GScan工具。

It is recommended to use a local install to build a custom theme using development mode – review the local install guide to get started with your own local install for development.

In production mode, template files are loaded and cached by the server. For any changes in a hbs file to be reflected, use the ghost restart command.

Ghost will automatically check for fatal errors when you upload your theme into Ghost admin. For a full validation report during development, use the GScan tool.

Summary

现在,您已经对Ghost主题的结构和一些最常见模板的概述有了坚实的理解。在深入研究上下文、帮助程序和其他特性的细节之前,下一步是获得包package.json的概述。

You now have a solid understanding of how a Ghost theme is structured and an overview of some of the most common templates. Before diving into the specifics of contexts, helpers and additional features, the next step is to get an overview of the package.json file.

05-06 04:13