将 Silverstripe 网站设置为 CMS 之外的 Live 版本

Question

我们有许多客户在使用 Silverstripe CMS 时感到困惑，然后他们的实时网站显示草稿版本。

我们设置了“Better Navigator”来显示网站是处于草稿还是实时状态，但客户仍然感到困惑（并且在某些视图中“更好的导航器”按钮被遮挡）。

理想情况下，如果在 CMS 之外查看实时网站，我们希望它仅显示“实时”版本。

这可能吗？

Answer 1

我们可以添加一些仅草稿 CSS 以使用户更清楚他们正在查看草稿版本，而不是强制网站始终显示已发布的版本。

创建一个draft.css 文件，该文件将更改草稿版本的网站样式。在此示例中，我将更改 body 标记的背景以显示带有“草稿”字样的平铺图像。

mysite/css/draft.css

body {
    background-image: url(../images/draft-background.png);
}

mysite/images/draft-background.png

在我们的Page_Controllerinit函数中，当当前阶段设置为Stage时，我们加载draft.css文件：

Page_Controller

class Page_Controller extends ContentController
{

    public function init()
    {
        parent::init();

        // ...
        if ($this->current_stage() == 'Stage') {
            Requirements::css('mysite/css/draft.css');
        }
    }
    // ...
}

最终结果如下所示：

这只是我们可以使用仅草稿 css 执行的示例之一。或者，我们可以替换网站徽标，或在页面内容顶部显示警告栏。

这里有一些替代的 css 来显示上面的 draft-background.png 上面的所有网站内容，而不是 body 标签的背景图片：

body:after {
    background-image: url(../images/draft-background.png);
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1000;
    pointer-events: none;
    opacity: 0.25;
}

下面是一些在每个页面顶部显示警告栏的示例 css：

body:after {
    content: "You are currently viewing a draft version of this page";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10000;
    pointer-events: none;
    opacity: 0.75;
    text-align: center;
    background: #F7CA18;
    color: #000000;
    padding: 20px;
}

body {
    margin-top: 60px;
}