Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

使用说明系列(部署中有问题此issue讨论) #16

Open
removeif opened this issue Apr 14, 2020 · 63 comments
Open

使用说明系列(部署中有问题此issue讨论) #16

removeif opened this issue Apr 14, 2020 · 63 comments

Comments

@removeif
Copy link
Owner

removeif commented Apr 14, 2020

使用主题前请仔细阅读主题README.md,以及主题配置文件_config.yml!!!

使用主题前请仔细阅读主题README.md,以及主题配置文件_config.yml!!!

使用主题前请仔细阅读主题README.md,以及主题配置文件_config.yml!!!

@removeif removeif pinned this issue Apr 14, 2020
@removeif
Copy link
Owner Author

removeif commented Apr 14, 2020

1.首页文章折叠方法

适当位置放入标签 <!-- more -->此标签之后的部分在首页自动影藏,此标签之前的部分为摘要,会放入文章的description字段中,此部分最好对此文章作总结,以便于于更好的seo。

@removeif
Copy link
Owner Author

removeif commented Apr 15, 2020

2.首页个人资料 一言句子

首页个人资料,左边一言句子 配置文件中可以关闭,也可以点击句子自动切换一言句子。

@removeif
Copy link
Owner Author

removeif commented Apr 15, 2020

3.关于加密文章的使用以及缺少依赖包的问题

  • 完全使用readme中提供的文件package.json内容替换博客目录下的package.json,并非主题目录下的package.json!!!
{
  "name": "hexo-site",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "build": "hexo generate",
    "clean": "hexo clean",
    "deploy": "hexo deploy",
    "server": "hexo server"
  },
  "hexo": {
    "version": "5.2.0"
  },
  "dependencies": {
    "bulma-stylus": "^0.8.0",
    "hexo": "^5.0.0",
    "hexo-blog-encrypt": "^3.0.13",
    "hexo-component-inferno": "^0.8.2",
    "hexo-deployer-git": "^2.1.0",
    "hexo-generator-archive": "^1.0.0",
    "hexo-generator-category": "^1.0.0",
    "hexo-generator-index": "^2.0.0",
    "hexo-generator-tag": "^1.0.0",
    "hexo-renderer-ejs": "^1.0.0",
    "hexo-renderer-inferno": "^0.1.3",
    "hexo-renderer-marked": "^3.0.0",
    "hexo-renderer-stylus": "^2.0.0",
    "hexo-server": "^2.0.0"
  }
}
  • 删除博客目录下node_modules已有依赖包
  • 博客目录下执行 npm install 安装依赖包
  • 安装完后如果要使用置顶功能,需要重新修改node_modules中相应文件

@removeif
Copy link
Owner Author

removeif commented Apr 15, 2020

4.关于widget的增减

  • 如果要去掉一个widget,只需要在主题配置文件_config.yml中注释 相应的widget,如不需要邮件订阅的widget则注释如下
    # Tags widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: right
        type: tags
    # Google FeedBurner email subscription widget configurations
    #-
        # Where should the widget be placed, left sidebar or right sidebar
        #position: right
        #type: subscribe_email
        # Hint text under the email input
        #description: 输入邮箱开始订阅,更博后邮件通知!
        # Feedburner ID
        #feedburner_id: removeifFeedsId
  • 注意一定要把该节点的 -这个符号一起注释掉,否则会报错
  • 节点中position: right代表是在左还是在右显示

@removeif
Copy link
Owner Author

5.logo图片设置方法

从网站 https://www.qt86.com/ 设计一张带字透明的图片,放到 主题img中,配置文件中相应logo地方引用此图片就可以了

@removeif
Copy link
Owner Author

removeif commented Apr 16, 2020

6.配置文件注释注意问题!!!

配置前面有此 - 的需要把此 - 一起注释掉,否则编译会报错!

@removeif
Copy link
Owner Author

removeif commented Apr 16, 2020

7.gitalk 评论使用

  • 配置文件中开启如下配置
comment:
    type: gitalk
    owner: removeif         # (required) GitHub user name
    repo: blog_comment          # (required) GitHub repository name
    client_id: 46a9f3481b46ea0129d8     # (required) OAuth application client id
    client_secret: 79c7c9cb847e141757d7864453bcbf89f0655b24 # (required) OAuth application client secret
    admin: ['removeif']
    create_issue_manually: true
    distraction_free_mode: false
    has_hot_recommend: true # 是否有热门推荐
    has_latest_comment: true #是否有最新评论
  • owner:github 账号名,如URL中 https://github.com/removeif 中的removeif
  • repo:放评论的仓库,需要自己去GitHub创建一个public类型的仓库
  • client_id,client_secret 申请
    找到如图位置

    新建app

    填写完内容,然后点击register xxx 创建完成

    找到刚刚创建的app,点击进去找到相关client_id,client_secret参数
  • admin 管理员参数,博客文章里第一次点进去需要初始化issue,需要用此账号登录 初始化,可填多个,如 ['removeif','dogzi'],同时配置create_issue_manually: true,此时才能点击初始化,自动创建issue。如下文章中点击以下登录,然后在点击创建issue!
  • 以上点击初始化issue后 首页评论 数99+才会变成对应正常的评论数

@removeif
Copy link
Owner Author

removeif commented Apr 18, 2020

8.首页增加banner,热门推荐和banner只能存在一个,如果两个都有热门推荐优先

感谢水寒提供的教程
开启方法,配置中开启以下配置

has_banner: false #首页是否有banner,true-是,false-否,如果配置了热门推荐显示热门推荐,banner配置数据在json_data/banner.json里按照配置格式配置好,至少三条

数据文件在themes/amazing/source/json_data/banner.json 中,配置成对应格式就好,图片长宽一致
效果如下 https://dogzi.fun/

@removeif
Copy link
Owner Author

9.针对热门推荐没标题的问题

如图所示:
image
此页面是page 友链页面,生成issue的时候page没有title,如下对应issue
image
可以自己手动加上,只需要编辑issue标题。比如上面的友链issue标题改成
友链 - 帕奇笔记
就可以了,注意-前后有个空格

@removeif
Copy link
Owner Author

removeif commented May 22, 2020

10.添加自定义widget

  • 主题 文件中_config.yml 添加
    - 
        position: right
        type: notice
        contents: 
            1: 2019.8.15 <a href="https://github.com/removeif/hexo-theme-amazing" target="_blank">主题开源</a>
            2: 2020.5.20 添加公告widget
            3: 2020.5.21 公告测试
  • include/schema/common/widgets.json 文件中添加
,  {
                "$ref": "/widget/notice.json"
   }
  • include/schema/widget/notice.json 添加
{
    "$schema": "http://json-schema.org/draft-07/schema#",
    "$id": "/widget/notice.json",
    "description": "Notice links widget configurations",
    "type": "object",
    "properties": {
        "type": {
            "type": "string",
            "const": "notice"
        },
        "contents": {
            "type": "object",
            "description": "notic contents",
            "patternProperties": {
                ".+": {
                    "type": "string",
                    "description": "URL of the site"
                }
            },
            "examples": [
                {
                    "1": "2019.05.23 建站"
                }
            ],
            "nullable": true
        }
    },
    "required": [
        "type"
    ]
}
  • i18文件 languages/en.yml, languages/zh-CN.yml添加 widget 名称
 notice: 'Notice'
 notice: '通知'
  • layout/widget/notice.jsx widget 宽主要样式,以及获取相关内容
const { URL } = require('url');
const { Component } = require('inferno');
const { cacheComponent } = require('../util/cache');

class Links extends Component {
    render() {
        const { title, contents } = this.props;
        return <div class="card widget">
            <div class="card-content">
                <div class="menu">
                    <h3 class="menu-label">{title}</h3>
                    <ul>
                        {Object.keys(contents).map(key => {
                            return <li>
                                <span>
                                    <span dangerouslySetInnerHTML={{ __html: contents[key] }}></span>
                                </span>
                            </li>;
                        })}
                    </ul>
                </div>
            </div>
        </div>;
    }
}

module.exports = cacheComponent(Links, 'widget.links', props => {
    const { helper, widget } = props;
    if (!Object.keys(widget.contents).length) {
        return null;
    }
    return {
        title: helper.__('widget.notice'),
        contents: widget.contents
    };
});

效果如下:
image

  • 注意
    每个地方的notice名字一定要对应上。
    详细的代码diff

@autorecap
Copy link
Contributor

为什么Adsense不写成config而是是新的branch?

@removeif
Copy link
Owner Author

为什么Adsense不写成config而是是新的branch?

config里面有一个Adsense,但是只有一个widget,回头有空加进master branch,可配置多个adsense单元

@mrnuclear8
Copy link

博主您好,您的模板很棒。请问为什么我的友链模块为什么用不了,就归档模块可以用。附我的域名:www.nuclear.ink

@removeif
Copy link
Owner Author

removeif commented Oct 9, 2020

博主您好,您的模板很棒。请问为什么我的友链模块为什么用不了,就归档模块可以用。附我的域名:www.nuclear.ink

看下这条放相应的文件没有

@removeif
Copy link
Owner Author

removeif commented Oct 10, 2020

其他页面放置博客中的位置如下,仓库中有博客分支,不知道怎么当独使用主题的,可以直接clone site分支然后hexo c hexo g hexo s 就可以看效果了
image

@hellosyl
Copy link

博主你好,我的最新文章列表中 文章的首图不能缩放不知道是哪里出问题了。fork的master分支
blog:https://hellosyl.github.io/
image

@removeif
Copy link
Owner Author

removeif commented Oct 12, 2020

博主你好,我的最新文章列表中 文章的首图不能缩放不知道是哪里出问题了。fork的master分支
blog:https://hellosyl.github.io/
image

可以尝试以下操作,替换博客下面的这个包依赖文件(并非主题文件夹里)的内容

然后:
删除博客目录下node_modules已有依赖包
博客目录下执行 npm install 安装依赖包
安装完后如果要使用置顶功能,需要重新修改node_modules中相应文件

@mrnuclear8
Copy link

博主你好,我的最新文章列表中 文章的首图不能缩放不知道是哪里出问题了。fork的master分支
blog:https://hellosyl.github.io/
image

兄弟解决了吗,删除node_modules容易,可是怎么把原来的环境都下回来呢?

@hellosyl
Copy link

博主你好,我的最新文章列表中 文章的首图不能缩放不知道是哪里出问题了。fork的master分支
blog:https://hellosyl.github.io/
image

可以尝试以下操作,替换博客下面的这个包依赖文件(并非主题文件夹里)的内容

然后:
删除博客目录下node_modules已有依赖包
博客目录下执行 npm install 安装依赖包
安装完后如果要使用置顶功能,需要重新修改node_modules中相应文件

hexo g报错,有一个模块版本不匹配,改成这个版本可以正常编译了(错误提示的需要这个版本):"hexo-component-inferno": "^0.10.0",
可惜问题依然存在。
我的环境:hexo: 5.2.0,hexo-cli: 4.2.0,node: 12.10.0,npm: 6.14.8

@hellosyl
Copy link

博主你好,我的最新文章列表中 文章的首图不能缩放不知道是哪里出问题了。fork的master分支
blog:https://hellosyl.github.io/
image

兄弟解决了吗,删除node_modules容易,可是怎么把原来的环境都下回来呢?

还没有;环境恢复的话执行下面命令重新下载安装依赖就回来了,如果怕不是之前的样子你可以先备份一下根目录的package.json文件,他就是安装这个文件的配置下载对应模块的。

npm install

@removeif
Copy link
Owner Author

博主你好,我的最新文章列表中 文章的首图不能缩放不知道是哪里出问题了。fork的master分支
blog:https://hellosyl.github.io/
image

兄弟解决了吗,删除node_modules容易,可是怎么把原来的环境都下回来呢?

还没有;环境恢复的话执行下面命令重新下载安装依赖就回来了,如果怕不是之前的样子你可以先备份一下根目录的package.json文件,他就是安装这个文件的配置下载对应模块的。

npm install

@mrnuclear8 是在不行这样操作,clone site 分支

git clone -b site https://github.com/removeif/hexo-theme-amazing.git testBlog
cd testBlog/
npm install
hexo c
hexo g
hexo s

执行以上步骤就可以,在把自己的md文章那些拷贝到对应文件夹,以及主题配置文件替换成自己的就好了
执行以上操作后就能看到如下:也没有错
image

@removeif
Copy link
Owner Author

已同步 icarus最新代码

@hellosyl
Copy link

已同步 icarus最新代码

优秀!哈哈同步了就好了!nice
我还有一个影响不大的小bug,加密的文章输入密码进去后,里面的代码段没有了折叠和复制按钮,这个其实也还好,影响不大。

image

@hellosyl
Copy link

博主你好,我的最新文章列表中 文章的首图不能缩放不知道是哪里出问题了。fork的master分支
blog:https://hellosyl.github.io/
image

兄弟解决了吗,删除node_modules容易,可是怎么把原来的环境都下回来呢?

现在解决了,主题作者同步了 icarus最新代码,我这边也同步了一下就没问题了。

@mrnuclear8
Copy link

OK,解决了,谢谢博主的耐心教导

@ghost
Copy link

ghost commented Oct 29, 2020

友链没法直接引用其他项目里的json吗
https://johnsonran.github.io/Blog/friend/

@Shimmer66
Copy link

关于 碎碎念页面未成功显示,
c
备注:

  • 碎碎念index页面:已添加脚本文件n
  • 系统环境,x

碎碎念的使用readme里有说明,需要单独的页面里面配置issue信息,页面在hexo-theme-amazing/ex_pages/source/self-talking/ ,把self-talking文件夹放到你的博客source目录中
感谢!

@BestBonBai
Copy link

博主您好,我把总的_config.yml(非主题)里的语言设置成了英语,但是self-talking下的gitalk评论还是显示的中文日期,应该怎么修改啊?其他的评论都是显示的英文...

self-talking:
Screen Shot 2021-01-08 at 22 39 05
其他的gitalk:
Screen Shot 2021-01-08 at 22 39 21

@removeif
Copy link
Owner Author

removeif commented Jan 9, 2021

博主您好,我把总的_config.yml(非主题)里的语言设置成了英语,但是self-talking下的gitalk评论还是显示的中文日期,应该怎么修改啊?其他的评论都是显示的英文...

self-talking:
Screen Shot 2021-01-08 at 22 39 05
其他的gitalk:
Screen Shot 2021-01-08 at 22 39 21

需要手动设置一下,在碎碎念index.md文件中添加一行language:'en',如下:

<script>
    $.getScript("/js/gitalk_self.min.js", function () {
        var gitalk = new Gitalk({
            language:'en',
            clientID: '46a9f3481b46ea0129d8',
            clientSecret: '79c7c9cb847e141757d7864453bcbf89f0655b24',
            id: '666666',
            repo: 'issue_database',
            owner: 'removeif',
            admin: "removeif",
            createIssueManually: true,
            distractionFreeMode: false
        });
        gitalk.render('comment-container1');
    });
</script>

@BestBonBai
Copy link

BestBonBai commented Jan 9, 2021

博主您好,我把总的_config.yml(非主题)里的语言设置成了英语,但是self-talking下的gitalk评论还是显示的中文日期,应该怎么修改啊?其他的评论都是显示的英文...
self-talking:
Screen Shot 2021-01-08 at 22 39 05
其他的gitalk:
Screen Shot 2021-01-08 at 22 39 21

需要手动设置一下,在碎碎念index.md文件中添加一行language:'en',如下:

<script>
    $.getScript("/js/gitalk_self.min.js", function () {
        var gitalk = new Gitalk({
            language:'en',
            clientID: '46a9f3481b46ea0129d8',
            clientSecret: '79c7c9cb847e141757d7864453bcbf89f0655b24',
            id: '666666',
            repo: 'issue_database',
            owner: 'removeif',
            admin: "removeif",
            createIssueManually: true,
            distractionFreeMode: false
        });
        gitalk.render('comment-container1');
    });
</script>

感谢博主回复,我照着添加了,但是好像还是显示的中文,浏览器缓存我都清理了一遍...是不是还有哪里没修改啊?

修改的碎碎念index.md:
Screen Shot 2021-01-09 at 10 47 08
更新效果:
Screen Shot 2021-01-09 at 10 46 05

》 解决了,我发现这个日期格式是单独的,我直接修改了js文件里的gitalk_self.min.js中的className = 'gt-comment-date'的格式。把‘YYYY年MM月...’去掉了中文。效果如下:
Screen Shot 2021-01-11 at 10 54 06

不知道这个方法是不是最合适的, 欢迎补充 😂

@removeif
Copy link
Owner Author

@BestBonBai

不知道这个方法是不是最合适的, 欢迎补充 😂

看起来不是很好的方法,回头我试试看看有没有优雅的解决这个中文的方式

@removeif
Copy link
Owner Author

@BestBonBai

不知道这个方法是不是最合适的, 欢迎补充 😂

看起来不是很好的方法,回头我试试看看有没有优雅的解决这个中文的方式

已经解决,拉取最新的两个js,配置按着上面说的配置就好

@BestBonBai
Copy link

已经解决,拉取最新的两个js,配置按着上面说的配置就好

谢谢大神, 学习了 😄

@cjjch
Copy link

cjjch commented Jan 21, 2021

您好,部署在了gitee上,却显示不出看板娘,配置是开启的,网络也没有问题,请问该怎么解决,谢谢。网站https://cjj123cjj.gitee.io/last
Screenshot_2021-01-21-12-57-46-65_5b19eeae754b18421d48054e4a8744e7
Screenshot_2021-01-21-12-58-29-69_84d3000e3f4017145260f7618db1d683
Screenshot_2021-01-21-13-00-00-73_84d3000e3f4017145260f7618db1d683

@cjjch
Copy link

cjjch commented Jan 30, 2021

有点冒犯,很想要你这个看板娘,我有主题了,请问怎么移植😂

@removeif
Copy link
Owner Author

removeif commented Feb 4, 2021

有点冒犯,很想要你这个看板娘,我有主题了,请问怎么移植😂

github上有live2d的使用教程,你搜一下就知道了

@SakuraMuxia
Copy link

大佬,您好,问您一个关于gitalk的问题,按照您上边的步骤操作,登陆初始化完成之后,一直出现这个问题是什么情况
image
就连我登录你们的博客,评论也是这样。

@removeif
Copy link
Owner Author

大佬,您好,问您一个关于gitalk的问题,按照您上边的步骤操作,登陆初始化完成之后,一直出现这个问题是什么情况
image
就连我登录你们的博客,评论也是这样。

这个应该是你那边网络的问题,我这边暂时不会这样

@GISFSDE
Copy link

GISFSDE commented Mar 22, 2021

image
同上

@removeif
Copy link
Owner Author

image
同上

@MrDemonlxl @SakuraMuxia
image
评论中加个配置项就可以解决了

@GISFSDE
Copy link

GISFSDE commented Mar 23, 2021

图像
同上

@MrDemonlxl @SakuraMuxia 评论中加个配置项就可以解决了
图像

有用非常感谢

@xiaoyingzhi
Copy link

博主你好!请问一下如何禁止深色模式?能否让他在晚上的时候不自动加载成深色模式?

@removeif
Copy link
Owner Author

博主你好!请问一下如何禁止深色模式?能否让他在晚上的时候不自动加载成深色模式?

这里改下
以下代码

if (isNightTemp == null || isNightTemp == undefined) {
        if (isNightRange("19:00", "23:59") || isNightRange("00:00", "07:00")) {
            isNightTemp = 'true';
        } else {
            isNightTemp = 'false';
        }
        localStorage.setExpire("night", isNightTemp, expireTime1H);
    }

改成

if (isNightTemp == null || isNightTemp == undefined) {
        isNightTemp = 'false';
        localStorage.setExpire("night", isNightTemp, expireTime1H);
    }

@werkeytom
Copy link

博主你好,想知道评论用valine不用gitalk的话,最新评论(我一直显示加载中)和每篇博文的评论数统计应该怎么改(默认99+)

@ZtfCoder
Copy link

ZtfCoder commented May 7, 2021

aaa
我安装完成后出现以下错误,貌似是js加载不了,怎么回事

@sakiraven
Copy link

请问顶部导航栏is-active异常是什么情况,永远只有当前刷新页为active。
拉取的master分支

截屏2021-05-28 下午10 23 03

@removeif
Copy link
Owner Author

请问顶部导航栏is-active异常是什么情况,永远只有当前刷新页为active。
拉取的master分支

截屏2021-05-28 下午10 23 03

这个是pjax的问题,之前有网友提过,暂时没想到解决方案

@sakiraven
Copy link

请问顶部导航栏is-active异常是什么情况,永远只有当前刷新页为active。
拉取的master分支

截屏2021-05-28 下午10 23 03

这个是pjax的问题,之前有网友提过,暂时没想到解决方案

谢谢您的回答那我就不纠结了

@scutLMG
Copy link

scutLMG commented Jul 9, 2021

你好,我也自己用gitalk实现了一个像你博客中碎碎念的页面,但是我想知道你是怎么实现你的评论样式的呢,就是只显示文字内容和时间,没有头像。请求指点一二。

@scutLMG
Copy link

scutLMG commented Jul 10, 2021

另外还想问下,导航栏的固定要怎么修改呢?因为我已经对自己的博客修改很多了,就不能fork你的模板了,怕改不回去,所以想继续修改。

@lzwqjh
Copy link

lzwqjh commented Nov 23, 2021

请问我想把网易云歌单换成自己的应该怎么做

@removeif
Copy link
Owner Author

请问我想把网易云歌单换成自己的应该怎么做

配置文件中,替换你自己歌单的id就行了,歌单id可以百度下怎么获取

side_music_netease_id: 2364053447 #侧边栏网易云歌单id

@removeif
Copy link
Owner Author

你好,我也自己用gitalk实现了一个像你博客中碎碎念的页面,但是我想知道你是怎么实现你的评论样式的呢,就是只显示文字内容和时间,没有头像。请求指点一二。

直接在css里写样式,把不要的部分隐藏了

@lzwqjh
Copy link

lzwqjh commented Nov 23, 2021 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests