hexo matery 代码块问题

在hexo matery中遇到的代码块问题 解决

在这里插入图片描述

  • 出现代码块分割,并出现数字的情况

之前网上的设置prism_plugin插件的方式不管用,搞那些css的也不管用

后面发现解决方式其实很简单
在这里插入图片描述
按照如图所示的方式设置truefalse即可解决

Solved!!

修改之后的成果

在这里插入图片描述


文章新一次更新于 2022.8.16 终于是解决了这个便秘的问题。

其实在这种高亮之后,并不是真的高亮,而且会出现代码块转义的情况,原来的 {} 代码中会有 {} 的转义字符。

解决方法

从 Hexo5.0 版本开始自带了 prismjs 代码语法高亮的支持,本主题对此进行了改造支持。

如果你的博客中曾经安装过 hexo-prism-plugin 的插件,那么你须要执行 npm uninstall hexo-prism-plugin 来卸载掉它,否则生成的代码中会有 {} 的转义字符。

然后,修改 Hexo 根目录下 _config.yml 文件中 highlight.enable 的值为 false,并将 prismjs.enable 的值设置为 true,主要配置如下:

highlight:
  enable: false
  line_number: true
  auto_detect: false
  tab_replace: ''
  wrap: true
  hljs: false
prismjs:
  enable: true
  preprocess: true
  line_number: true
  tab_replace: ''

有问题的小伙伴们可以私信我,这个真的是太坑了。


后续内容更新于 2022.9.4 ;可以移步至我博客观看 hexo 的踩坑合集 https://drun1baby.github.io/2022/03/31/Hexo-%E8%B8%A9%E5%9D%91%E5%90%88%E9%9B%86/

闪烁之狐大佬也说了对应的一些解决手段,我这里懒得复制粘贴了,师傅们可以去我的博客观看

<think>好的,我需要帮助用户找到美化GitHub个人网站的方法或教程。首先,用户提到了几个引用,其中引用[1]、[3]、[4]都涉及到主题和网站搭建的相关内容。用户希望了解如何美化GitHub个人网站,包括设计风格、主题定制以及相关教程。 首先,我应该整理已有的引用内容。引用[1]是关于personal-jekyll-theme项目,这可能是一个Jekyll主题,适合用来搭建个人网站。引用[3]提到了使用HexoGithub和Coding搭建博客,并提到了butterfly和matery主题,还提到升级版主题如yilia和yelee。引用[4]是GitHub语法主题生成器的教程,可能涉及代码高亮样式定制。 接下来,用户的问题是如何美化GitHub个人网站,所以需要涵盖主题选择、定制方法、插件或工具推荐,以及相关教程。根据引用[3],Hexo和Jekyll都是静态网站生成器,常与GitHub Pages结合使用。因此,可以建议用户选择Jekyll或Hexo的主题,并参考提供的项目进行安装和配置。 引用[1]中的personal-jekyll-theme项目可以作为Jekyll主题的一个例子,用户可以通过克隆仓库并修改配置来应用主题。引用[3]中的butterfly和matery主题适用于Hexo,用户可能需要安装Hexo并按照教程进行设置。此外,引用[4]的语法主题生成器可能帮助用户自定义代码块的显示样式,增强美观度。 另外,引用[2]提到了WordPress插件,但GitHub Pages不支持PHP,所以可能不适用。但可以忽略这部分,专注于静态站点生成器。 用户可能需要步骤指导,比如选择主题、安装主题、配置设置、自定义样式等。同时,可以推荐一些美化技巧,如使用CSS自定义、添加动态效果、优化布局等。此外,引用提供的教程链接可以帮助用户进一步学习。 需要确保回答结构清晰,分点说明,并引用相关来源。可能的问题包括如何选择主题、如何安装、如何定制CSS、如何优化SEO等。生成的问题应围绕这些方面展开。 最后,检查是否符合用户的要求:使用中文,正确引用,结构清晰,包含相关问题和回答。确保所有LaTeX格式正确,但在这个问题中可能不需要数学公式,所以可能没有LaTeX内容。但需注意如果有公式出现,需用$或$$包裹。</think>### 如何美化 GitHub 个人网站 美化 GitHub 个人网站的核心在于**主题选择**和**定制化配置**。以下是具体方法: --- #### 1. **选择适合的主题** 静态网站生成器(如 Jekyll、Hexo)提供丰富的开源主题,可快速搭建美观页面: - **Jekyll 主题** 引用[1]中的 `personal-jekyll-theme` 是一个简洁的示例,支持 Markdown 和自定义布局。 操作步骤: ```bash git clone https://gitcode.com/gh_mirrors/pe/personal-jekyll-theme ``` 修改 `_config.yml` 配置文件和页面模板即可[^1]。 - **Hexo 主题** 引用[3]提到的 `butterfly` 和 `matery` 主题功能丰富,支持动态效果和响应式设计。安装方法: ```bash npm install hexo-theme-butterfly ``` 在 Hexo 配置文件中指定主题名称即可应用[^3]。 --- #### 2. **自定义样式与功能** - **CSS 定制** 通过覆盖主题的 CSS 文件调整颜色、字体和布局。例如,在 Jekyll 中修改 `assets/css/main.scss`,添加自定义样式: ```css .header { background: linear-gradient(90deg, #4b6cb7, #182848); } ``` - **动态效果增强** 使用 JavaScript 库(如 `anime.js` 或 `AOS`)为页面添加滚动动画或加载效果。引用[3]中的 `yelee` 主题便集成了此类特性。 - **代码高亮优化** 引用[4]的 GitHub 语法主题生成器可生成与 GitHub 风格一致的代码块样式。安装后,通过替换主题的语法高亮 CSS 文件实现[^4]。 --- #### 3. **插件与工具推荐** - **SEO 优化** 类似引用[2]提到的 Yoast SEO(针对 WordPress),Jekyll/Hexo 可使用 `jekyll-seo-tag` 或 `hexo-generator-seo` 插件优化搜索引擎收录[^2]。 - **性能优化** 使用 `jekyll-minifier` 或 `hexo-all-minifier` 压缩 HTML/CSS/JS,提升加载速度。 --- #### 4. **部署与持续更新** - 通过 GitHub Actions 自动化构建和部署,确保每次提交后网站自动更新。 - 定期备份配置文件(如引用[2]提到的 UpdraftPlus 理念),避免定制内容丢失[^2]。 ---
评论 24
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值