fix: 优化 Mermaid 换行符处理 - PHP 端添加关键字后自动插入换行符 - 使用 data-mermaid-code 属性传递原始代码 - JS 端优先读取 data 属性 - 添加更详细的调试日志
This commit is contained in:
16
footer.php
16
footer.php
@@ -235,9 +235,19 @@
|
|||||||
|
|
||||||
let pre = element.parentElement;
|
let pre = element.parentElement;
|
||||||
|
|
||||||
// 获取代码内容,保留换行符
|
// 优先从 data-mermaid-code 属性获取代码
|
||||||
|
|
||||||
let code = getTextWithLineBreaks(element);
|
let code = element.getAttribute('data-mermaid-code');
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// 如果没有 data 属性,尝试从内容获取
|
||||||
|
|
||||||
|
if (!code) {
|
||||||
|
|
||||||
|
code = getTextWithLineBreaks(element);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
// 去除首尾空白
|
// 去除首尾空白
|
||||||
|
|
||||||
@@ -277,6 +287,8 @@
|
|||||||
|
|
||||||
console.log('Contains newlines:', code.indexOf('\n') !== -1);
|
console.log('Contains newlines:', code.indexOf('\n') !== -1);
|
||||||
|
|
||||||
|
console.log('First 200 chars:', code.substring(0, 200));
|
||||||
|
|
||||||
// 创建 Mermaid 容器
|
// 创建 Mermaid 容器
|
||||||
|
|
||||||
let mermaidDiv = document.createElement('div');
|
let mermaidDiv = document.createElement('div');
|
||||||
|
|||||||
@@ -3577,8 +3577,15 @@ function the_content_filter($content){
|
|||||||
$code = html_entity_decode($code, ENT_QUOTES | ENT_HTML5, 'UTF-8');
|
$code = html_entity_decode($code, ENT_QUOTES | ENT_HTML5, 'UTF-8');
|
||||||
// 去除首尾空白
|
// 去除首尾空白
|
||||||
$code = trim($code);
|
$code = trim($code);
|
||||||
// 返回带换行符的代码块
|
// 如果没有换行符,尝试恢复(WordPress 可能把换行符转换成了空格)
|
||||||
return '<pre><code class="language-mermaid">' . htmlspecialchars($code, ENT_QUOTES, 'UTF-8') . '</code></pre>';
|
// 检测常见的 Mermaid 关键字后应该有换行
|
||||||
|
$keywords = ['flowchart', 'graph', 'sequenceDiagram', 'classDiagram', 'stateDiagram', 'erDiagram', 'journey', 'gantt', 'pie'];
|
||||||
|
foreach ($keywords as $keyword) {
|
||||||
|
// 匹配关键字后跟方向(TD/LR等)或其他内容,但没有换行符的情况
|
||||||
|
$code = preg_replace('/(' . preg_quote($keyword, '/') . '\s+(?:TD|LR|RL|BT|TB))\s+(?![\r\n])/', "$1\n", $code);
|
||||||
|
}
|
||||||
|
// 返回带换行符的代码块,使用 data 属性存储原始代码
|
||||||
|
return '<pre><code class="language-mermaid" data-mermaid-code="' . esc_attr($code) . '">' . esc_html($code) . '</code></pre>';
|
||||||
},
|
},
|
||||||
$content
|
$content
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user