Astro-Yi 图片功能预览
原生显示远程链接 Copy

原生显示本地图片
Copy

自定义本地图片
修改图片为 html 写法,设置style="width:…
Astro-Yi主题配置和写作技巧
介绍 这是我开发的 Astro 开源博客主题,名字叫Astro-Yi,喜欢的可以点个 star 啦,感谢关注,欢迎 PR!
配置 Astro-Yi
必不可少的配置(必须)
Astro 项目的配置文件在/astro.config.mjs,其中有一些配置是必不可少的:
Copy
exp…
基于Astro框架的博客网站添加Sitemap
安装 @astro/sitemap 先在 Astro 下安装官方 sitemap 包:
Copy
# Using NPM
npx astro add sitemap
# Using Yarn
yarn astro add sitemap
# Using PNPM
pnpm…
在Astro中实现图片懒加载
思考 关于图片懒加载的方法,基于Intersection Observer API实现起来很简单。
但是在 Astro 中实现起来却不同,因为这里要实现的不是网站上的图片懒加载,而是博客中图片的懒加载。
Astro 中的博客是使用 Markdown 写的,在…
Vscode添加Markdown-Frontmatter代码片段
使用此博客主题推荐使用 Vs Code 或者 Obsdian,这两个工具都可以很好的添加文件 Frontmatter 信息和 Markdown 文字写作,并且支持 Picgo 文件上传工具。 个人想法,用 markdown 写博客,能够自动生成基础的 frontmatter…
Markdown添加mathjax支持
添加 Mathjax Copy
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {
inlineMath: [
["\\(", "…
基于Astro框架开发的博客
更多的博客介绍可以查看Astro-Yi 主题配置和写作技巧 2024-03-20
收录官方主题仓库
2024-03-18
添加了很多新功能:
国际化
code 显示增强
图片显示增强
代码优化
移除了首页的 header 显示
升级了 waline@3
优化了最近更新时间功能…
给hexo配置cdn服务
经常看到服务商推 cdn 加速服务,但是一直没动手给自己的网站整上过,今天闲来无事看看到底怎么一回事,到底好不好用。 上来先把钱花了再说,正好腾讯最近有CDN 优惠活动,花了我¥12 整了个 100G / 年的。
购买完成之后,腾讯云控制台 -> 内容分发服务 -> 域名管理 -…
关于maupassant主题显示文章异常的一些思考
之前在使用这个主题的时候,就发现如果在文章开头插入代码块,在渲染的时候会让整个首页样式异常,但是当时没有深究这个问题,也认为在文章第一行就写代码块确实不太优雅。 现在有点空闲时间了准备给主题修修 bug,又发现有人提这个问题,就正好研究一下。
为什么会出现这个问题?
随意新建一个…

hexo(6)maupassant主题问题汇总
目前文章中的很多 bug 新版本已经修复啦 问题一:mathjax 的 cdn 问题
每次启动的时候都能在控制台中看到报错如下:
WARNING: cdn.mathjax.org has been retired. Check https://www.mathjax.org…

hexo(5)maupassant主题扩展功能
添加底部 badge 首先为项目中添加更多颜色样式类,会后面定制化页面样式准备。
在themes/maupassant/source/css/style.scss中的头部添加颜色样式如下:
Copy
$theme-colors: (
"golden-sand"…
hexo(4)安装评论功能
2022-11-17 更新 今天发现博客的评论功能忽然失效了,发现是版本更新的问题。之前一直都是引用的最新的 waline 代码,现在改成引入固定版本的 waline 代码了。
在themes/maupassant/layout/_partial/comments.pug文件中修…

hexo(3)安装插件
本地搜索插件 安装
Copy
npm install hexo-generator-searchdb --save
配置
在根目录下的_config.yml文件夹中,新增如下内容:
Copy
search:
path: search.xml
field: post…
hexo(2)配置主题
上一篇文章中已经让我们的博客的可以简单的撰写和部署了,但是在一些细节上还有很有很多地方可以优化。接下来一点一点完善我们的博客内容。 设置头像
hexo 可以在很多地方存放图片和文件,但是每一篇文章都放在一个文件夹或者每一篇文章对应一个图片文件夹,都会让我们的项目变的越来越臃肿…
hexo(1)下载和部署
中文官网地址:hexo 安装 hexo
前提:
自有服务器
域名
安装nodejs
安装git
Copy
# 切换源,后续使用cnpm安装包,可以在无法正常安装上包的时候使用
npm install -g cnpm --registry=https://registry…