就在这篇里记录下博客改造记录吧😊
pelican
这次用Pelican主要是因为看它自带的主题很舒服(KK说自己改,可是我不会前端啊😭),然后Python写的也比较好修改,于是就入坑了,记录下修改点:
1.它的本地图片必须要加{attach}
标签,这和编辑器不一致,因此在读文件时加个硬核的过滤,另外为了让小图片默认居中,对这类图片添加了默认的div标签:
--- a /pelican/readers.py
+++ b /pelican-4.6.0/pelican/readers.py
@@ -334,10 +334,8 @@ class MarkdownReader(BaseReader):
self._source_path = source_path
self._md = Markdown(**self.settings['MARKDOWN'])
with pelican_open(source_path) as text:
+ # 修改原始格式为attach格式
+ text = re.sub(r'(!\[.*?\])\(([^{].+?)\)', r'\1({attach}\2)', text)
+ text = re.sub(r'(<img.*?src\s*=\s*)"([\w/.-]+)"', r'\1"{attach}\2"', text, flags=re.I)
+ text = re.sub(r'(<img[^>]*?)(/>|></img>)', r'<div align="center">\1\2</div>', text, flags=re.I) # 添加居中对齐
content = self._md.convert(text)
-
if hasattr(self._md, 'Meta'):
metadata = self._parse_metadata(self._md.Meta)
2.它的图片不会缩放,这里也直接加个硬核的CSS:
--- a /pelican/themes/notmyidea/static/css/main.css
+++ b /pelican-4.6.0/pelican/themes/notmyidea/static/css/main.css
@@ -26,9 +26,6 @@ body {
padding: 0;
text-align: left;
}
+img {
+ width: 100%;
+}
/* Headings */
h1 {font-size: 2em }
语法高亮有的地方会认为是错误,把这种警告删掉:
--- a /pelican/themes/notmyidea/static/css/pygment.css
+++ b /pelican-4.6.0/pelican/themes/notmyidea/static/css/pygment.css
@@ -8,9 +8,9 @@
.err {
- border:1px solid #FF0000;
+ /* border:1px solid #FF0000; */
}
如果不知道某种特殊的代码应该用什么高亮可参考写语法高亮提示pygments-lexer
3.默认最新文章会展开,把它去掉:
--- a/pelican/themes/notmyidea/templates/index.html
+++ b/pelican-4.6.0/pelican/themes/notmyidea/templates/index.html
@@ -5,7 +5,7 @@
{% for article in articles_page.object_list %}
{# First item #}
+ {% if loop.first and not articles_page.has_previous() and false %} {# 此处修改为永假来禁止最新文章全文展开 #}
- {% if loop.first and not articles_page.has_previous() %}
<aside id="featured" class="body">
<article>
4.添加TOC,使用Markdown扩展可生成目录,但它会直接添加到文章头部:
# from https://cloudbytes.dev/snippets/add-a-table-of-contents-using-markdown-in-pelican
MARKDOWN = {
"extension_configs": {
# Needed for code syntax highlighting
"markdown.extensions.codehilite": {"css_class": "highlight"},
"markdown.extensions.extra": {},
"markdown.extensions.meta": {},
# This is for enabling the TOC generation
"markdown.extensions.toc": {"title": "TOC"},
},
"output_format": "html5",
}
之后可使用extract_toc 将其提取到article.toc里,之后编辑模板可放到合适位置:
{% if article.toc %}
<nav class="toc">
{{ article.toc }}
</nav>
{% endif %}
画图
很多东西避免不了画图,记录下一些作图的语法,一般用drawio就好啦。
时序图
研究了好久还是PlantUML好用
结构关系
很多代码的结构体关系比较复杂,最后决定先用代码处理所需的结构体,再手动修正dot再输出。
制表
markdown本身的表格语法还是蛮简单蛮好用的,但是它不支持单元格合并/添加标题等功能,于是我习惯使用html制表,有时也将markdown的先转成html的表格在添加格式,可使用markdowntohtml。对于复杂格式的表格,可以先使用Excel编辑好,再通过No-Cruft Excel to HTML Table Converter转换。