WMD editor, rails, compass : How to get the generated Markdown code read as HTML and displayed as 'rich-text'?

StackOverflow https://stackoverflow.com/questions/9252797

  •  28-04-2021
  •  | 
  •  

Question

I quite like that WMD is behaving nicely with my app. However, I have one problem.

Basically I edit content and store it as markdown in my database. Then I use Kramdown to get the HTML for the views. However Kramdown gets me the HTML tags which are not read by my browser. I use Chrome.

Sanitizing it will give a plain text even when the user has entered e.g. bold, italic, code etc.

So the basic idea is to get the generated HTML read as HTML and as 'rich-text'.

Inspecting the output source, I find that if I use Kramdown::Document.new(text).to_html there are some " " quotes introduce like this: "<p> ...<em>..</em>.. </p>"

These quotes hide the really HTML code after the quotes...(I assume)

and with sanitize the quotes are gone: <p> ...<em>..</em>.. </p> but I end up with plain text.

What am I missing here? Can I make my browser see that I have bold, or i have italic, a paragraph, an image etc...

Must I use kramdown or similar markdown to HMTL converters?

Thanks a lot!

UPDATE

I use compass for my stylesheets. When compass is uninstalled WMD editor works fine and correctly. For some reasons, it seems, compass hides any styles including 'test text' in my application.html.erb file but those created with its .scss partials files! I mean for example the following code when written in my application.html.erb file does not display as bold. <strong> test bold </strong>

Any ideas why this happens?

Was it helpful?

Solution

I have figured out the solution.

The problem was that the generated compass styles includes the following code segment:

body.bp {
  @include blueprint-typography(true);
  @include blueprint-utilities;
  @include blueprint-debug;
  @include blueprint-interaction;
  // Remove the scaffolding when you're ready to start doing visual design.
  // Or leave it in if you're happy with how blueprint looks out-of-the-box
}

In my stylesheets I had ignored to include the .bp class. All is good now...

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top