Problog has worked well for me so far, but being a developer, I much prefer to write blog posts in markdown format. Am I missing something or is this not a feature? Pasting markdown into the html view doesn't seem to work... Really a bummer as the base RainLab plugin supports it but this one is so much better, yet missing a key feature.

Last updated 9 years ago

You have some options here with this:

1) follow this tutorial and extend the plugin form interface: http://vimeo.com/108040919

2) try some of the available WYSIWYG plugins that support ProBlog (not sure if they offer markdown plugin or not)

3) replace line 42 of /plugins/radiantweb/problog/models/post/fields.yaml with:

      type: codeeditor
      language: markdown
      showGutter: false
      wrapWords: true
      fontSize: 13
      margin: 15

ChadStrat

really I should integrate a redactor plugin for markdown:

https://github.com/leeoniya/redactor-js/tree/markdown-panel

ChadStrat

Thanks @ChadStrat, and really, great plugin! I'm proud to be supporting October and fellow developers. Cheers!

Anyway, after first trying the RainLab.Blog plugin and being able to see the live markdown preview right next to your editor, I am really missing that feature now... it was pretty slick seeing that live preview while writing.. but any sort of markdown support would be awesome at this stage.

Anything I could do to help make this or some sort of markdown support happen?

Last updated 9 years ago

Here's what I am thinking:

• add a ProBlog setting to enable markdown mode
• enabling this setting removes the wysiwyg, and replaces it with the split screen markdown editor/preview

I "should" be able to make this work with the SEO Optimizer via the preview.

Give me a few days to work on this. Appreciate your feedback.

ChadStrat

Another workaround is to include a partial that references a piece of markdown content... so thanks for including the partial tag! Is there a way to specify parameters for a partial? For example [[partial::partialname param="val"]]

ChadStrat, nothing less than awesome!! Your proposal sounds perfect. I wouldn't want to lose the WYSIWYG if it were a client site, so having that option would be ideal. Loving everything else so far, let me know if I can contribute in any way! :)

I just found this github issue that is somewhat related. The linked screencast is awesome, but perhaps beyond the scope of your plugin modifications. Thought it was a cool way to handle images and wanted to share it. Cheers!

This may be a step by step evolvement. I have something really cool implementing something similar to this: http://pushingkarma.com/projects/jquery-wysiwym/

I will look into images as well. May have a look at the Ghost one as well. Although I have already have a loose implementation saving/working atm. Just need to think through images.

Thanks for being awesome ChadStrat! Not sure if possible or not but it may be more flexible if markdown mode could be enabled on a post by post basis. More code oriented posts could be written in markdown while other posts might use the wysiwyg... Wanted to share this thought too. Looking forward to whatever you do!

Last updated 9 years ago

Ok, v1.5.0 is up.

Go to the Settings -> ProBlog area and in the "editor" tab, enable markdown.

To add an image, simply tab over to the "general" tab and upload a new image, then click on the link icon and copy the url. You can then use image markdown or click on the image button to add the markdown snippet and replace the url. A placeholder is there as a temp.

If you want your image response, just simply type a standard <img src="" width="100%"/>

Let me know if there is some functionality you think could be added. It's pretty basic right now. But still cool just the same.

ChadStrat

Last updated 9 years ago

Thanks for implementing this! A few talking points so far: Possible Improvements

• fullscreen mode for editing
• syntax highlighting for markdown
• side-by-side edit / preview
• images embedded with the image markdown -- be able to optionally specify a class, default to img-responsive.

Ideally it would function just like the RainLab.Blog plugin in the editor / markdown / code / preview aspects -- maybe you could borrow some code from that portion of the RainLab plugin?

Other things

• indented (example below) code blocks not showing up in preview, but work when page is rendered... this is the markdown structure:

  \* Some list item
  ....```
  ....// some code (dots = spaces / indentation)
  ....```

• Getting Uncaught reference error: prettyPrint is not defined on the post page now -- not sure if it's related but I haven't seen it before.

Thanks for all your hard work! I am looking forward to using it even with just the basic markdown feature in place!

Edit: ignore the \ at the start of that markdown example codeblock.. that's the only way i could get it to format somewhat correctly... hopefully you get the idea.

Last updated 9 years ago

can you inspect and see that the prettyPrint.js is loaded? Do you have {% scripts %} in your theme footer?

ChadStrat

you should see

<script src="/plugins/radiantweb/problog/assets/google-code-prettify/run_prettify.js?skin=sunburst"></script>

in your footer

ChadStrat

I have {% scripts %} and do see the run_prettify.js script in the footer.

Specifically, the console message is coming from the prettyPrint() call in the below.. which is in the source code after the run_prettify.js script. Let me know what else I could do / try.

    $(document).ready(function(){
        $('pre code').each(function(){
            $(this).parent().addClass('prettyprint');
        });
        prettyPrint();
    });

that doesn't make any sense at all...hmmm

try adding just above line 60 of /plugins/radiantweb/problog/components/Post.php

$this->addJs('/plugins/radiantweb/problog/assets/google-code-prettify/prettify.js');

ChadStrat

Fixes the error regarding prettyPrint. I don't notice any difference in the rendered page, but then again everything seemed to render fine before, had just noticed that error in the console.

K, latest version should have the livepreview fixed.

C

Hi guys.

After your update and implementation of markdown the "normal" editor doesn't work anymore.

Basicly it doesn't save my text, but if I enable the markdown it works.

@ChadStrat, the SEO tools are not working for me (in markdown mode). Getting 'Undefined is not a function' from seo_tools.js:22

Line 22 is:

return $('#RichEditor-formContent-textarea-content').redactor('get');

It can't get the content from the text area. Not sure if this is a quick fix or not but wanted to make you aware if you weren't already.. Thanks!

Last updated 9 years ago