How to fix? Wordpress wp-markdown plugin corrupted syntax-highlighter-evolved plugin posts?
Asked Answered
I

3

3

I have been documenting some C++ codes (or can be any codes) over the past few months on wordpress, with the Syntax-highlighter-evolved plugin. Everything had worked fine. e.g. the C++ codes displayed correctly in post. e.g. the following syntax would display C++ codes nicely in wordpress.

[code language="cpp"]
   c++ codes goes here...
[/code]

Recently, I have started exploring using mark-down in wordpress and started writing mark-down in new posts with the wp-markdown plugin. (For the benefits of simplicity and ease of migration / sharing / maintenance in long term).

... And then ... I realized all of my older posts (with codes wraped in the Syntax-highligher-evolved syntax) have all got corrupted!

For example, characters (like < > etc), got converted into HTML entities (like &lt; &gt; etc). In addition, I also see LOADS of HTML tags being inserted into the C++ codes.

See here for a sample post on my wordpress site (scroll down to and you will see some code blocks.). It contains some supposingly C++ codes which now looks nothing like C++ codes.

Following discovering this error I have attempted playing around with activating and deactiving the plugins to see if I could get back to the working state (i.e. codes being displayed as C++ codes, instead of hybrid C++/HTML code). No luck so far.

(Currently I have both syntax-highlighter-evoled and wp-markdown plugins activated).

Has anyone encountered similar problems before and how did you resolve this?

Would be very grateful for all the help!

UPDATES (Monday 2nd March 2015):

As a workaround I have (1) disabled the wp-markdown plugin. (2) Kept the syntax-highlighter-evolved activated. (3) Activated the Jetpack markdown plugin. The manual workaround steps below helped me correct 1 (out of about 100) posts.

  • It looks like the Jetpack markdown plugin complement better with the syntax-highlighter-evolved plugin. (based on my observations so far.)

  • As an experiment, I have modified manually an old post by (1) turning the wordpress visual editor off. (2) edited that old post. Here are the new vs old.

  • when I started editing the old post, I noticed that the entire post was converted automatically to mark-down format in the editor (which is good). The good news was, the unexpected HTML tag now had gone away (I presume because I was using the bare minimum wordpress editor, instead of the visual editor). So at least I could recover / copy the entire chunk of markdown-like post to a text editor (like sublime text on my desktop).

  • This conversion was not perfect however - I noticed some by-products. such as...

  • lots of carriage return (i.e. new line) disappeared - causing multiple lines got "merged" into one line. I had to manually spot for these lines and re-format them one-by-one. (a pain!)

  • I noticed also things like #include appeared as # include (added space in the middle). So I had to manually correct those. Likewise for some other entities containing #.

  • To manually edit the old (now semi-markdown) post, I removed all the legacy syntax-highlighter open tag [code language="cpp"] to three back-tick plus the code extension (```.cpp). And the close tag [/code] to three back-tick (```). See the Jetpack Markdown Doc and Markdown Extra Doc for more info.

  • Once updated post with the new Jetpack markdown syntax, the syntax-highlighter-evolved seemed to "know" about these new tag and automatically apply c++ color coding to it. (if I use three back-tick without the code extension, the syntax-highlighter still work to wrap the code into a block, just without the color).

  • Net net. The good news is that I have found a workaround which will enable me to "upgrade" the post one-by-one, manually (and a way to recover old posts - i.e. no more unexpected HTML tags in code by disabling the wordpress visual editor). Downside: this will be a lengthy process as I will have to manually spot for the missing carriage-return and re-add them to the code block. Updating 100 posts like this will take... some time.

Update (7th March 2015)

  • Realized that the WP-plugin actually corrupt the original blog post files. So as a quick fix I manually edited the 100 posts using the editor, and replaced all the damaged code with the corrected version. Took me 3 days solid to do but at least corrected.

  • I noticed that the Jetpack Markdown Plugin and/or the Syntax Highliter Evolved are not perfected. e.g. even wraping a code with the opening and closing code tags, some bugs remained - such as backslashes got stripped, the less-than / greater than signs not displayed as expected, etc.

  • So I for creating new posts, I have tried out the (Github) Gist in conjunction with oEmbed Gist plugins (as suggested by @OllieJones below). Works beautifully so far (Gist seem to display codes as expected. Time will tell). I have this feeling that going forward I can use Gist to store all of my blog posts in markdown files, and simply use Wordpress to "display" these markdown files. (I wonder if Gist can be used to store the image files as well? Or I need to stick to Wordpress to store the image files?).

  • Here are some sample new blog posts using the Gist method. example1, example2.

Illogic answered 1/3, 2015 at 20:35 Comment(1)
I have the same problem with the Crayon Syntax Highlighter, got aware of it yesterday. It looks ok in the editor, not on the site. I do not have the markdown plugin installed. I use '<pre>' instead of shortcode, so I deactivated... Makes me wonder if this is since the WP update to 4.1.1. (probably not, cause there are no new support requests)Hindu
I
3

The doggone markdown plugin translates posts from HTML to markdown when it loads them for editing, and translates them back when you Update them. I've had the same problem with code getting trashed. This is a big pain. (I fixed it with a backup.)

My solution is to use gists -- on http://gist.github.com/ -- to display my code. The oEmbed Gist plugin makes that work very well.

Islamize answered 1/3, 2015 at 20:36 Comment(3)
Does the Gist plugin complement well with Wordpress (Jetpack) Markdown Plugin? (And yes, would love to try out!)Illogic
Hey @OllieJones, I've just tried today using gist in conjunction with the oEmbed Gist plugin that you suggested. Works beautifully so far. I believe I could now essentially create all of my blog posts in markdown (.md files) and store in the Gist cloud (which can be downloaded to my locak desktop Git as well I believe). And use Wordpress as a medium to store images and display the embedded Gist .md file. Here is a sample page: mathalope.co.uk/2015/03/01/…Illogic
So far I have found Gist much better in handling / displaying code blocks "as is". i.e. no sign of codes being displayed incorrectly yet. So far the Wordpress Syntax Highligher Evolved and Jetpack Markdown still have issues displaying codes "as is". For this reason I have marked this as the accepted answer - this is the best solution I have observed so far. Than you so much!Illogic
L
2

Sorry I am to late.

You can edit the "SyntaxHighlighter" plugin.

  1. open "SyntaxHighlighter" plugin, edit it
  2. wordpress will open syntaxhighlighter.php
  3. search and romove all "htmlspecialchars" and "htmlspecialchars_decode" string.(maybe you need backup it)
  4. save it

I used this fixed success.

My Englist is bad, but I tried my best, hope that may help for you

Lapotin answered 23/4, 2017 at 12:56 Comment(0)
S
0

Expanding on Pea3nut answer, I had to modify the PHP file for SyntaxHighlighter Evolved so it ended like this

Go to Plugins -> Plugin file editor -> Select SyntaxHighlighter Evolved on the top right -> Copy the gist in the link above -> Select all and paste it there (replace it)

This also fixes the issue with Divi, so you don't have to pay for the Divi syntax highlighter code plugin and save $9 (it's free)

Snowstorm answered 31/1, 2023 at 12:24 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.