启用 bbPress 中的 TinyMCE 可视化编辑器

VFX大学 bbPress 论坛系统(bbPress Forum System) 启用 bbPress 中的 TinyMCE 可视化编辑器

标签: 

正在查看 0 条回复
  • 作者
    帖子
    • #333

      追光
      管理员

      这段代码的作用是为 WordPress 的 bbPress 论坛系统启用简洁的可视化编辑器(TinyMCE),并进行中文本地化和功能简化。适用于需要在论坛中使用基础文字样式(如加粗、列表、引用等)但又不希望加载完整 WordPress 编辑器的场景。


      🧾 背景介绍

      WordPress 默认在后台或文章编辑中使用 TinyMCE 可视化编辑器(也就是你看到的图文排版工具)。

      但在 bbPress 中,默认只提供一个纯文本框,用户无法直观地添加格式。

      为了增强论坛编辑体验,又不影响性能,**使用 TinyMCE 的轻量版(teeny 模式)**是最佳做法。


      ✅ 功能说明

      这段代码实现了以下功能:

      1. ✅ 启用 bbPress 中的 TinyMCE 可视化编辑器

      add_filter('bbp_after_get_the_content_parse_args', function ($args) {
          return array_merge($args, [
              'teeny'     => true,   // 启用简化版 TinyMCE
              'tinymce'   => true,   // 启用可视化编辑器
              'quicktags' => true    // 启用 HTML 快捷按钮(如 <b>、<i>)
          ]);
      }, 20);

      • teeny: 启用 TinyMCE 的轻量模式(只保留常用功能)

      • tinymce: 开启可视化编辑器

      • quicktags: 显示 HTML 标签快捷按钮(文本模式下)


      2. ✅ 配置 TinyMCE 编辑器语言与工具栏按钮(中文支持)

      add_filter('tiny_mce_before_init', function ($init) {
          return array_merge($init, [
              'language'      => 'zh_CN',  // 使用中文语言包
              'toolbar1'      => 'formatselect,bold,italic,underline,blockquote,alignleft,aligncenter,alignright,bullist,numlist,link,unlink',
              'toolbar2'      => '',       // 第二行工具栏留空
              'menubar'       => false,    // 隐藏菜单栏
              'statusbar'     => true,     // 显示状态栏(如字数)
              'wpautop'       => true,     // 自动换段
              'paste_as_text' => true      // 粘贴内容为纯文本
          ]);
      });

      • 中文语言包必须 WordPress 本身是 zh_CN 安装

      • 精简 toolbar,仅保留最常用的排版功能

      • 可防止用户粘贴富文本内容导致排版错乱


      3. ✅ 默认激活可视化编辑器(避免默认进入 HTML 模式)

      add_action('wp_footer', function () {
          if (function_exists('bbp_is_single_topic') &&
              (bbp_is_single_topic() || bbp_is_topic_edit() || bbp_is_reply_edit())) {
              echo "<script>jQuery(function($){ if(window.switchEditors){ $('.wp-editor-wrap').removeClass('html-active').addClass('tmce-active'); } });</script>";
          }
      });

      • 默认 bbPress 会显示纯文本编辑器(HTML 模式)

      • 这段脚本将自动激活 **“可视化”**模式,提高编辑体验

      • 兼容新建/编辑主题或回复页面


      🛠️ 用法总结

      你只需将这段代码放入主题的 functions.php 或自定义插件中,即可在 bbPress 中实现轻量中文可视化编辑器,无需额外安装插件:

      ✅ 推荐放置路径:

      /wp-content/themes/你的子主题/functions.php


      🔚 效果展示

      功能

      效果

      可视化编辑器

      有,支持加粗、列表等

      中文界面

      默认显示

      是,可视化优先

      插件依赖

      无(纯代码实现)


      如需进一步增强(如代码高亮、插图、表格),可结合 Prism.jsmarkdown 插件。

      如需更轻量,也可以只保留 quicktags 快捷标签按钮。需要我可继续精简。

正在查看 0 条回复
  • 在下方一键注册,登录后就可以回复啦。