本文關鍵字：在owncloud存儲中做站，owncloud static website hosting, hosting website in owncloud,owncloud www service,mailinabox static website hosting強化,netdisk netstorage based blog system，netdisk based static website hosting and syncing
在釋出《mineportal》時我們談到不使用靜态網站的理由：它們不具有動态性。不能互動。不可程式設計擴充。它們隻是一個從線下生成然後将結果同步/釋出到線上的工具。是以靜态網站，并不能真正代表現代意義上的“通用網站程式需求”，它們僅能負責展示，其它互動上的功能或擴充，需要靠那些傳統網站意義上的東西外挂進來。
是以那篇文章中mineportal方案1中我們用到了oc+wp。因為我們終究需要的是“網站程式”，可是話說回來，雖然static web site不具備動态性，可是如果一個網站需要互動和動态場景的地方，比如評論，背景編輯，網頁生成等處，如果這些都可以被動态程式解決，那麼這時這些動态程式（後端如oc）+前端靜态網站展示—–由它們組成的整體其實也滿足可互動被擴充，也可以被稱為“網站程式”成為我們的典型需求。而它的好處：網站可以打包打走，天然靜态化是顯然易見的，在以上提到的二篇文章中都不斷被提到過。
在《釋出mineportal2》中我們談到可在mailinabox的oc中hosting static website，甚至談到利用比如ownnote就可以作為編輯工具。那麼不防更進一步，我們下面我們來談在maininabox中一步一步實作它：
記得事先在oc中開啟ownnote(此ownnote非qownnote，也不是qownnote對應的官方原notes app)，并做好“同時儲存到sql和檔案夾”設定，并做好與nginx的指向配置。
第一步：設定nginx
我們首先要解決的問題是，owncloud ownnote預設生成htm，我們隻能以
http://xxx.com/*.htm的方式通路靜态網站，以下設定能讓nginx像wordpress一像把.htm的靜态位址重寫為/post/的形式：
add_header Content-Type: ‘text/html; charset=utf-8’;
location / { try_files $uri $uri/ @htmext; }
location ~ \.htm$ { try_files $uri =404; }
location @htmext { rewrite ^(.*)/$ $1.htm last; } 上面的add_header content-type不能省，因為oc ownnote預設儲存的htm是gb2313，即使在網頁中添加meta charset=gb2313也不能讓浏覽器認中文會顯示亂碼。
第二步:為owncloud ownnote建立static website template支援
第二個問題：ownnote儲存貼子内容直接為htm，是沒有模闆化效果的。我們需要內建外來模闆。
我們選擇了jekyll的simple jekyll主題。我們通過修改/usr/local/lib/owncloud/apps/ownnote/lib中backend.php來進行，先找到savenote()函數:
以下
http://xxx.com是你nginx指向的root目錄裡面存有jekyll-simple的css，這裡先定義了一個pre:
$precontentpart='<html><head><link rel=”stylesheet” href=”http://xxx.com/jekyll-simple/main.css”></head><body>
<div class=”page-content”>
<div class=”container”>
<div class=”three columns”>
<header class=”site-header”><h2 class=”logo”><a href=”/”>site title</a></h2><div class=”nav”><div class=”site-nav”><nav><ul class=”page-link”><li><a href=””>Home</a></li><li><a href=”/archive”>Posts</a></li><li><a href=”/about”>About</a></li><li><a href=”/feed.xml”>RSS</a></li></ul></nav></div></div></header>
</div><!– end three columns –>
<div class=”nine columns” style=”z-index:100;”>
<div class=”wrapper”>
<article class=”post” itemscope=”” itemtype=”http://schema.org/BlogPosting”>
<header class=”artilce_header”><h1 class=”artilce_title” itemprop=”name headline”>post title</h1><p class=”artilce_meta”><time datetime=”2016-07-03T00:00:00+00:00″ itemprop=”datePublished”>Jul 3, 2016</time></p></header>
<div class=”article-content” itemprop=”articleBody”><!–内容開始–>’; 再定義post(after)部分：
$postcontentpart='<!–内容結束–></div>
<footer class=”article-footer”><section class=”share”><a class=”share-link” href=”” onclick=”window.open(this.href, 'twitter-share', 'width=550,height=235');return false;”>Twitter</a><a class=”share-link” href=”” onclick=”window.open(this.href, 'facebook-share','width=580,height=296');return false;”>Facebook</a><a class=”share-link” href=”” onclick=”window.open(this.href, 'google-plus-share', 'width=490,height=530'); return false;”>Google+</a></section><hr><section class=”author”><div class=”authorimage box” style=”background: url(/jekyll-simple/assets/img/Taffy.jpg)”></div><div class=”authorinfo box”><p>Author | David Lin</p><p class=”bio”>Currently a Ph.D. student in Singapore University of Technology and Design in the area of Human-Computer Interaction(HCI).</p></div></section></footer>
</article><!– end article –>
</div><!– end wrapper –>
</div><!– end nine columns –>
</div><!– end container –>
<footer class=”site-footer”><div class=”container”><div class=”footer left column one-half”><section class=”small-font”>Theme <a href=”https://github.com/wild-flame/jekyll-simple”> Simple </a> by <a href=”http://wildflame.me/”>wildflame</a>? 2016 Powered by <a href=”https://github.com/jekyll/jekyll”>jekyll</a></section></div><div class=”footer right column one-half”><section class=”small-font”><a href=”https://github.com/wild-flame”><span class=”icon icon–github”></span></a><a href=”https://twitter.com/Taffyer”><span class=”icon icon–twitter”></span></a></section></div></div></footer>
</div><!– end page-content –>
</body></html>’; 一起寫入，上面的内容開始内容結束中的内容是指的ownnote借助編輯器中插入到生成最終htm的文章内容：
OCFilesFilesystem::file_put_contents($tmpfile, $precontentpart.$content.$postcontentpart);
這樣新寫的ownnote貼子會自動插入這些，具備模闆化後的css效果。其它主題可類推定制。以上基本是一個文章頁的通用html前端技術之essential in a nut了。
最後。雖然我們在這裡的方案有很多hacking的痕迹，可是如果考慮進一步把上面所有這些做成oc的插件，還比如更進一步完善ownnote編輯器，使之輸出直接支援模闆化的效果。它就會成為高可用的産品。至于圖檔附件什麼的，你可以參照站内文章中的《将owncloud作為wordpress的圖床》之類。
網上還有一些利用oc做靜态網站的方案，不過它們基本上隻是純粹把oc當同步工具用。本質上借助的還是jekyll,jade,gitpage這樣的方案，隻不過存儲由github repo換成了owncloud空間而已。并沒有使用到本文提到的ownnote等背景編輯增強方案。後者更自然，更強大。
————–
接下來我們會為mailinabox建立一個利用colinux封裝的mailinabox box，稱為mineportal2 box，其實不得不說把一切封裝在黑盒中是好的方案，運維的一個基本素質就是不要去動黑盒中的東西，這對使用者是好的而運維人員也可以避免少動黑盒内部對系統産生問題。
(此處不設回複，掃碼到微信參與留言，或直接點選到原文)
![SQL語言基礎：常用的資料查詢語句[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)