寫在前面:隨著模版用戶逐漸增多,問題也更多的暴露出來了。這里需要再次著重說明的是,Typecho 一直是個輕量級的博客框架,Photograph 也一直是個圖片/相冊類的博客主題,如果您期望使用「Ta 們」實現 WP 那樣豐富的、或者 CMS 那種專業向的功能,這里可能會令您失望,因此您可以關閉此頁然后去尋找更適合您的程序、框架或模版了;
如果您選擇繼續,香菇感謝您的支持,雖然因為工作關系很難有精力長期維持模版的開發更新,但依然會認真對待「香菇的第一款收費模版」,在保持長期更新的同時依然會努力堅持讓這款模版配置更豐富但不臃腫、更好用且依然簡約的初心。再次感謝大家的支持。
- 文檔地址:詳情
關于售后
- 主題授權以用戶QQ號碼為準
- 如果號碼發生變更請提前聯系香菇更新授權記錄
- 如果號碼遺失請聯系香菇提供歷史號碼及支付記錄信息變更授權
- 如果「未經任何提前溝通刪除香菇好友」或因任何情況「發生號碼變更」后無法提供任何「證明身份」的信息,您將失去主題授權及售后支持
- 售后支持以售后群為主
- 成功支付后香菇將邀請您加入售后群以方便交流(吹水)和獲取主題更新
- 為了方便管理入群后請盡量不要退群,如果對群消息提醒感到厭煩可屏蔽群信息
- 未經任何提前溝通的退群行為將被默認為放棄售后,但您不會失去主題的授權,且仍然受到「使用條款」的限制
- 為兼顧多數用戶,
免費
售后范圍:- 包含當前已有功能的使用答疑和 BUG 修復
- 包含「在符合條件的安裝環境下安裝主題」
- 不包含任何形式的「功能性」定制開發,但可通過「建議」形式提交需求,作者(香菇)會考慮在后續版本中更新
- 主題僅提供附件、外鏈(圖床/網盤/存儲等)圖片的使用支持,但不提供相關三方服務
付費
服務包含:- 提供 Typecho 運行環境的服務器、空間、域名(不含備案)租用及系統、環境部署等。
費用 = 成本費 + 服務費(50RMB/次)
- 提供 Typecho 運行環境的服務器、空間、域名(不含備案)租用及系統、環境部署等。
本文提供 Photograph for Typecho?付費版
主題使用(配置)說明,主要內容在主題自定義設置項的解釋中都有體現,這里僅做總結整理,如需補充請聯系香菇處理。
安裝主題
- 在合適的運行環境中安裝 Typecho 博客程序;
- 將主題包解壓到 Typecho 目錄下的
/usr/themes
中,保持主題目錄名為photograph
; - 到 Typecho 后臺管理
控制臺 > 外觀 > 可以使用的外觀
中啟用主題。
Typecho 部分
設置 > 基本
- 若您需要上傳圖片附件,則需要勾選
允許上傳的文件類型
設置下的圖片文件 (gif jpg jpeg png tiff bmp)
項目。

設置 > 閱讀
- 建議將
每頁文章數目
設置為12
篇(或12的整數倍),可以保證相冊列表在6列(6*2)
、4列(4*3)
、3列(3*4)
、2列(2*6)
狀態下都對齊顯示。

撰寫(管理)文章/頁面 > 高級選項
- 這里可以設置文章/頁面的
公開度
,文章可選公開
、密碼保護
、隱藏
、私密
、待審核
五種狀態,其中設置為密碼保護
時,前臺將顯示加密封面;頁面可選公開
和隱藏
狀態。
其他
- 該主題不需要任何其他 Typecho 插件輔助使用,如需實現其他插件輔助功能請自行解決;
- 該主題使用 Tyoecho 1.1 (17.10.30) 版本默認編輯器和 Markdown 解析器,不支持特殊需求的「解析」;
- 如果使用過免費主題,付費版可直接覆蓋使用,覆蓋后請在后臺切換一下主題使默認配置生效。
Photograph 部分
控制臺 > 外觀 > 設置外觀

設置備份/還原
- 因為 Typecho 切換主題后會清空設置,且 Photograph 自定義設置項目較豐富,所以提供
備份/還原主題設置
和管理設置備份功能。
網站 LOGO
- 填寫
LOGO
圖片地址,即可替換前臺導航欄上的文字標題。
大天朝身份認證
- 填寫
ICP備案
號,留空則不顯示。
網站「導航欄」風格設置
- 可選僅標題居中的
極簡 Ins 風格
或帶有頁面、分類、后臺管理等菜單且可配置菜單顯示方式的BootStrap 頂部固定導航欄
。
是否折疊「分類」菜單
- 可選是否
折疊顯示
導航欄上的分類列表
菜單。(該項設置僅對 BootStrap 導航欄有效) - 如果選擇不折疊,二級分類會生效。
導航欄「設置」入口
- 可選是否隱藏前臺導航欄
設置
入口,大屏模式下如果隱藏該項則搜索欄右對齊顯示。(該項設置僅對 BootStrap 導航欄有效)
設置「RSS」入口
- 選擇是否隱藏設置菜單中
RSS
入口。(該項設置僅對 BootStrap 導航欄有效)
顯示列數
- 超小屏幕顯示列數 手機 (<768px) / 小屏幕顯示列數 平板 (≥768px) / 中等屏幕顯示列數 桌面顯示器 (≥992px) / 大屏幕顯示列數 大桌面顯示器 (≥1200px)
封面高度設置
- 基于默認「正方形」狀態下的高度倍數設置,默認1倍高度;
- 倍數<1(如0.8)則顯示為橫向矩形,倍數>1(如1.5)則顯示為豎向矩形。
封面標題默認狀態
- 可選是否默認顯示
封面
標題、內容圖片數量等信息。
封面標題邊框設置
- 替換了舊版本的「封面標題邊框」,可分別設置封面標題框四個方向是否顯示。
封面標題圓角設置
- 可分別設置封面
標題框四個角
是否顯示為圓角
。
封面標題裝飾
- 可選封面標題框上的
裝飾掛件
,如果標題邊框設為不顯示則該項配置無效。
是否登錄后可見密碼保護的相冊
- 設置登陸后才顯示加密的相冊。這種隱藏方式有缺陷,會導致列表頁加密相冊直接隱藏,且沒有替補相冊,不建議啟用。
是否顯示密碼保護相冊的原始封面
- 設置是否顯示密碼保護相冊的原始封面,標題文字及內容仍需密碼驗證。
密碼保護的相冊封面
- 填寫
密碼保護相冊
的自定義封面圖地址,留空則顯示默認圖片。
懶加載圖片設置
- 填寫
懶加載 loading 圖片
地址,留空則顯示默認圖片。
相冊封面圖片參數設置/相冊詳情圖片參數設置
- 填寫相冊封面/詳情圖的
預處理參數
,適用于各種云存儲
、對象存儲
等,如無此需求請留空。 - 以七牛為例:
原圖URL為:
https://dn-odum9helk.qbox.me/resource/gogopher.jpg
如果需要錨點在正中 (Center),生成 300x300 裁剪圖,添加參數后的完整鏈接為:
https://dn-odum9helk.qbox.me/resource/gogopher.jpg?imageMogr2/gravity/Center/crop/300x300
則后臺設置的文本框中只需要填寫參數即可:
?imageMogr2/gravity/Center/crop/300x300
示例圖片鏈接來源:https://developer.qiniu.com/dora/api/1270/the-advanced-treatment-of-images-imagemogr2
圖片「燈箱」選擇
- 選擇用于展示圖片詳情的插件,可選
fancybox3
或lightGallery
插件,請注意為了適配某些功能,兩個插件皆為香菇修改版
,請不要隨意替換。
fancybox3 功能開關/lightGallery 功能開關
- 配置圖片詳情界面前臺展示樣式和功能入口等。
網站公告風格設置
- 可設置網站
公告
顯示的位置
。
網站公告顏色設置
- 可配置網站
公告
顯示的顏色
。
網站公告
- 填寫網站
公告內容
,支持HTML
。
Footer Powered …
- 可選是否顯示
頁腳
「POWERED BY TYPECHO / THEME BY SIITAKE」信息。
全站信息統計
- 可選是否啟用
全站信息統計
,啟用將統計全站分類、文章、頁面、評論以及附件和文章內容中的圖片數量,可能會略微增加主機負擔。
統計代碼
- 可填寫三方統計平臺生成的
統計代碼
,該內容在頁面隱藏生效,留空則不生效。
相冊標簽
- 設置是否顯示相冊詳情頁(底部)標簽。
右下側功能按鈕樣式
- 設置頁面右下側功能按鈕的默認形狀和不透明度。
組圖默認描述
- 可填寫組圖的
默認描述
,優先級低于「自定義字段」的值,留空則顯示「未填寫」。
自定義樣式表(CSS)
- 可自定義或覆蓋主題的某些樣式。
全局圖片源選項(慎用)
- 全局設置相冊詳情圖的來源,選擇后兩項則「自定義字段」處的「圖片源」選項
不生效
。
如無特殊需求請保持此選項為默認值。
相冊封面風格(測試)
- 測試功能,暫無描述
自定導航欄菜單
- 如果需要自定義添加導航欄菜單,請按照
名稱|地址|是否新窗口打開(true/false)
的格式,一行一個填在此設置項的文本框內。 - 示例:
文檔|https://photo.siitake.cn/docs|true
香菇|https://siitake.cn/|false
移動(小屏)頁面是否顯示頂部分類導航
- 設置是否顯示獨立的分類導航。僅在小屏顯示。
設置「隨機文章/相冊」入口位置
- 可選
不顯示
、導航欄
、右下角
。點擊可隨機跳轉到一個相冊/一篇文章。
站點「圖標」設置
- 填寫站點favicon的路徑,用來自定義站點圖標。
設置「標簽」樣式
- 可選單色和彩色兩種詳情頁標簽樣式。
設置「首次訪問」提示頁
- 設置啟用或停用
「首次訪問」提示頁
填寫「首次訪問」提示頁自定義代碼
- 支持標準 HTML(5) 格式的代碼,用于創建頁面結構。
- 示例代碼①:
<h1 class="fv-title">FBI WARNING</h1>
<p class="fv-content">FBI Warning Federal law provides severe civil and criminal penalties for the unauthorized reproduction,distribution,or exhibition of copyrighted motion prictures(Title 17, United States Code, Sections 501 and 508). The federal bureau of Investigation investigate allegations of criminal copyright infringement.<br>
(Title 17, United States Code, Section 506)</p>
<p class="fv-content"><button class="fv-ok" onclick="cookieSet('firstVisiting', 156518603, 1);location.reload();">OK</button><button class="fv-no" onclick="cookieDelete('firstVisiting');location.>EXIT</button></p>
- 示例代碼②:
<div class="fv-logo"></div>
<div class="fv-nav fv-antiselect">
<ul>
<li><a target="_blank" >博客</a></li>
<li><a target="_blank" href="javascript:cookieSet('firstVisiting', 156518603, 1);location.reload();">圖庫</a></li>
<li><a target="_blank" >網盤</a></li>
</ul>
</div>
<div class="fv-footer">
<p class="fv-icp fv-antiselect">
<p>陜ICP備17001968號</p>
</p>
</div>
注:按鈕調用的cookieSet('firstVisiting', 156518603, 1);
和cookieDelete('firstVisiting');
方法用于操作cookie,結合后臺代碼控制是否顯示。
填寫「首次訪問」提示頁自定義樣式
- 支持標準 CSS(3) 格式,用于控制頁面樣式。
- 示例樣式①:
#firstVisitingPage { background-color: black; color: white; }
.fv-title { display: block; width: 270px; margin: 120px auto 40px auto; text-align: center; background-color: red; padding: 5px; }
.fv-content { display: block; width: 70vw; margin: 10px auto; font-size: 32px; text-align: center; }
.fv-ok { margin: 5px; background-color: green; min-width: 100px; }
.fv-no { margin: 5px; background-color: red; min-width: 100px; }
@media screen and (max-width: 767px) { .fv-content { font-size: 18px; } }
@media screen and (max-width: 320px) { .fv-title { width: 220px; margin: 60px auto 15px auto; font-size: 26px; } }
- 示例樣式②:
#firstVisitingPage { height: 100vh; background: -webkit-linear-gradient(pink, plum); background: -o-linear-gradient(pink, plum); background: -moz-linear-gradient(pink, plum); background: linear-gradient(pink, plum); font-size: 1em; }
.fv-logo { width: 320px; height: 320px; margin: calc(50vh - 250px) auto 30px auto; background-color: palevioletred; background-image: url('https://siitake.cn/tools/weiboAvatar/?uid=6185985582'); background-position: center; background-size: cover; border: 10px solid white; border-radius: 320px; }
.fv-nav { text-align: center; }
.fv-nav ul { list-style: none; padding-left: 0; }
.fv-nav li { display: inline-block; }
.fv-nav a { display: block; color: palevioletred; padding: 5px 10px; margin: 5px; background-color: white; border-radius: 3px; text-decoration: none; font-size: 1.5em; transition: all .5s; }
.fv-nav a:hover { color: white; background-color: palevioletred; }
.fv-footer{ width: 100vw; height: 30px; position: fixed; bottom: 30px; text-align: center; }
.fv-icp { font-size: .75em; line-height: 2px; color: white; }
.fv-antiselect { user-select: none; -ms-user-select: none; -moz-user-select: none; -webkit-user-select: none; }
快捷鍵設置
- 設置網站鍵盤快捷鍵功能,請按照「按鍵|功能描述|執行代碼」的格式,一行一個填在此設置項的文本框內。
- 可直接填寫按鍵或組合鍵的名稱,不必填寫鍵值,例如:
T
、5
、[
、ESC
、ENTER
、CTRL+R
等。 - 執行代碼支持標準
javascript
代碼,但不支持聲明函數。 - 示例:
H|返回首頁|location.href = "/";
T|跳到頂端|$("html ,body").animate({scrollTop: 0}, 300);
B|跳到底部|$("html ,body").animate({scrollTop: document.body.scrollHeight}, 300);
Ctrl+R|隨機文章|location.href = randomPost;
自定義字段

「相冊/圖文」模式選擇
- 前臺文章詳情的顯示方式,可選
相冊(默認)
和圖文(與單頁排版一致)
兩種模板。
圖片[title]
- 選擇前臺圖片標簽的
title
屬性值,圖片源為內容的title
默認為文章標題序列,標題序列
指的是在標題文字后添加形如[1]
的序號
圖片源
- 選擇前臺展示的
圖片源
。 - 選擇
附件
則只讀取 Typecho 原生或插件附件
中的圖片。 - 選擇
內容
則只讀取文章正文文本框中填寫的外鏈
圖片。 - 選擇
附件+內容
則內容(外鏈)圖片在前。 - 內容(外鏈)圖片支持
Markdown
和HTML
標準格式,不支持純 URL
。 - 示例:
<img src="https://ws1.sinaimg.cn/mw1024/006v3k7fly1g2zhxz8bvfj34o03401ky.jpg">

作者/來源
- 填寫照片拍攝照片者的姓名、圖片來源等信息。
來源地址
- 填寫圖片出處
URL
,留空則不鏈接地址。
出鏡人物
- 填寫照片/圖片出鏡者信息。
處理軟件
- 選擇照片/圖片后期處理用到的軟件。
打包下載
- 在這里填寫圖片打包下載
URL
,留空則不顯示。
打包下載鏈接名
- 自定義圖片打包下載
鏈接文字
,留空則顯示打包下載
。
圖集描述
- 填寫照片描述等其他信息,支持
HTML
。
封面圖片
- 填寫
封面圖片
的地址,留空將自動獲取第一張圖片。
是否隱藏部分圖片
- 可設置相冊詳情隱藏部分圖片并登陸后可見
隱藏圖片位置
- 填寫整數,從此位置的圖片開始隱藏。
設置「不一樣の列」
- 頁面共12列,設置第N張圖片超小屏、小屏、中屏、大屏所占列數,示例:2:12,8,6,6。示例
閱讀次數
- 記錄相冊被點擊的次數,可手動設置起始閱讀量,后續點擊會在此基礎上自增。
以上就是這款Typecho相冊主題使用介紹的全部內容了。