使用 WordPress 快速打造個人 Wiki

  • 2019 年 10 月 10 日
  • 筆記

本文使用「署名 4.0 國際 (CC BY 4.0)」許可協議，歡迎轉載、或重新修改使用，但需要註明來源。 署名 4.0 國際 (CC BY 4.0)

本文作者: 蘇洋

創建時間: 2019年06月28日 統計字數: 3644字 閱讀時間: 8分鐘閱讀 本文鏈接: https://soulteary.com/2019/06/28/quickly-create-a-personal-wiki-with-wordpress.html

使用 WordPress 快速打造個人 Wiki

今年年初的時候，我曾經寫過接近十篇部落格，介紹如何「從零到一搭建Wiki」，聊過了 MediaWiki、Doku、Confluence、Tiddly、MoinMoin 等系統，但是這裡涉及的許多系統的寫作體驗都不是很好。

在之後，我也寫過幾篇 「如何使用容器技術搭建 WordPress」 的文章，據官方數據稱 WordPress 目前已經佔據了互聯網 34% 的應用，寫作體驗和插件生態其實還是很棒的，那麼我們為何不使用 WordPress 來搭建 Wiki 呢？

在使用了4個月之後，體驗下來問題不大，我決定把方法分享出來，希望能幫到更多的人。如果你熟悉 WordPress 的搭建，本篇將文章兩三分鐘內就能夠搞定啦。

明確目標

在搭建之前，我們明確一下個人 Wiki 的主要功能（以我個人為例）：

  • 簡潔好用的編輯器、能夠支援 Markdown。
  • 支援全文搜索、能夠快速根據關鍵詞獲取參考內容。
  • 支援附件管理、最好能夠支援遠程圖片自動轉存。
  • 支援分類和標籤功能。
  • 可選的支援評論功能（單人使用可忽略）。
  • 高可擴展性、但是維護成本要儘可能的低。

別看這些功能都很「基礎」，文章開頭提到的軟體，這些功能或多或少都不支援、或者做的差強人意呢。

前置準備

搭建過程之前的文章中有提，有興趣的同學可以進行翻閱。

  • 使用 Docker 和 Traefik 搭建 WordPress（Nginx）
  • 使用 Docker 和 Traefik 搭建 WordPress

當然，你也可以使用傳統的方案進行搭建。

Wiki 介面訂製

使用最新的 5.0 版本的軟體，默認安裝完畢後，你將看到下面的介面。

默認的介面適合展示部落格列表內容，對於 Wiki 用途而言不是特別友好，解決方案十分簡單，我們進入管理後台，先將 * 二〇一九* 主題切換為 * Twenty Sixteen* 。

然後點擊主題上方的「自定義」按鈕，開始對主題進行自定義調整。點擊左側菜單的小工具，然後按照你的需求對主題進行調整，比如我在這裡，保留了「搜索框」、「分類目錄」、「近期文章」、「功能」四個模組，並按照這個順序對模組進行了調整。

接著打開 設置菜單中的閱讀頁面，將主頁顯示調整為靜態頁面，並選擇靜態頁面為示例頁面。

當前展示的頁面看起來還是不像一個Wiki，那麼我們繼續進行調整。

還是打開管理後台的主題菜單頁面，選擇最後一項編輯（Theme Editor），開始對主題源文件進行修改。（如果你因為一些原因不能在瀏覽器直接修改這個文件，也可以通過編輯 wp-content/themes/twentysixteen/page.php 文件來達到同樣效果）

在右側選擇 page.php ，原始的程式碼如下：

<?php  /**   * The template for displaying pages   *   * This is the template that displays all pages by default.   * Please note that this is the WordPress construct of pages and that   * other "pages" on your WordPress site will use a different template.   *   * @package WordPress   * @subpackage Twenty_Sixteen   * @since Twenty Sixteen 1.0   */    get_header(); ?>    <div id="primary" class="content-area">      <main id="main" class="site-main" role="main">          <?php          // Start the loop.          while ( have_posts() ) :              the_post();                // Include the page content template.              get_template_part( 'template-parts/content', 'page' );                // If comments are open or we have at least one comment, load up the comment template.              if ( comments_open() || get_comments_number() ) {                  comments_template();              }                // End of the loop.          endwhile;          ?>        </main><!-- .site-main -->        <?php get_sidebar( 'content-bottom' ); ?>    </div><!-- .content-area -->    <?php get_sidebar(); ?>  <?php get_footer(); ?>

修改很簡單，我們把最下面的 get_sidebar(); 放到 <main> 之前，並補充一段樣式即可。

<?php  /**   * The template for displaying pages   *   * This is the template that displays all pages by default.   * Please note that this is the WordPress construct of pages and that   * other "pages" on your WordPress site will use a different template.   *   * @package WordPress   * @subpackage Twenty_Sixteen   * @since Twenty Sixteen 1.0   */    get_header(); ?>    <div id="primary" class="content-area">        <style>          .sidebar{              column-count: 5;              column-width: 240px;              column-gap: 20px;          }      </style>        <?php get_sidebar(); ?>        <main id="main" class="site-main" role="main">          <?php          // Start the loop.          while ( have_posts() ) :              the_post();                // Include the page content template.              get_template_part( 'template-parts/content', 'page' );                // If comments are open or we have at least one comment, load up the comment template.              if ( comments_open() || get_comments_number() ) {                  comments_template();              }                // End of the loop.          endwhile;          ?>        </main><!-- .site-main -->        <?php get_sidebar( 'content-bottom' ); ?>    </div><!-- .content-area -->    <?php get_footer(); ?>

當你在 Wiki 中適當填充一些內容之後，你會得到這樣的頁面。

Markdown 語法支援

在插件中心搜索並安裝 WPGithuberMD ，完成之後，記得啟用插件。

再次打開編輯器，你會發現原本的所見即所得編輯器就變成了我們熟悉的左右分欄的 Markdown 編輯器。

程式碼高亮

在瀏覽器性能越來越高的今天，我們幾乎完全不需要再使用服務端進行程式碼高亮啦。並且個人 Wiki 幾乎沒有搜索引擎 SEO 的需求。

在插件中心搜索並安裝 WPCodeHighlight.js，啟用插件後，文章中的程式碼便會自動進行高亮展示啦。

用戶自動登錄

如果你是個人使用，搭建在內網，完全不需要考慮許可權問題，那麼可以和我一樣，設置 WordPress 自動登錄。

在 wp-config.php 的 require_once ABSPATH.'wp-settings.php'; 前，添加下面一段程式碼。

if ($_SERVER['SCRIPT_NAME'] == '/wp-login.php') {        require_once ABSPATH . 'wp-settings.php';      require_once ABSPATH . '/wp-load.php';        if (          isset($_SERVER['QUERY_STRING']) &&          (strpos($_SERVER['QUERY_STRING'], '=logout') !== false)      ) {          wp_destroy_current_session();          wp_clear_auth_cookie();          do_action('wp_logout');      } else {          $user_login = getenv('WP_USER');            $user = get_userdatabylogin($user_login);          $user_id = $user->ID;            wp_set_current_user($user_id, $user_login);          wp_set_auth_cookie($user_id);          do_action('wp_login', $user_login);      }      wp_redirect(home_url(), 302);        die;  }

實現原理很簡單，趕在程式大部隊執行前，劫持應用登陸路由，自動替用戶設置登錄狀態。

最後

WordPress 是一款開源免費的軟體，由 PHP 編寫。前文提過，據官方數據，目前已經佔據了 34% 的互聯網軟體份額。

Use the software that powers over 34% of the web. — https://wordpress.org/download

我個人從 2009 年開始使用它到現在：

在新浪雲工作的時候，我負責過 WP4SAE 的開發維護，即使不看平台下載數據，單從我每次換公司，都能發現有不少的同事用過，就可以看出用戶量應該還不錯（偷笑）；在淘寶工作的時候有寫過幾個下載量還不錯的 WP 插件，其中一個被 360 CDN 資源站官方推薦（用於替換 Google Fonts，加速部落格打開）；也曾基於它（淘寶UED部落格）做過一套自動化的 D2 會議電子票程式，歷史 GitHub 倉庫到現在還有近千 pull request 和大幾百的 fork；還曾在內部使用它作為 confluence 的替代者，存放多個修改版本的技術文章…

從某種意義來說，我也算是見證了這套軟體的進化過程。當然，我的個人成長過程中也多次受惠於這套軟體。我認為這是一款偉大的軟體，某種意義來說，也是一個很成功的開源項目。

但從網上的帖子來看，一旦提起這款軟體，總是出現過度的批判，甚至許多人根本不知道時過境遷，一些事情早已被改變。甚至出現了批判 WordPress 是政治正確的事情… 技術沒有銀彈，軟體也是，在適合的場景用適合的技術，遇到問題分析並解決問題，才是技術人應該做的事情，而不是一味批判和吐槽。

感謝 WordPress ，替我節約了大量的時間去折騰更有意思的事情。

— EOF

VirMach 便宜 VPS

QNews

QNews