Welcome to the Question2Answer Q&A. There's also a demo if you just want to try it out.

Add an image upload button in Markdown Editor

+13 votes
4,849 views
asked Dec 5, 2012 in Plugins by Mehede Hasan Rakib
any one please tell me that how to Add an image upload button in Markdown Editor like stackoverflow ?

Markdown Editor: https://github.com/svivian/q2a-markdown-editor
Q2A version: 1.5
commented Aug 30, 2013 by jithinjose2
Yes we need an simple but powerful editor like stackoverflow

7 Answers

+4 votes
answered Dec 6, 2012 by Scott
This is something I am looking into (I am the Markdown editor dev). I may wait for v1.6 to come out though, because it's possible there will be a better way to handle images.
commented Apr 5, 2013 by Jay
Any updates on this Scott?
commented Oct 24, 2013 by Dimension10
Have you done it yet?.
+9 votes
answered Jul 18, 2013 by Bruno Vandekerkhove
edited Jul 18, 2013 by Bruno Vandekerkhove

I've made this myself, took me 2 days and Gideon, sama55 and jatin.soni were very helpful.

Reporting bugs is welcome!

You can download it here .

commented Jan 1, 2014 by Johnathon
I am trying to use markdown with image upload but its not going through and on debugging I am getting "TypeError: $(...).ajaxSubmit is not a function", any clue what could be the reason and how to solve it. I am using Q2A version 1.5.3
+2 votes
answered Jul 19, 2013 by samlee

@ Orunb : Here is a screen shot  

commented Jul 19, 2013 by Bruno Vandekerkhove
I updated the link - now transparency is allowed & there is one admin option making the file upload an option rather than the rule.
commented Jul 20, 2013 by samlee
Working great ;)
+1 vote
answered Aug 23, 2013 by axpv

Hello! I've just tried you version of Scott's plugin, but can't get it working :( Can you help me please? I have errors in nginx error log:

2789#0: *1 FastCGI sent in stderr: "PHP message: PHP Warning:  file_get_contents(../qa-plugin/markdown-editor/pagedown/markdown.min.js): failed to open stream: No such file or directory in /var/www/www.mydomain.com/qa-plugin/markdown-editor/qa-markdown-editor.php on line 36" while reading response header from upstream, client: x.x.x.x, server: www.mydomain.com, request: "GET /ask HTTP/1.1", upstream: "fastcgi://unix:/tmp/wwwpool.sock:", host: "www.mydomain.com", referrer: "www.mydomain.com/"

File markdown.min.js is in the right directory.
 
allow_url_fopen is on. May be somethings else I need to configure in my php.ini or nginx conf file?
commented Sep 23, 2013 by Jamal Mohmand
Did you solve this problem  ?
0 votes
answered Oct 12, 2013 by jonnics

Kudos @scott.

Additional css:

Force large images inside a div or table.Type this in your qa-styles.css

.wmd-preview p img,.entry-content p img  {
position:relative;
max-width:100%;
height:auto;
}

modify as you need.
Works well combined with fancybox.js to view the image larger - fancyapps.com

 

:)

+2 votes
answered Apr 20, 2014 by bvassy

If you want to save images to disk, rather than database, you can download a slightly modified version from here: https://github.com/bvassy/q2a-markdown-editor

Thanks to Scott and Waaaaaaa for the time invested!

commented Apr 21, 2014 by LaughingYoda
This is awesome, thanks so much for this!!

I have a small problem however, the notification emails I get sent have the image link instead of the image itself, would this be an easy fix, do you know?

Cheers
commented Apr 21, 2014 by bvassy
You're welcome! As for the image link, I don't think it's because of my changes. I'll look into it, although it might take a while because I'm new to Q2A and still learning the system :)
0 votes
answered Jul 21, 2016 by Coderx

This is indeed very good. 

But I am having a slight problem. 
My site uses the rtl language. and this posed some problems. 
1.the icons are on the left side of the editor, instead of being in the right.

2.when I try to use the code icon, for formatting and syntax highlighter, it formats it right to left, when it should be formatted left to right. 

this is how it looks on my site:

how can I fix these ? where should I change?  

Thank you very much 

...