
hexo-douban 爬取数据生成电影-游戏-书籍页面
魔改需谨慎,所列出配置仅测试完成后无问题发布,不代表您的最终效果
一个在 Hexo 页面中嵌入豆瓣个人主页的小插件.
最初版本
安装
npm install hexo-douban --save
配置
将下面的配置写入站点的配置文件 _config.yml
里(不是主题的配置文件).
douban:
id: 您的豆瓣ID
builtin: false
item_per_page: 12 #这里也是可以设置每个页面显示的数量,为了好看,就是每个页面显示12个电影/游戏/书籍/音乐
book:
path: books/index.html
title: 'This is my book title'
quote: 'This is my book quote'
option:
movie:
path: movies/index.html
title: 'This is my movie title'
quote: 'This is my movie quote'
option:
game:
path: games/index.html
title: 'This is my game title'
quote: 'This is my game quote'
option:
song:
path: songs/index.html
title: 'This is my song title'
quote: 'This is my song quote'
option:
timeout: 10000
- user: 你的豆瓣ID(纯数字格式,不是自定义的域名)。获取方法可以参考怎样获取豆瓣的数字 ID ?
- title: 该页面的标题。
- quote: 写在页面开头的一段话,支持html语法。
- timeout: 爬取数据的超时时间,默认是 10000ms ,如果在使用时发现报了超时的错(ETIMEOUT)可以把这个数据设置的大一点。
这里id的获取提供一个比较简单的方式
打开豆瓣,选择右上角的个人主页,点击头像,然后图片另存为即可发现类似:up239549547-2.jpg的名称,其中239549547便是您的数字ID
使用
需要注意:如果不加参数,那么默认参数为-bgm
【这里直接用 hexo douban -bgms即可】
$ hexo douban -h
Usage: hexo douban
Description:
Generate pages from douban
Options:
-b, --books Generate douban books only
-g, --games Generate douban games only
-m, --movies Generate douban movies only
-s, --songs Generate douban songs only
需要注意的是,通常大家都喜欢用hexo d
来作为hexo deploy
命令的简化,但是当安装了hexo douban
之后,就不能用hexo d
了,因为hexo douban
跟hexo deploy
的前缀都是hexo d
。
第一次使用 hexo douban 时,后台会异步进行数据获取,一般需要等待一段时间才能查到数据(大约五分钟)。
由于数据是分阶段获取,当第一次成功生成页面时其实只获取了图书、电影或游戏的简略信息。后台会慢慢更新详细信息,如果有需要可以再多等等一段时间。时间视你的数据数量而定,平均一个资源会花6s。例如如果你有 100 个想读、100个已读、100个在读的图书,则大约需要等待 300*6/60= 30 分钟。
后续如果你的豆瓣数据更新了,hexo douban 同样也会自动进行更新(同样需要等待一段时间才会查到更新数据),不过一个用户id每天至多只会同步一次。
显示
如果上面的配置和操作都没问题,就可以在生成站点之后打开 //yourblog/books
和 //yourblog/movies
, //yourblog/games
, 来查看结果.
进阶版
当你完成最初版本后,无需修改config.yml中配置,我也是在原作者的基础上稍微进行了改动,这里可以下载以下文件进行替换,再次提醒您需要注意的是:魔改需谨慎,效果仅改变本文章所涉及的相关页面,其他部分显示效果可能存在差异
找到博客存放路径的根路径的node_modules\整个替换hexo-douban文件夹即可(后面有时间在整npm方式的)
然后在css文件内新建一个css文件(下面会列出我的路径作为参考)
:root {
--global-font-size: 16px;
--global-bg: #fff;
--font-color: #4c4948;
--hr-border: #97bcfb;
--hr-before-color: #6ea2f9;
--search-bg: #f6f8fa;
--search-input-color: #4c4948;
--search-result-title: #4c4948;
--preloader-bg: #37474f;
--preloader-color: #fff;
--tab-border-color: #f0f0f0;
--tab-botton-bg: #f0f0f0;
--tab-botton-color: #1f2d3d;
--tab-button-hover-bg: #dcdcdc;
--tab-button-active-bg: #fff;
--card-bg: #fff;
--sidebar-bg: #f6f8fa;
--btn-hover-color: #ff7242;
--btn-color: #fff;
--btn-bg: #307af6;
--text-bg-hover: #307af6;
--light-grey: #eee;
--white: #fff;
--text-highlight-color: #1f2d3d;
--blockquote-color: #6a737d;
--blockquote-bg: rgba(73, 177, 245, 0.1);
--reward-pop: #f5f5f5;
--toc-link-color: #666261;
--card-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, 0.06);
--card-hover-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, 0.15);
}
/*颜色与数值编辑*/
:root {
--sevene-white: #fff;
--sevene-white-op:rgba(255,255,255,0.2);
--sevene-black:#000;
--sevene-black-op:rgba(0,0,0,0.2);
--sevene-none: rgba(0, 0, 0, 0);
--sevene-gray: #999999;
--sevene-gray-op:#9999992b;
--sevene-vip:#e5a80d;
--sevene-main:var(--sevene-theme);
--sevene-main-op:var(--sevene-theme-op);
--sevene-main-op-deep: var(--sevene-theme-op-deep)!important;
--sevene-shadow-theme:0 8px 12px -3px var(--sevene-theme-op);
--sevene-shadow-blackdeep:0 2px 16px -3px rgba(0,0,0,.15);
--sevene-shadow-main:0 8px 12px -3px var(--sevene-main-op);
--sevene-shadow-blue:0 8px 12px -3px rgba(40,109,234,.20);
--sevene-shadow-white:0 8px 12px -3px rgba(255,255,255,.20);
--sevene-shadow-black:0 0 12px 4px rgba(0,0,0,.05);
--sevene-shadow-yellow:0px 38px 77px -26px rgba(255,201,62,.12);
--sevene-shadow-red:0 8px 12px -3px #ee7d7936;
--sevene-shadow-green:0 8px 12px -3px #87ee7936;
--sevene-shadow-border: 0 8px 16px -4px #2c2d300c;
--sevene-white-acrylic1: #fefeff !important;
--sevene-white-acrylic2: #fcfdff !important;
--sevene-black-acrylic2: #08080a !important;
--sevene-black-acrylic1: #0b0b0e !important;
--style-border: 1px solid var(--sevene-card-border);
--sevene-blue-main: #425aef;
--style-border-hover: 1px solid var(--sevene-main);
--style-border-dashed: 1px dashed var(--sevene-theme-op);
--style-border-avatar: 4px solid var(--sevene-background);
--style-border-always: 1px solid var(--sevene-card-border);
--sevene-logo-color:linear-gradient(215deg,#4584ff 0%,#cf0db9 100%);
--sevene-snackbar-time:5s;
--sevene-card-twikoo-bg:#ffff;
--style-border:1px solid var(--sevene-card-border);
--style-border-always:1px solid var(--sevene-card-border);
--style-border-hover:1px solid var(--sevene-main);
--style-border-hover-always:1px solid var(--sevene-main);
--style-border-dashed:1px dashed var(--sevene-theme-op);
--hover-border:2px solid var(--sevene-theme);
--border:2px solid var(--sevene-card-border);
--sevene-border-radius: 8px;
--sevene-logo-color: linear-gradient(215deg, #4584ff 30%, #ff7676 70%);
}
.page .layout, .post .layout {
max-width: 1450px;
}
::selection {
background:#0079ff;
color:#f7f7f7
}
a {
color:#99a9bf;
text-decoration:none;
transition:all .2s ease 0s;
overflow-wrap:break-word
}
a:hover {
color:#307af6
}
[data-theme=light] {
--sevene-theme:#425AEF;
--sevene-theme-op:#4259ef23;
--sevene-blue:#425AEF;
--sevene-red:#D8213C;
--sevene-pink:#FF7C7C;
--sevene-green:#28a63f;
--sevene-yellow:#c28b00;
--sevene-yellow-op:#d99c001a;
--sevene-orange:#e38100;
--sevene-fontcolor:#363636;
--Sevene-background:#f7f9fe;
--sevene-reverse:#000;
--sevene-secondbg: #f1f3f8;
--sevene-theme-op-deep: #4259efdd;
--Sevene-maskbg:rgba(255,255,255,0.6);
--Sevene-maskbgdeep:rgba(255,255,255,0.85);
--Sevene-ahoverbg:#F7F7FA;
--Sevene-lighttext:var(--sevene-main);
--Sevene-secondtext:rgba(60,60,67,0.6);
--Sevene-scrollbar:rgba(60,60,67,0.4);
--Sevene-card-btn-bg:#edf0f7;
--Sevene-post-blockquote-bg:#fafcff;
--Sevene-post-tabs-bg:#f2f5f8;
--Sevene-secondbg:#f1f3f8;
--sevene-shadow-nav:0 5px 12px -5px rgba(102,68,68,0.05);
--Sevene-card-bg:rgb(0, 0, 0);
--senvene--bg:white;
--Sevene-card-bg-op:var(--sevene-black-op);
--Sevene-card-bg-none:rgba(255,255,255,0);
--sevene-shadow-lightblack:0 5px 12px -5px rgba(102,68,68,0.00);
--sevene-shadow-light2black:0 5px 12px -5px rgba(102,68,68,0.00);
--sevene-card-border:#e3e8f7;
--sevene-shadow-border:0 8px 16px -4px #2c2d300c;
--style-border-forever:2px solid var(--sevene-main);
--Sevene-sun-moon:#ff7242;
--sevene-card-twikoo-bg:#ffff;
--sevene-theme-op: #4259ef23;
--sevene-hovertext: var(--sevene-theme);;
--sevene-card-bg-white: #fff;
--sevene-shadow-lightblack: 0 5px 12px -5px rgba(102, 68, 68, 0);
--sevene-shadow-light2black: 0 5px 12px -5px rgba(102, 68, 68, 0);
--sevene-card-border: #c0c6d8;
--sevene-footer-background: #f1f3f8;
--sevene-rightmenu-color: #18171d;
}
[data-theme="dark"] {
--sevene-theme:#0084FF;
--sevene-theme-op:#0084FF23;
--sevene-blue:#0084FF;
--sevene-red:#FF3842;
--sevene-pink:#FF7C7C;
--sevene-green:#57bd6a;
--sevene-yellow:#ffc93e;
--sevene-yellow-op:#ffc93e30;
--sevene-orange:#ff953e;
--sevene-fontcolor:#F7F7FA;
--Sevene-background:#18171d;
--sevene-reverse:#fff;
--sevene-secondbg: #ffffff00;
--Sevene-maskbg:rgba(0,0,0,0.6);
--Sevene-maskbgdeep:rgba(0,0,0,0.85);
--Sevene-hovertext:#0A84FF;
--Sevene-ahoverbg:#fff;
--Sevene-lighttext:#f2b94b;
--Sevene-secondtext:#a1a2b8;
--Sevene-scrollbar:rgba(200,200,223,0.4);
--Sevene-card-btn-bg:#30343f;
--Sevene-post-blockquote-bg:#000;
--Sevene-post-tabs-bg:#121212;
--Sevene-secondbg:#00000000;
--sevene-shadow-nav:0 5px 20px 0px rgba(28,28,28,0.4);
--Sevene-card-bg:#ffffff;
--Sevene-card-bg-op:var(--sevene-white-op);
--Sevene-card-bg-none:#1d1b2600;
--sevene-shadow-lightblack:0 5px 12px -5px rgba(102,68,68,0.0);
--sevene-shadow-light2black:0 5px 12px -5px rgba(102,68,68,0.0);
--sevene-card-border:#42444a;
--sevene-shadow-border:0 8px 16px -4px #00000050;
--style-border-forever:2px solid var(--Sevene-lighttext);
--Sevene-sun-moon:var(--sevene-yellow);
--sevene-card-twikoo-bg:rgb(0, 0, 0);
--senvene--bg:rgb(0, 0, 0);
--sevene-theme-op-deep: #0084ffdd;
--sevene-theme: #0084ff;
--sevene-theme-op: #0084ff23;
--sevene-blue: #0084ff;
--sevene-red: #ff3842;
--sevene-pink: #ff7c7c;
--sevene-green: #57bd6a;
--sevene-fontcolor: #f7f7fa;
--sevene-background: #18171d;
--sevene-reverse: #fff;
--Sevene-maskbg: rgba(0, 0, 0, 0.6);
--Sevene-maskbgdeep: rgba(0, 0, 0, 0.85);
--sevene-hovertext: #0a84ff;
--Sevene-ahoverbg: #fff;
--Sevene-lighttext: #f2b94b;
--Sevene-secondtext: #a1a2b8;
--Sevene-scrollbar: rgba(200, 200, 223, 0.4);
--Sevene-card-btn-bg: #30343f;
--Sevene-post-blockquote-bg: #000;
--Sevene-post-tabs-bg: #121212;
--sevene-secondbg: #30343f;
--sevene-shadow-nav: 0 5px 20px 0px rgba(28, 28, 28, 0.4);
--sevene-card-bg-white: #1d1b26;
--sevene-shadow-lightblack: 0 5px 12px -5px rgba(102, 68, 68, 0);
--sevene-shadow-light2black: 0 5px 12px -5px rgba(102, 68, 68, 0);
--sevene-card-border: #42444a;
--sevene-footer-background: #30343f;
--sevene-rightmenu-color: #ffffff;
}
.hexo-douban-item{
border-bottom:none!important;
background:var(--heo-card-bg);
border:var(--style-border);
box-shadow:var(--heo-shadow-border);
border-radius:12px;
margin:8px 0;
height:160px;
min-height:160px!important;
width:49%;
overflow:hidden
}
@media screen and (min-width:1300px){
.hexo-douban-item{
width:32%
}
}
#hexo-douban-item3{
display:flex;
flex-direction:row;
flex-wrap:wrap;
justify-content:space-between
}
.hexo-douban-item .hexo-douban-picture a{
padding:0!important
}
.hexo-douban-item .hexo-douban-picture img{
margin:0!important;
height:100%!important
}
.hexo-douban-tabs{
display:none
}
.hexo-douban-title a{
border-bottom:0!important
}
.hexo-douban-title{
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap
}
.hexo-douban-title a:hover{
color:var(--heo-lighttext)!important;
background:var(--heo-none)!important
}
.hexo-douban-paginati