Giter VIP home page Giter VIP logo

easy-markdown's Introduction

Easy Markdown

TLDR; Write posts in WordPress using github flavored markdown without wanting to kill yourself.

easy-markdown-logo

Blogging about code in WordPress has historically been a HUGE pain in the ass.

TinyMCE and the WordPress visual editor garble your code like it's their job.

I've tried every single syntax highlighter plugin in existence.

They all fell short in one way or another.

So like any good developer. I rolled my own.

Easy Markdown WordPress Plugin

http://www.youtube.com/watch?v=dRMow19g0VU

Download Easy Markdown Plugin

I made this with a focus on JavaScript and it supports ES6 javascript syntax highlighting and JSX for React code snippets.

Languages Supported:

  • html
  • css
  • javascript (ES6)
  • applescript
  • bash
  • git
  • json
  • less
  • markdown
  • jsx
  • sass
  • scss
  • yaml

If you don't see your language here, make a custom Prism build and replace the prism.js file.

Install:

  1. Download
  2. Install
  3. Visit profile and check 'Disable the visual editor when writing' in the profile page of WP admin /wp-admin/profile.php

Prior Art

Syntax highlighting is handled by Prism.

The Markdown parser was shamelessly gutted from JetPack and Evan Solomon's GitHub flavored markdown script

Thanks! =)

Examples:

// JavaScript!
var greeting = 'What up G'
alert(greeting)

console.log('log');
// HTML!
<a href="http://davidwells.io">
  Wowza!!!!
</a>
/* CSS! */
.ninja {
 visibility: hidden;
}
// PHP!
<?php
  echo 'Derp';
?>
// Bash!
# Bash script
mkdir lololol && cd lololol

Customizing it

I'm not supporting custom use cases and styles.

You can fork the plugin and do this yourself!

To change CSS, edit the prism.css file

To change/customize prism edit the prism.js file.

To add support for more custom post types alter these lines.

Happy Blogging!

Troubleshooting

Don't install with JetPack. It will probably cause problems

easy-markdown's People

Contributors

davidwells avatar glantucan avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.