Inline Images in Markdown Hack
I’ve been playing with WordPress and really enjoy using Markdown. I haven’t been able to find an image system that shares its philosophy of writing, so I took a stab at implementing something like it. And I hate processing and uploading multiple thumbnails for images, so I adapted some code from PictPress to automatically generate them on the fly. The Markdown addition I made allows you to specify image alignment and width, and it uses some additional CSS tags to do the formatting.
I’ve put up a post about what I’ve done so far at http://davidseah.com/index.php?p=36, in case anyone is interested. I haven’t tested it extensively, and I’m pretty new to this whole blog/open source thing, so any comments are appreciated!
Thanks, this looks interesting. I use Markdown as well and wanted to look up how it handles images natively… right now, daringfireball seems to be down, though.
I’ve uploaded a zip file of the current hack at http://davidseah.com/index.php?p=38 for those who are interested. Thanks!
Uploaded dev version 0.2 at the same location. It is still a hack of the PHP-Markdown 1.0 plugin.
* New thumbnail syntax is more like Markdown, and uses reference ids
* No need to include styles in wp-layout.css anymore
* Built-in Image Popup code
* Default left-aligned, 120 pixel wide thumbnail if you don’t specify third ( … ) field.
!@[images/hello.jpg](popimg: “Hello There”)(R240)
will create a right-aligned, 240 pixel wide image inline with the current paragraph from the JPEG file located in your wp_content directory (or whever your upload folder starts at). Clicking on the image will pop it up in a new window. You can replace popimg: with a URL of your choice.Anonymous
I’ve separated the functionality into a stand-alone plugin called Lazy Image Layout. Click the link to see examples.
It still requires that you have Markdown activated, otherwise the image formatting won’t quite look right. I also haven’t tested this with the out-of-the-box CSS formatting of a vanilla WordPress install…mine has deviated quite a bit.
More things to look at later.Anonymous
I tried it with the default wp-layout.css file, and it generally works except that my own blog uses a fixed-width design, so layout that depends on that tends to look funny. Otherwise, just using left and right align seems to work pretty well.
- The topic ‘Inline Images in Markdown Hack’ is closed to new replies.