普通のHTMLで作成したページの指定箇所のみをブラウザ上から更新・修正できるようにするシンプルなCMS -Sitecake

普通のHTMLで作成したページをブラウザ上から簡単に更新・修正できるようにするオープンソースのCMSを紹介します。

HTMLはごく普通なものでOK、BootstrapやFoundationにも対応しています。
ブラウザ上で編集できる領域を指定できるのもいいですね。特定ページの特定箇所だけ簡単に更新できるようにするとかにも使えます。

サイトのキャプチャ

Sitecake
Sitecake -GitHub

Sitecakeの特徴

プレーンなHTMLで動作
通常のHTMLファイルをブラウザ上から修正して、保存することができます。PHPやテンプレートなどの知識は不要です。
更新・修正は簡単
テキストを変更する時はクリックするだけで編集可能に、要素を追加・削除する時はドラッグ&ドロップでOK。
データベースは必要無し
すべての変更はHTMLファイルに直接保存されます。修正が完了したら、すぐに静的なWebページになります。
オープンソース
個人でも商用でも無料で利用できるオープンソースで開発されています。

Sitecakeのデモ

デモではBootstrapで作られた静的なページをブラウザ上で更新・修正できます。
下記のデモページにアクセスしてみてください。

サイトのキャプチャ

Sitecakeのデモ: ログイン時のパスワードは「admin」

コンテンツを修正する場合は、その箇所をクリックします。

サイトのキャプチャ

Sitecakeのデモ: タイトルをクリック

すぐに編集モードになるので、テキストを変更します。

サイトのキャプチャ

Sitecakeのデモ: タイトルを変更

要素を追加する場合は、ツールバーからその要素をドラッグ&ドロップします。削除する場合は右下のゴミ箱にぽいっと。

サイトのキャプチャ

Sitecakeのデモ: リストを追加

修正・編集が完了したら、ツールバーの「Publish」をクリックします。

サイトのキャプチャ

Sitecakeのデモ: 修正完了

Sitecakeを導入して運用されているサイトも既にあるそうです。

サイトのキャプチャ

ショーケース

Sitecakeの使い方

Step 1: ファイルの準備

Sitecake関連のファイルをWebサイトのルートに設置します。

/css
/images
/js
/sitecake
index.html
sitecake.php

Step 2: HTML

編集可能にする箇所に「.sc-content」を付与します。
※それ以外の箇所は編集できません。

<div class="sc-content">
<h1>Fine looking heading</h1>
<img src=”feature.jpg">
<p>Some text</p>
</div>

Step 3: ブラウザから編集

ルートに設置した「sitecake.php」にアクセスすると、編集可能になります。

http://domain.com/sitecake.php

※デフォルトのパスワードは「admin」なので、利用する際は必ず変更したほうがよいでしょう。

詳しい使い方は、下記ページを参考に。

top of page

©2017 coliss