马上注册，免费下载更多dz插件网资源。
您需要 登录 才可以下载或查看，没有账号？立即注册
×
https://blog.csdn.net/m0_62749151/article/details/120818533
前言最近需要给discuz加上markdown的解析功能，发现插件实在太贵了要199元，个人觉得这个功能应该不难实现，于是决定自己DIY。本次使用的解析插件是marked。
介绍markedMarked.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>
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<i>.innerHTML = '<div class="custom-markdown">' + marked(markdown_tags<i>.textContent) + "</div>"; } }</script>
3、在discuz后台配置-界面－编辑器设置－Discuz代码添加一项markdown，找个图标设置上去，可用和显示按钮勾上，详情配置如下
标签：markdown替换内容：<markdown>{1}</markdown>解释：markdown代码参数个数：1参数提示语：markdown嵌套次数：1允许的用户组：全选
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}
5、在/home/www/template/你的模板/forum/viewthread.htm中的<!--{hook/viewthread_top}-->上面加入下面的代码
<link rel="stylesheet" href="./template/default/common/markdown.min.css">
6、此时发布帖子，点击markdown图标后插入markdown代码，这里注意最好用纯文本模式。
7、发布的最终效果，如图
代码高亮优化请到风洞网官网查看原文。
参考文章https://www.jianshu.com/p/11eed27e60cd
https://www.tecbbs.com/forum.php?mod=viewthread&tid=6737
关注风洞网微信公众号！
©DZ插件网所发布的一切资源仅限用于学习和研究目的；不得将上述内容用于商业或者非法用途，否则，一切后果请用户自负。
网站部分内容来源于网络，版权争议与本站无关。您必须在下载后的24个小时之内，从您的电脑中彻底删除上述内容。如果您喜欢该程序，请支持正版软件，得到更好的正版服务。
您在本站任何的赞助购买、下载、查阅、回复等行为等均表示接受并同意签订《DZ插件网免责声明协议》。
如有侵权请邮件与我们联系处理: discuzaddons@vip.qq.com 并出示相关证明以便删除。敬请谅解！
|
|
![极简论坛手机模板 正式版(wubian_app004)[X3.5 手机模板]](https://static.dz-x.net/block/91/91c3a580ee0261a0c237943ac9728856.jpg)
极简论坛手机模板 正式版(wubian_app004)[X170 人气#Discuz!插件模板![视频解析播放大仙版 视频解析大仙版 3.3(v2_mediamaxpro)[DZ万能视频解析播放器]](https://static.dz-x.net/block/31/31b916cbede47ae8313a045c5d225d9b.jpg)
视频解析播放大仙版 视频解析大仙版 3.3(v21189 人气#Discuz!插件模板![邮箱订阅 自适应版(newsletter)[资源更新邮件推送 营销推广 定向推广 快速触达]](https://static.dz-x.net/block/71/719aa39c2f81ce8b584d55af991c26de.jpg)
邮箱订阅 自适应版(newsletter)[资源更新邮37 人气#Discuz!插件模板![【西瓜】分类信息 同城头条2.0(xigua_hb.89864)[组件]](https://static.dz-x.net/block/41/41456a3f72f7e17b72cbe50f60e47185.jpg)
【西瓜】分类信息 同城头条2.0(xigua_hb.89162 人气#Discuz!插件模板
可可微信购买会员用户组 132.240826 个人免6474 人气#Discuz!插件模板![即时聊天客服 即时聊天客服 1.7(bphp_chat)[无需单独部署服务端 即装即用 免加好友 在线即时聊天 支持离线留言 微信邮箱通知]](https://static.dz-x.net/block/81/8192f2de9bb37ac1ed53bc33454b1112.jpg)
即时聊天客服 即时聊天客服 1.7(bphp_chat)101 人气#Discuz!插件模板
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
照妖镜
