此文章是基於我在 ESJ 編輯小說資訊的個人經驗(所以內容可能有誤), 主要是分享給新手, 以增進新手在 ESJ 上編輯小說首頁的技術水準。
(畢竟偶爾會有人在留言版提出相關問題~)
其他參考連結: (點擊展開)
前置知識
注意, 本文為了解釋各種機制、 概念, 使用了一些我自定義的名詞, 並非正規使用的專有名詞。
(例如「篇章」、 「細節」等等)
- 絕對路徑網址: 簡略的說法, 就是含通訊協定類型、 伺服器名稱等等完整資訊的網址。
例如: https://www.esjzone.one/forum/1234567890/123456.html
。 - 相對路徑網址: 簡略的說法, 就是省略通訊協定類型、 伺服器名稱等等部分資訊的網址。
例如: /forum/1234567890/123456.html
。 - 小說首頁: 是指網址類似
https://www.esjzone.one/detail/1234567890.html
的頁面, 內容就是小說的相關資訊、 章節列表、 用戶評論、 用戶回應等等。 - 協助編輯: 是指小說相關設定的編輯頁面/視窗。 設定範圍主要但不限於小說首頁的內容。
- Froala 編輯器: ESJ 主要的內容編輯器。 例如小說內文、 用戶回應等。
一般運作下, 一個 Enter 會生成一個 HTML 的段落元素。 - 開發者工具: 本文內的「開發者工具」, 主要是指瀏覽器內建的網站開發者工具。
關於「協助編輯」

- 若用戶有小說的管理權限, 則會在小說首頁看到協助編輯的功能按鈕。
- 在「協助編輯」視窗下, 你可以修改小說的資訊、 設定、 章節。
「基本資料」分頁:

- 書名: 這裡放的是會在小說列表(例如:「一週更新」)與論壇中所顯示的名稱。
有些人會放與小說名稱或譯名相差甚遠的自訂名稱; 原因很多, 要嘛是自己看得順眼、 要嘛以閃避糾紛等等。 - 其他書名: 這裡可放小說原名(例: 日文原名、 韓文原名)、 譯名(例: 中文譯名、 英文譯名)等, 分隔方式隨意; 我個人習慣半形逗號(,)或分號(;)。
- 封面: 這裡可放小說的封面、 人物等相關圖片的網址。
例如: https://host.name/path/to/Image.webp
(我個人目前在 ESJ 偏好使用流浪图床; 在使用圖床時, 請注意各圖床的使用規範, 以避免意外狀況。) - 作者: 這裡可放小說的作者名稱。
- Web生肉: 這裡可放小說的原文網址。
- 其他連結: 這裡可放小說相關的網址, 例如官方網站、 漫畫網站、 Wiki 等等。
若內容(「名稱」或「連結」)留空, 在按下送出後, 該無效項目會被清除。 - 內容類型: 這裡供放小說的關聯標籤, 以半形逗號(,)分隔。
例如: 冒險,奇幻,主角(男),原作完結,漫畫化,韓輕
。
除了可參考旁附的「小說Tag參考」外, 雖不建議, 但亦可放自訂的。
「進階設定」分頁:
- 開放編輯: 是否讓「任何會員」修改「協助編輯」。 建議關閉。
- 開放評論, 顯示評論: 評論是指給「星等」的「評論」。
- 開放發文: 是否讓用戶在小說論壇發布文章。 建議關閉。
- 開放留言, 顯示留言: 留言是指小說首頁下方的用戶「回應」。
- 小說下架: 設定是否讓小說供用戶閱覽。
其他在此分頁的設定, 我就不贅述了。
「小說簡介」分頁:
這裡是使用 Froala 編輯器來編撰小說簡介的地方, 可放故事概要、 公告事項、 補充說明等等。
「章節整合」分頁:

- 最新一話(紅色半透背景區塊):
- 這區塊是設定小說的「最後更新」之資訊, 主要用途在「一週更新」等需要知道小說更新狀態的頁面。
- 第一個欄位是設定最後更新的章節標題, 不必與文章的標題相同。
(例: 若文章標題「第十三章 趁你病, 要你命!」, 在這裡可輸入「13: 落井下石」也沒差~) - 第二個欄位是設定最後更新的章節網址, 必須使用完整的「絕對網址」, 不可使用「相對網址」; ESJ 會自動轉換網域名的
cc
、 me
、 one
。
(我很久以前的測試是不能用相對網址。 對我來說相對網址比較方便且直觀, 我不知這裡為何只能用絕對網址。)
- 章節列表: 這區塊是放章節列表, 使用 Froala 編輯器。
關於章節列表的編輯:
章節列表中, 使用「絕對網址」連結的「段落」, 會被視為一個「篇章」:
- 篇章: 在閱覽小說內文時, 篇章用作導航功能之上一篇與下一篇跳轉的選用。
- 「篇章」的段落, 需至少使用一個「絕對網址」連結; 若內含兩個以上的連結, 則會使用「第一個」「絕對網址」作為篇章的連結。
- 「非篇章」的段落(例: 後續篇章的前置說明短文), 若有需要時, 僅可使用「相對網址」連結; 若用上含有絕對網址連結, 則會被視為篇章。
章節列表中, 使用 HTML 的「細節」作為可收折區塊的實作:

- 細節區塊常被用作大型章節的劃分、 或是數量上的劃分, 預設是收折的狀態。
- 在編輯章節列表時, 細節區塊的展開狀態會被儲存, 但在小說首頁上不會被正常設定。
- 若想要在小說首頁上預設展開一個細節區塊, 需要透過開發者工具(inspector), 設定細節元素的屬性
open="open"
。
章節列表在長時間的編輯下, 可能產生結構混亂。 若想要檢查或編修內容結構, 可利用開發者工具(inspector)編輯。
(例如: 刪除無法編輯的、 隱藏的、 或空的 HTML 元素)

關於插入圖片:

- 有些的網站會過濾 HTTP-header:Referer 而導致圖片在 ESJ 上無法顯示:
當瀏覽器要求圖片等資源時, 正常程序會附上 referer
以表明要求的來源網址。
有的網站為降低負載等各種原因, 會過濾來源網址是否為自家網站或授權的網址, 據以判定是否要提供資料。
(例如 i.pximg.net
就會檢查 referer
是否為 pixiv 的相關網站)

關於 Froala 編輯器:
- Froala 編輯器的編輯內容之主要架構是基於 HTML, 所以可透過瀏覽器的開發者相關功能(inspector)來進行有限的內容編輯。
(編輯器或伺服端會編修內容的原始程式碼, 所以開發者相關功能只能進行有限的內容編輯; 另, 過度濫用可能會導致伺服器異常而讓管理員盯上你~ 不論內容如何)
👍