记录hexo无法加载图片及修改yilia主题组件

作者 : 开心源码 本文共1453个字,预计阅读时间需要4分钟 发布时间: 2022-05-13 共138人阅读

1-处理图片无法加载

之前使用vs code在md文件直接使用插件粘贴传入图片,发现启动后无法加载图片的情况,看了很多网上的处理方法都不行,不知道是不是我电脑问题,通过反复摸索最终我还是使用官方文档的图片标签
首先找到项目根目录的_config.yml文件,修改post_asset_folder

修改post_asset_folder: true

而后hexo clean清一下,hexo n “XXX” (你自己设置的新博客文章名),而后根目录下的source/_posts会有XXX.md和XXX文件夹(两个是同名的)

image.png

{% asset_img 图片名.图片后缀 [title] %}

而后hexo g生成文件hexo s启动服务 即可以看到图片了
假如之前安装过hexo-asset-image需要卸载,我的电脑是卸载完才能显示

npm uninstall hexo-asset-image --save

2-更换主页的部件

2.1-更换头像和网页图标还有主页名字 在项目根目录路径\themes\yilia\source新建一个assets文件夹(自己设置名字),把头像和网页图标的图片放进去

我是配置到码云上的,https://gitee.com/客户名/myBlog

在项目根目录的\themes\yilia,打开_config.yml,找到两个属性,把路径改为#favicon: "/assets/favicon.png"favicon: "/myBlog/assets/favicon.png"#你的头像urlavatar: "/myBlog/assets/me.png"

以上路径跟注释中的路径不一样(网上的方法是用注释中的代码),假如失败请切换不同方法
更换主页名字在根目录下的_config.yml,修改

image.png
2.2实现主页中点击所有文章弹框

npm uninstall hexo-generator-json-content --save

项目根目录_config.yml增加以下代码即可以了

jsonContent:    meta: false    pages: false    posts:      title: true      date: true      path: true      text: false      raw: false      content: false      slug: false      updated: false      comments: false      link: false      permalink: false      excerpt: false      categories: false      tags: true

image.png

2.3修改主页网站点击图标 在项目根目录路径\themes\yilia文件中打开_config.yml,设置里面参数就好

image.png

2.4更换头像上面区域颜色和点击所有文章弹框后的颜色 打开yilia目录下的_config.yml文件,修改里面参数

# 样式定制 - 一般不需要修改,除非有很强的定制欲望…style:  # 头像上面的背景颜色    header: 'linear-gradient(to right, #f83600 0%, #f9d423 100%)'  # 右滑板块背景  slider: 'linear-gradient(-225deg, #5D9FFF 0%, #B8DCFF 48%, #6BBBFF 100%)'# slider的设置slider:  # 能否默认开展tags板块  showTags: true

回到命令行hexo clean ,hexo g,hexo s,查看 效果图

image.png

查看过没有问题即可以hexo d推送到码云了

码云+hexo搭建博客

说明
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » 记录hexo无法加载图片及修改yilia主题组件

发表回复