WMD Editor Wordpress Plugin

Pulled from the WMD main site.

WMD is a simple, lightweight HTML editor for blog comments, forum posts, and basic content management. You can add WMD to any textarea with one line of code. Add live preview with one line more. WMD works in nearly all modern browsers, and is now completely free to use. The next release will be open source under an MIT-style license.

This is not a WYSIWYG editor. Writing HTML to look a certain way can make your text less accessible to blind people, search engines, mobile users, and feed readers. HTML describes a document’s logical structure—not its appearance. It just wasn’t built for WYSIWYG.

So WMD is something new: a Wysiwym Markdown editor.

  • Wysiwym stands for What You See Is What You Mean. WMD produces clean semantic HTML, leaving presentation details like fonts and colors up to style sheets. But you’re not left in the dark about cosmetics; as you type, WMD’s live preview shows you exactly what your text will look like after the current styles have been applied.
  • Markdown is a simple markup language that’s as easy to read and write as plain-text email. WMD uses Markdown as an input format, converting it into HTML behind the scenes. You can also mix raw HTML with Markdown, so the full expressiveness of HTML is always there if you need it.

WMD is just as easy to use as any WYSIWYG editor, so you don’t need to know anything about Markdown or HTML to write clean, semantically meaningful markup. You click the buttons, and WMD writes the Markdown.

Live Preview Feature

In order to use the live preview feature (see demo below), you’ll need to edit your template file comments.php.

You’ll need to add this html


<h2 class="previewtitle">Live Comment Preview</h2>
<div class="wmd-preview"></div>

to the bottom of that file, just above the endif; call. So it should appear much like this:

1
2
3
4
<?php endif; // If registration required and not logged in ?>
<h2 class="previewtitle">Live Comment Preview</h2>
<div class="wmd-preview"></div>
<?php endif; // if you delete this the sky will fall on your head ?>

You can lose or modify the <h2> tag to better suit your design needs.

Download

WMD Editor Plugin 1.0

Suggestions on how to improve the plugin code are always welcome. :)

6 Comments For This Post

  1. Steven Says:

    Great Plugin! This is exactly what a comment field should act and appear :) Thanks a lot!

  2. efearg07 Says:

    La Verdad muy buen Editor lo pondre en mi Web

  3. Rene Says:

    Very nice. :)

  4. Pradipta Says:

    Great Editor must say and it dose exactly what it should

  5. Stephan Glas Says:

    Hy!

    Is it possible to enter certain areas of the editor out? So it does not automatically in all forms is displayed?
    Thank you

  6. Simon Harrison Says:

    Fantastic! Just what I was looking for.

    Many thanks.

7 Trackbacks For This Post

  1. Schöner kommentieren mit WordPress und WMD | Caschys Blog
  2. ocean90’s weblog » Fancy Zoom, Watermark, Search Everything und WMD Editor Plugin
  3. John J. Honeycutt » Blog Archive » Introducing: “Desk Space”
  4. Desk Space Wordpress Theme at Dirty Blue
  5. WP Plugin Review: WMD Editor » JaypeeOnline // Blogging News & Reviews
  6. 3 Vorbildblogger und was sie richtig machen - Blog, Vorbild, Datenwachschutzde, Thema, Leser, E-Book, Usability, Google - Geldkrieg
  7. Weitere Änderungen – Devbloggers Blog

Leave a Reply

Live Comment Preview