标签 Markdown 下的文章

PHP代码:HTML转markdown

目前网上的Markdown相关的转换器和编辑器都是markdown转html。对于web程序已经保存到数据库的html数据如果反解析为markdown则需要一点点小技巧。

我是将保存文章内容的字段分为了content_html和content_text两个字段,content_html存储html数据。content_text存储markdown原始数据。

前端我采用了stackoverflow的pagedown编辑器,可以将markdown转为html。保存的时候两种数据同时存入数据库。修改的时候在前端将修改好的markdown数据也同时更新了html数据。

我们就差一步,如果将以前老的html数据一次性保存到数据库的另外一个content_text字段呢?我用的是Dom Christie哥的to-markdown,一个html转markdown的PHP class。我用如下代码批量的把文章的内容添加上了markdown数据:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<?php
mysql_connect("localhost", "test", "111111") or
die("Could not connect: " . mysql_error());
mysql_select_db("test");
mysql_query("set names utf8");
require_once(dirname(__FILE__) . '/HTML_To_Markdown.php');
//连接数据库
require_once 'conn.php';
$query = sprintf("select * from posts");
$r = mysql_query($query);
$i=0;
while($row = mysql_fetch_assoc($r))
{
$markdown = new HTML_To_Markdown($row['content_html']);
$markdown = addslashes($markdown);
$result = mysql_query($q = sprintf("update posts set content_text='%s' where id=%s",$markdown, $row["id"]));
if($result)
{
echo '保存成功'.$row["id"];
}
else
{
echo '保存失败'.$row["id"];
}
}

Greasemonkey脚本:让wp-markdown编辑器和预览并列显示,适合大屏幕显示器

开始用wp-markdown写博文之后,发现了一个弊端。在编辑非常长的文章的时候。鼠标要狂滚动到下面的预览窗口查看效果。非常不方便。完全没有把我的24寸大显示器的空间给利用起来。

以下四行代码让wp-markdown编辑器和预览窗口水平显示。刚测试了发现仅支持我的1920X1080分辨率。不知道怎么兼容其他分辨率。没办法,CSS学得太烂了。不过小分辨率的显示器并列显示就显得太窄了点。

// ==UserScript==
// @name WP-Markdown parallel view
// @version 0.1
// @namespace localhost
// @author tunpishuang
// @description Let WP-Markdown preview section parallel to editor
// @match http://tunps.com/wp-admin/*
// @grant none
// ==/UserScript==


var editor = document.getElementById("wp-content-editor-container");
var preview = document.getElementById("wmd-previewcontent");
editor.setAttribute('style', 'float:left;width:50%');
preview.setAttribute('style', 'float:left;width:45%;clear:none');

将以上代码保存为markdownStyle.user.js。 修改@match为你的博客域名。放入Chrome或Firefox浏览器即可。