网站集成

概述

Sitecake 可以管理 HTML 和 PHP 网站
您需要有一个索引页面（index.html 或 index.htm 或 index.php 或 index.php5）
要使页面的某个部分可编辑，请将 CSS 类 sc-content 添加到包装 HTML 元素
不支持嵌套 sc-content 元素

网站结构

下载并解压 Sitecake 压缩包后，内容如下：

sitecake/
sitecake.php

sitecake/ 文件夹包含 Sitecake 代码和配置。sitecake.php 用作编辑入口点。Sitecake 本身无法独立运行。您需要至少有一个索引页面，其中包含至少一个可编辑的 div 才能开始编辑。最低要求是：

sitecake/
sitecake.php
index.html

有了索引文件和其中的可编辑 div，您就可以添加新内容：标题、文本、列表、视频...

<!DOCTYPE html>
<html>
<head></head>
<body>
<div class="sc-content"></div>
</body>
</html>

files/
images/
sitecake-backup/
sitecake-temp/
sitecake/
sitecake.php
index.html

Sitecake 创建了新文件夹来存储可能的内容。

files/ 用于存储上传的文件（如 PDF）
images/ 用于存储上传的图片
sitecake-backup/ 用于创建备份。每次发布后，Sitecake 会创建所有文件的快照并将副本存储在带日期戳的文件夹中。这样可以回滚到任何编辑版本。最大备份数量可配置。
sitecake-temp/ 用于存储草稿页面和其他数据

排除特定文件不被编辑

如果您的网站包含不想被 Sitecake 管理的目录或文件，请在网站根目录创建 .scignore 文件并列出所有文件和目录，每个一行。

请注意，Sitecake 默认只检查 html、htm、php 和 php5 文件（可通过配置更改），因此不需要列出其他扩展名的文件（如 .htaccess）。

.scignore 文件示例：

framework-dir/
wordpress/
some-file-not-managed-by-sitecake.php
some-file-not-managed-by-sitecake.html
subfolder/some-file-not-managed-by-sitecake.html

现在让我们继续了解页面结构。

页面结构

添加到 HTML 标签的 CSS 类 sc-content 使该标签成为可编辑内容的包装器。sc-content 包装器内的现有代码在 Sitecake 加载后成为初始内容。所有 Sitecake 支持的标签都是可编辑的。其他内容只能移动——可以拖放到网站上的不同位置，但不可编辑。

目前 Sitecake 支持以下内容类型：

h1-h6 标题
p 段落
ul 无序列表
img 图片
a 链接（仅在 p、h1-h6 或 ul 内），可以是文本链接、图片链接或邮件链接
sc-photoset Sitecake CSS 类，用于通过拖放多张图片创建的瀑布流画廊
sc-map Sitecake CSS 类，用于嵌入式谷歌地图

有两种类型的 sc-content 容器：

基础容器 sc-content
重复器，用于重复内容的容器 sc-content-something

基础容器是网页中简单的可编辑部分。

重复器容器有一个附加的名称，作为内容重复器。当多个页面拥有相同的重复器容器时，Sitecake 在编辑其中一个后会将编辑后的内容复制到所有页面。重复器的典型用途是页面侧边栏和页脚。

以下 HTML 是一个带有重复器（sc-content-footer）和两个基础容器（标记为 sc-content）的网页示例。

<html>
<body>
<div class="row">
<div class="col sc-content">
<h1>左栏</h1>
<p>左栏文本</p>
</div>
<div class="col sc-content">
<h1>右栏</h1>
<p>右栏文本</p>
</div>
</div>
<div class="footer sc-content-footer">
<p>这是所有页面的网站页脚</p>
</div>
</body>
</html>

不要嵌套 sc-content 元素

Sitecake 不支持在另一个 sc-content 元素内嵌套 sc-content 元素。如下面的示例：

<div class="sc-content">
<p>这是正确的内容。</p>
<div class="sc-content">
<p>这是嵌套内容。不要期望它能工作。</p>
</div>
</div>