atum主題部署文檔
自周三發布的博客園主題1.0版本贏得得廣大博友的好評，但同時該主題也存在一些小瑕疵，這個版本主要是根據atum1.0版本以及各博友的建議做了一些升級改動，改動后重新打包發布atum1.1版本。博主在接下來的版本迭代中也會不斷加入更多符合博友方便使用的各種新特性。好了，接下是atum1.1主題的部署詳情。
介紹
一款由VUE打造的簡約型博客主題，兼容各大主流瀏覽器，響應式設計，PC、平板、手機等均可正常瀏覽。
特性
- 響應式設計，兼容手機端瀏覽器。
- 提供多種配置信息，方便各類用戶進行個人定制化。
- 部署文檔十分詳細且部署快捷。
- 主題整體偏向簡約、無太多不必要的特效畫面、偏向於閱讀型博客。
- 請求局部HTML刷新，實現全站無刷新式加載。
該版本主要改進
- 相對於atum1.0需要的blogAcc、blogId等參數的必須配置，該版本采用自動配置特性，即做到了所有屬性無必須配置，做到了按需配置的特性。
- 中央面板新增滾動條輔助，改進了能夠快速進入頁底或頁頂的閱讀體驗。
- 修改博客文章標題右側眼睛圖標為放大圖標，點擊可進行全屏沉浸式閱讀文章，加強閱讀體驗。
- 調整分頁顯示，修改為分頁頁數在下，分頁內容在上。
- 調整各處內容過長導致內容溢出或換行問題。
急速部署
前提：已經開通js權限，沒開通的可以向博客園官方申請開通。
前提：對於隨筆發布請不要設置EntryName屬性。
- 進入博客園設置，修改皮膚為SimpleMemory
- 在頁面定制 CSS 代碼下方勾選禁用模板默認CSS
- 將下方代碼塊拷貝至頁首 HTML 代碼編輯框中
- 保存檢查博客樣式是否正常
<script>
$("link").remove();$("script").remove();$(function(){$("link").remove();$("script").remove()});window.blogCommentManager=function(){this.renderComments=function(){}};window.loadViewCount=function(){};window.loadNewsAndKb=function(){};window.loadBlogSignature=function(){};window.LoadPostCategoriesTags=function(){};window.LoadPostInfoBlock=function(){};window.GetPrevNextPost=function(){};window.loadBlogCalendar=function(){};window.loadBlogSideColumn=function(){};window.loadBlogTopLists=function(){};window.GetHistoryToday=function(){};window.deliverAdT2=function(){};window.getFollowStatus=function(){};window.deliverAdC1=function(){};
</script>
<style type="text/css">body{margin:0;padding:0;overflow:hidden;margin-top:100%}#shade_animal_wrap{opacity:1;margin:0;padding:0;display:flex;position:absolute;top:0;left:0;right:0;bottom:0;align-items:center;justify-content:center;height:100vh;width:100%;background-color:#f2f2f2;z-index:99999;transition:all 1s ease 0s;}.lds-hourglass{display:inline-block;position:relative;width:64px;height:64px;transform:translateX(-30px) translateY(-60px);}.lds-hourglass:after{content:" ";display:block;border-radius:50%;width:0;height:0;margin:6px;box-sizing:border-box;border:60px solid #fff;border-color:#ff8d00 transparent #ff3004 transparent;animation:lds-hourglass 1.2s infinite;}@keyframes lds-hourglass{0%{transform:rotate(0);animation-timing-function:cubic-bezier(0.55,0.055,0.675,0.19);}50%{transform:rotate(900deg);animation-timing-function:cubic-bezier(0.215,0.61,0.355,1);}100%{transform:rotate(1800deg);}}</style><div id="shade_animal_wrap"><div class="lds-hourglass"></div></div>
<script type="text/javascript">
(()=>{
//該處用於配置atum主題參數，具體配置參數可參考下方3個表格
let p={};
p.avatarSign= "具體配置屬性可查看下方表格";
window.__BLOG_CONFIG__=p;
})();
</script>
<script type=text/javascript src=https://cjunn.gitee.io/blog_theme_atum/cnblogLoader.js></script>
配置參數說明
自定義參數屬性[按所需進行修改]
| 參數 | 是否必填 | 值說明 | 默認值 |
|---|---|---|---|
| headBackImg | 非必填 | 心情欄目背景圖URL地址 | .../img/ing/autorbimg.jpg |
| bigBackImg | 非必填 | 背景圖URL地址 | .../img/body/background.jpg |
| blogSign | 非必填 | 博客簽名 | 自慚多情污梵行，入山又恐誤傾城。世間安得雙全法... |
| aboutmeHtml | 非必填 | 關於我Html展示模板 | <img src=''/> |
| avatarSign | 非必填 | 頭像底部簽名 | ↗↗點擊頭像關注我。 |
| ingTitle | 非必填 | 心情欄簽名 | 一念花開，一念花落。這山長水遠的人世... |
| blogFriendList | 非必填 | 博客友鏈欄 | [{name: '', url: ''}] |
| blogUsedLinks | 非必填 | 博客常用鏈接 | [{name: '', url: ''}] |
| musicIds | 非必填 | 網易雲單曲ID(數組)或歌單ID(字符串) | ["26568025", "26329928"] |
| 非必填 | 博主QQ | 592571519 | |
| 非必填 | 博主email | 592571519@qq.com | |
| github | 非必填 | 博主github | cjunn |
| mainExtNav | 非必填 | 面板擴展外鏈 | [{title: "音樂收藏", url: "打開新頁面",pageid:'打開文章', icon: "ic_addmusic"}] |
| openMathJax | 非必填 | 是否開啟數學公式支持(開啟后需將原生博客園數學公式禁止) | false |
如果您需要在加載完atum主題后再次進行css渲染或JS執行可以設置以下參數值
| 參數 | 是否必填 | 值說明 | 默認值 |
|---|---|---|---|
| extCss | 非必填 | 擴展CSS樣式URL | 默認為空數組 |
| extJs | 非必填 | 擴展JS腳本URL | 默認為空數組 |
全局類參數[不建議修改]
如果您是屬於二次開發則建議您修改此處，使其加載地址為您的服務器地址
| 參數 | 是否必填 | 值說明 | 默認值 |
|---|---|---|---|
| autoInfoReset | 非必填 | 是否自動裝配博客園博主參數 | true |
| staticSrc | 非必填 | JS與CSS引用URL地址（默認即可） | https://cdn.jsdelivr.net/gh/cjunn/atum@ |
| staticVer | 非必填 | 引用atum的版本號 | v1.1 |
| staticIco | 非必填 | 網頁Icon的URL地址 | https://cjunn.gitee.io/c_cnblog_vue/img/body/miao.ico |
| extendApiPath | 非必填 | 粉絲詳情,博客文章搜索,閃存接口API | https://www.cjunn.xyz/cnblog-api |
| extendStylePath | 非必填 | 博客圖片庫URL地址 | https://cdn.jsdelivr.net/gh/cjunn/atum@v1.1 |
用戶參數配置（autoInfoReset參數默認開啟，下方表格參數將自動注入為您的相關博客信息，您可無需關注該表格參數）
| 參數 | 是否必填 | 值說明 | 默認值 |
|---|---|---|---|
| blogAcc | 非必填 | 博客賬號名 | cjunn |
| blogId | 非必填 | 博客ID號 | 571504 |
| blogPostId | 非必填 | 博客隨便一篇隨筆的隨筆ID號 | 12237892 |
| blogName | 非必填 | 博客名稱 | C君 |
| blogUserGuid | 非必填 | 博客賬號的GUID號 | 2476b4f3-9f13-4c75-389e-08d789d7fa8d |
| blogIndexPath | 非必填 | 博客主頁URL地址 | https://www.cnblogs.com/cjun/ |
| manPage | 非必填 | 博客管理后台URL地址 | https://i.cnblogs.com/ |
| sendPage | 非必填 | 博客發送郵件URL地址 | https://msg.cnblogs.com/send/cjunn |
| subPage | 非必填 | 博客訂閱RSS地址 | https://www.cnblogs.com/cjunn/rss |
| feelingBlogId | 非必填 | 閑言碎語文章ID | 13393903 |
| themeStyle | 非必填 | 主題樣式 | style0 |
| adList | 非必填 | 福利廣告 | xxx |
部署后效果
具體效果可至 點我跳轉 查看。
最后
- 開源地址Gitee、Github，求些小星星嗯。
- 感謝 @YJLAugus 在該主題不斷代碼迭代的時候提供的寶貴意見。
- 源碼目前已開源、方便具有開發經驗的人進行二次開發、但懇請您二次開發時能夠保留相應的作者信息。
- 如果你有多余的RMB的話，可以賞我吃顆糖么。
- 如果您贊賞了我，請在支付寶或微信上留下博客園ID號，讓我知道你嗯。
