Git Product home page Git Product logo

githuber-md's Introduction

Markdown editor plugin for WordPress

Screenshot

An all-in-on WordPress Markdown Plugin provides a variety of features such as Markdown editor, live-preview, image-paste, HTML-to-Markdown helper, and more..

How it works

  1. WP Githuber MD will save your Markdown content into wp_posts.post_content_filtered.
  2. Parse the Markdown to HTML, save the parsed HTML content into wp_posts.post_content.

This plugin will detect your Markdown content and decide what scripts will be loaded, to avoid loading unnecessary scripts. For example, if you enabled syntax highlight, you have to update your post again to take effects.

Demo

GIF animation

The demo shows you the following steps:

Screenshot

  1. Convert HTML to Markdown by using HTML to Markdown tool.

Screenshot

  1. Cut up a selection area of an image and copy it from Photoshop, then paste it to Markdown Editor.

Screenshot

  1. Click "Update" button to save Markdown to post_content_filtered and save HTML to post_content (it is what you will see in result).
  2. View the result.

Video

https://youtu.be/it1noNCTXa4

Requirement

  • PHP version > 5.3.0
  • WordPress version > 4.0
  • Tested up to 5.5.1

Download

source download
WordPress https://wordpress.org/plugins/wp-githuber-md
GitHub repository https://github.com/terrylinooo/githuber-md/releases
PHP Composer composer create-project terrylinooo/githuber-md wp-githuber-md

Installation

  1. Upload the plugin files to the /wp-content/plugins/wp-githuber-md directory, or install the plugin through the WordPress plugins screen directly.
  2. Activate the plugin through the Plugins screen in WordPress.
  3. Go to the WP Githuber MD menu in Plugins and set your Markdown options.

Suggestions

The better situation to use this plugin is you just started a new blog.

If you're planning to use this plugin in an existing blog, be sure to:

  • Turn off other Markdown plugins, because the similar plugins might do the same things when submitting your posts, may have some syntax conversion issues between Markdown and HTML.
  • My personal suggestion is to turn off revision and auto-save, there are options in setting page.

Features

  • All-in-one Markdown editor.
  • Live preview.
  • Spell check.
  • Enable / disable Markdown for single post.
  • Support Gutenberg editor.
  • Support custom post types.
  • HTML-to-Markdown helper
  • Image copy & paste (support uploading to Imgur.com and sm.ms)
  • Syntax highlight.
  • Flow chart.
  • KaTex.
  • Sequence diagram.
  • Mermaid.
  • MathJax.
  • Emoji.
  • Github flavored Markdown task list.
  • Markdown extra...
  • Keyword suggestion tool.

Sceenshots

thumbnail screenshot description
Image copy & paste Image copy & paste view Uplaoding images becomes much more eaiser, just copy and paste, then done. You can upload to your upload folder or host your images to Imgur.com.
HTML to Markdown HTML-to-Markdown helper view Convert your old posts into Markdown by using HTML-to-Markdown helper that beside the Editor.
Syntax Highlighing Syntax Highlighing view Use Google prettify.js for the Editor's live-preview pane, and use prism.js for the fontend pages. You can choose your favorite theme for syntax hgihlighing.
Mermaid Module: Mermaid view Mermaid is a Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.
KaTex Module: Katex view KaTex is a fast, easy-to-use JavaScript library for TeX math rendering on the web.
Flow Chart Module: Flow Chart view Draws simple SVG flow chart diagrams from textual representation of the diagram.
Sequence Diagram Module: Sequence diagram view Turns Text Into Vector UML sequence diagrams.
Setting Page 1 Setting page 1 view Markdown settings.
Setting page 2 Setting page 2 view Modules settings.

Author

Created by Terry L. and contributors. Thanks for the donators for supporting me, and the translators such as CoLocal and others for providing translation.

Notes

License

GPLv3 or later

githuber-md's People

Contributors

a-mt avatar alpipego avatar bramus avatar bronya0 avatar hmaragy avatar howardlau1999 avatar jawngee avatar jeherve avatar jpsimkins avatar kasztof avatar lategege avatar martincz avatar mkmark avatar mvanholsteijn avatar nczz avatar nyx1197 avatar pluveto avatar razonyang avatar surkum avatar syhily avatar terrylinooo avatar xxnull-lsk avatar zxilly avatar

Watchers

 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.