WordPress 非插件使用 markdown

集成后的功能如下:

  1. 实时预览 即见即所得,甚至你可以作为一个专门的 markdown 编辑器来使用
  2. 代码高亮 程序员最爱,需要在前台做代码高亮
  3. 代码分离 markdown 的代码和 html 代码分离,互不影响,并且会将 markdown 代码保存下来,以便下次继续编辑。

集成步骤

  1. 下载 marked.js 和 makemarkdown.js
  2. 将下好的两个文件放倒对应主题下面的 js 目录下

marked.js 是一套 js 库,用于将 markdown 代码转换成 html。makemarked.js 用于监听文本框事件,来实时调用 marked.js 来转换 markdown 代码。

  1. 把下面的代码复制到function.php
// 增加 markdown 功能到后台编辑器add_action( 'admin_menu', 'create_markdown' );add_action( 'save_post', 'save_markdown', 10, 2 );function create_markdown() {    add_meta_box( 'markdown_box', 'Markdown', 'markdown_html', 'post', 'normal', 'high' );}function markdown_html( $object, $box ) { ?>        <textarea name="markdown" id="markdown" cols="60" oninput ="markdownEditorChanged()" rows="50" >            <?php echo htmlspecialchars (get_post_meta( $object->ID, 'markdown', true )); ?>        </textarea><?php }function save_markdown( $post_id, $post ) {    if ( !current_user_can( 'edit_post', $post_id ) )        return $post_id;    $meta_value = get_post_meta( $post_id, 'markdown', true );    $new_meta_value = $_POST['markdown'];    if ( $new_meta_value && '' == $meta_value )        add_post_meta( $post_id, 'markdown', $new_meta_value, true );    elseif ( $new_meta_value != $meta_value )        update_post_meta( $post_id, 'markdown', $new_meta_value );    elseif ( '' == $new_meta_value && $meta_value )        delete_post_meta( $post_id, 'markdown', $meta_value );}function markdown_script() {    wp_enqueue_script('markdown', get_template_directory_uri() . '/js/marked.js' );    wp_enqueue_script('makemarkdown', get_template_directory_uri() . '/js/makemarkdown.js');}add_action( 'admin_enqueue_scripts', 'markdown_script');

参考文章: wordpress 深度集成 markdown

---------下面是测试---------

这是Header1

这是Header2

这是Header3

这是Header4

这是Header5
这是Header6

晓峰残月的链接

引用 笨鸟先飞 勤定补拙

下面是代码

print("Hello World")
文章链接:https://www.sbkko.com/wordpress-feichajianshiyong-markdown.html
文章标题:WordPress 非插件使用 markdown
文章版权:SBKKO 所发布的内容,部分为原创文章,转载请注明来源,网络转载文章如有侵权请联系我们!

给TA打赏
共{{data.count}}人
人已打赏
WP文章

Wordpress 网站搭建及性能监控方法详解!

2016-2-22 12:46:00

WP文章

初识WORDPRESS后台框架泰坦框架 TITAN FRAMEWORK

2016-4-16 1:13:00

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索