Busuanzi counter cannot be centered
- Install via pnpm
pnpm install hexo-shokax-busuanzi --save- Add custom CSS
Create custom.styl in the source_data directory at the root of your blog
/* Some custom styles */
/* Fix the issue where busuanzi is not centered */
#busuanzi-wrap
width: 100% !important
text-align: center !important
display: block !important
hexo-shokax-create-time
Install using the readme tutorial on GitHub
Important: You also need to configure this in the config.yml in the theme directory
createTime: "2026/01/01 00:00:00"hexo-renderer-aether
Since the new code block rendering plugin does not yet support expand/collapse functionality, long code blocks can affect the preview, so an additional external collapse/expand button is added.
- Add: \themes\Shokax\scripts\generaters\code-collapse.js
'use strict';
const fs = require('fs');
const path = require('path');
hexo.extend.generator.register('code-collapse', function(locals) {
const sourceFile = path.join(hexo.source_dir, '_data', 'code-collapse.js');
const destPath = 'code-collapse.js';
// Check whether the source file exists
if (!fs.existsSync(sourceFile)) {
return [];
}
// Read the file contents
const content = fs.readFileSync(sourceFile, 'utf8');
return {
path: destPath,
data: content
};
});
- Add at the end: \themes\Shokax\layout_partials\head\head_com.pug
// Add at the end of the code
// Script for the code block collapse feature
script(src=url_for('/code-collapse.js') defer)- Add styles: \source_data\custom.styl
/* Code block collapse feature */
.code-block-wrapper
position: relative
margin: 1rem 0
border-radius: 0.25rem
&.collapsed
&::after
content: ''
position: absolute
bottom: 0
left: 0
right: 0
height: 3rem
background: linear-gradient(transparent, rgba(0, 0, 0, 0.3))
pointer-events: none
border-radius: 0 0 0.25rem 0.25rem
/* Collapse button - top-right corner of the code block */
.code-toggle-btn-corner
position: absolute
top: 0.5rem
right: 2.5rem
background: rgba(0, 0, 0, 0.4)
border: 1px solid rgba(255, 255, 255, 0.3)
color: #fff
padding: 0.35rem 0.5rem
border-radius: 0.2rem
cursor: pointer
font-size: 0.85rem
font-weight: bold
transition: all 0.2s ease
z-index: 10
line-height: 1
&:hover
background: rgba(0, 0, 0, 0.6)
border-color: rgba(255, 255, 255, 0.5)
&:active
transform: scale(0.95)
cateCards homepage featured pagination
- Since this is the upgraded version of shoka, unlike the original shoka, you can't simply create cover.jpg in the category directory and be done
- Refer to the following for the configuration in the config.yml at the theme root directory:
cateCards:
- slug: Study
cover: Study/cover.jpg
- slug: Life
cover: Life/cover.jpg
If you enjoyed this, leave a comment~