返回列表 发帖
查看: 1397|回复: 5

Discuz 手动添加 markdown 代码支持教程!

37

主题

70

回帖

114

积分

渐入佳境

贡献
0 点
金币
2 个
发表于 2023-3-29 10:56:35 | 显示全部楼层 |阅读模式
https://blog.csdn.net/m0_62749151/article/details/120818533

前言

最近需要给discuz加上markdown的解析功能,发现插件实在太贵了要199元,个人觉得这个功能应该不难实现,于是决定自己DIY。本次使用的解析插件是marked。

介绍marked

Marked.js 是一个用 JavaScript 实现的、功能齐全的 Markdown 解析器和编译器。可以非常方便的在线编译 Markdown 代码为 HTML 并直接显示,并且支持完全的自定义各种格式。

最终效果

DEMO地址(base64):aHR0cHMlM0EvL3d3dy5iZXdpbmR3YXJkLmNvbS90aHJlYWQtNjYtMS0xLmh0bWw=

实现过程

1、在/home/www/template/你的模板/common/header.htm中加入下面的代码

<script src="https://cdn.bootcdn.net/ajax/libs/marked/2.1.3/marked.min.js"></script>
  • 1

2、在/home/www/template/你的模板/common/footer.htm中加入下面的代码

<script>    window.onload = function () {        var markdown_tags = document.getElementsByTagName("markdown");        for (var i = 0; i < markdown_tags.length; i++) {            markdown_tags.innerHTML = '<div class="custom-markdown">' + marked(markdown_tags.textContent) + "</div>";        }    }</script>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8

3、在discuz后台配置-界面-编辑器设置-Discuz代码添加一项markdown,找个图标设置上去,可用和显示按钮勾上,详情配置如下

标签:markdown替换内容:<markdown>{1}</markdown>解释:markdown代码参数个数:1参数提示语:markdown嵌套次数:1允许的用户组:全选
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

4、将下面的css代码保存成一个markdown.min.css文件,放到/template/default/common/目录下

.parsedown-markdown{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;line-height:1.5}.parsedown-markdown h1,.parsedown-markdown h2,.parsedown-markdown h3,.parsedown-markdown h4,.parsedown-markdown h5,.parsedown-markdown h6{margin-bottom:16px;font-weight:600;line-height:1.25}.parsedown-markdown h1,.parsedown-markdown h2{padding-bottom:.3em;border-bottom:1px solid #eaecef}.parsedown-markdown h1{font-size:2em}.parsedown-markdown h2{font-size:1.5em}.parsedown-markdown h3{font-size:1.25em}.parsedown-markdown h4{font-size:1em}.parsedown-markdown h5{font-size:.875em}.parsedown-markdown h6{color:#6a737d;font-size:.85em}.parsedown-markdown em{font-style:italic}.parsedown-markdown hr{height:.2em;padding:0;margin:24px 0;border:0;background-color:#e1e4e8}.parsedown-markdown p,.parsedown-markdown blockquote,.parsedown-markdown table,.parsedown-markdown ol,.parsedown-markdown ul,.parsedown-markdown dl,.parsedown-markdown pre{margin-top:0;margin-bottom:15px}.parsedown-markdown li{margin-left:2px}.parsedown-markdown ul>li{list-style-type:disc}.parsedown-markdown ol>li{list-style-type:decimal}.parsedown-markdown pre{background-color:#f6f8fa;border-radius:6px;overflow:auto;padding:4px;font-size:85%;line-height:1.45;border:none !important}.parsedown-markdown p>code,.parsedown-markdown li>code{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;padding:.2em .4em;margin:0;font-size:85%;background-color:rgba(27,31,35,.05);border-radius:6px}.parsedown-markdown pre>code{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace}.parsedown-markdown a{color:#0645ad;text-decoration:none}.parsedown-markdown a:visited{color:#0b0080}.parsedown-markdown a:hover{color:#06e}.parsedown-markdown a:active{color:#faa700}.parsedown-markdown a:focus{outline:thin dotted}.parsedown-markdown a:hover,a:active{outline:0}.parsedown-markdown ::-moz-selection{background:rgba(255,255,0,0.3);color:#000}.parsedown-markdown ::selection{background:rgba(255,255,0,0.3);color:#000}.parsedown-markdown a::-moz-selection{background:rgba(255,255,0,0.3);color:#0645ad}.parsedown-markdown a::selection{background:rgba(255,255,0,0.3);color:#0645ad}.parsedown-markdown blockquote{color:#6a737d;padding:0 1em;margin:0;border-left:.25em #dfe2e5 solid}.parsedown-markdown ul,.parsedown-markdown ol{padding-left:2em;margin-left:0}.parsedown-markdown li p:last-child{margin:0}.parsedown-markdown dd{margin:0 0 0 2em}.parsedown-markdown img{border:0;-ms-interpolation-mode:bicubic;vertical-align:middle;max-width:100%}.parsedown-markdown table{margin:.25em auto;width:98%;table-layout:auto;overflow:auto;border-spacing:0;border-collapse:collapse}.parsedown-markdown table thead{background-color:#d9e2df}.parsedown-markdown table tr:nth-child(2n){background-color:#f6f8fa}.parsedown-markdown table tr{border-top:1px solid #c6cbd1}.parsedown-markdown table th{font-weight:600}.parsedown-markdown table td,.parsedown-markdown table th{padding:6px 13px;border:1px solid #c6cbd1}
  • 1

5、在/home/www/template/你的模板/forum/viewthread.htm中的<!--{hook/viewthread_top}-->上面加入下面的代码

<link rel="stylesheet" href="./template/default/common/markdown.min.css">
  • 1

6、此时发布帖子,点击markdown图标后插入markdown代码,这里注意最好用纯文本模式。

7、发布的最终效果,如图

代码高亮优化

请到风洞网官网查看原文。

参考文章

https://www.jianshu.com/p/11eed27e60cd
https://www.tecbbs.com/forum.php?mod=viewthread&tid=6737

关注风洞网微信公众号!

回复

使用道具 举报

0

主题

3

回帖

8

积分

初学乍练

贡献
0 点
金币
5 个
发表于 2023-3-29 11:08:22 | 显示全部楼层
看到代码脑壳痛
全站仪租赁 www.cqzgl.cn/
回复 支持 反对

使用道具 举报

37

主题

70

回帖

114

积分

渐入佳境

贡献
0 点
金币
2 个
 楼主| 发表于 2023-3-29 11:09:34 | 显示全部楼层
BBcode常用标签(入门)
前言:
BBCode是Bulletin Board Code的缩写,有译为“BB代码”者,属于轻量级标记语言(Lightweight Markup Language)的一种,如字面上所显示的,它主要是使用在BBS、论坛、Blog等网络应用上。BBCode最初由Ultimate Bulletin Board讨论区系统发展出来,因此常见UBB代码的称呼。BBCode的语法通常为[標記]的形式,即语法左右用两个中括号包围,以作为与正常文字间的区别。系统解译时遇上中括弧便知道该处是BBcode,会在解译结果输出到客户端时转换成最为通用的HTML语法。[1]

BBcode有两个主要目的:
  • 便利:
最为通用的HTML语法虽然已相当简单易懂,但仍需要一定时间学习后才能上手,因此BBcode采用更为直觉易学的语法,转换为HTML的工作则交由系统来代劳。
  • 安全:
过去BBS、论坛、Blog也曾经设计开放HTML语法让用户使用,但却派生出语法输入错误时造成整页排版错乱、有心人利用HTML语法进行XSS式的攻击与破坏等问题。由于BBcode的转换为系统机械式的行为,所以可以有效避免人为输入错误的问题,而BBcode为预先设计好的语法,也就是说意图以BBcode达成所有的HTML语法效果是不可能的,相当于一种语法过滤,如此便可避免所有可能发生的恶意破坏。[2]

尽管现在(Z世代)年龄的人大多都使用的是社交平台自带的富文本编辑器(比如知乎的编辑器),但是BBcode仍然在各个论坛(尤其是国内基于Discuz的论坛)广泛使用。

[3]加粗:
粗体字 Bold text

斜体:
斜体字 Italic

删除线:
删除线

下划线:
下划线

改变字号:
[size=n]大小可变 #注:1≤n≤7

URL:(邮件地址类似)
可直接插入,Discuz会识别。
当然,你也可以这么写:
示例网址

引用:
《我三》是《艺三》难以企及的标杆

列表(无序):
    开始列表
  • 列表项目
  • 列表项目

  • 列表(有序):
    [olist]开始有序号列表
  • 列表项目A
  • 列表项目B
  • [/olist]

    飞行:
    [fly]飞行文字[/fly]

    滚动:
    [move]滚动文字[/move]
    参考
    • ^来自Wiki-BBcode
    • ^同[1]
    • ^来自于x64论坛-explore的帖子 https://bbs.x64.site/forum.php?mod=viewthread&tid=2160&fromuid=171





    回复 支持 反对

    使用道具 举报

    6

    主题

    368

    回帖

    484

    积分

    应用开发者

    贡献
    16 点
    金币
    13 个
    QQ
    发表于 2023-4-1 18:31:33 | 显示全部楼层
    楼主是否可以写成插件?修改文件不方便升级。
    Thinkphp、Discuz开发、PHP环境搭建以及解决网站各种疑难杂症。联系QQ:502251257
    回复 支持 反对

    使用道具 举报

    4

    主题

    62

    回帖

    77

    积分

    渐入佳境

    贡献
    0 点
    金币
    9 个
    发表于 2023-4-3 15:55:01 | 显示全部楼层
    看不懂是啥意思
    4K电影下载 www.4ktt.com
    魔爪论坛 www.91mz.cc
    回复 支持 反对

    使用道具 举报

    7

    主题

    29

    回帖

    47

    积分

    初学乍练

    贡献
    0 点
    金币
    5 个
    发表于 2023-10-12 09:10:45 来自手机 | 显示全部楼层
    没想到能在dz搜到自己发的文章{:4_95:}
    回复 支持 反对

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    • 关注公众号
    • 有偿服务微信
    • 有偿服务QQ

    手机版|小黑屋|Discuz! 官方交流社区 ( 皖ICP备16010102号 |皖公网安备34010302002376号 )|网站地图|star

    GMT+8, 2024-5-4 00:45 , Processed in 0.040463 second(s), 5 queries , Redis On.

    Powered by Discuz! W1.0 Licensed

    Cpoyright © 2001-2024 Discuz! Team.

    关灯 在本版发帖
    有偿服务QQ
    有偿服务微信
    返回顶部
    快速回复 返回顶部 返回列表