分享

如何用Markdown来写WordPress博客?

 昵称29978867 2016-12-19

作为一个 Markdown 写作者,面对 WordPress 博客程序不支持 Markdown ,是一件很苦恼的事。但对于爱折腾的唐建鹏博客来说这点小事 so easy !于是便有了这篇文章!

原理

在 post 页面添加一个 textarea,监听 input 事件,事件中将文本框的内容取出,用 marked.js 进行转码,将转码后的 html 放在系统中的 tinyMCE 中。 在保存时将 textarea 中的文本存入 media data 中,下次可以继续编辑。

折腾

下载

将 markdown.js 和 makemaekdown.js 放入当前主题的 JS 文件夹

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

  • 在 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" style="width: 100%; height:100%"><?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');

OK,本文就是源于 Markdown .

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多