Forum

Thread tagged as: Question, Addons, CKEditor

A text editor plugin that works for implementing code?

Iv tried a few that work with Perch, i'm currently using CKEditor.

None of them work well when inserting code it's really frustrating.

And even if you do manage to get all the code blocks in without it looking a mess, if you go back into the editor it all gets messed up again.

Anyone had any luck with a solid text editor?

Cheers

Kieran Hunter

Kieran Hunter 0 points

  • 6 years ago

For now i'm embedding individual gists from Github, seems alright for now. Anyone have any better ideas let me know.

Drew McLellan

Drew McLellan 2638 points
Perch Support

Can you give a more specific description of what you're trying to achieve and what's happening?

When I try to put code into the wysiwyg editor, it doesn't display properly in the front end. And in some cases when I go back into the backend parts of it are missing. I'v tried all the editors with various code plugins for the CKEditor but to no avail.

Some PHP code just won't go in. Can't get it to insert into this forum post neither.

Drew McLellan

Drew McLellan 2638 points
Perch Support

How are you entering the code?

with

<pre><code></code></pre>
Drew McLellan

Drew McLellan 2638 points
Perch Support

And what result do you get?

I get a load of jumbled code like

<div class="line number1 index0 alt2"><code class="php keyword">if</code> <code class="php plain">( ! function_exists( </code><code class="php string">'custom_post_nav'</code> <code class="php plain">) ) :</code></div>

It's the PHP code, it's not staying within the <code></code>

Drew McLellan

Drew McLellan 2638 points
Perch Support

That looks a lot like CKEditor's doing to me.

That was with tinymce, I'm using tinymce because it's the only one that I'm able to use GitHubs script embed codes on.

Rachel Andrew

Rachel Andrew 394 points
Perch Support

You are going to have trouble if you mix a WYSIWYG editor (that is expecting HTML) and code you want to render.

I'd be creating a Blocks template with an option to add a "code block", and not put an editor at all on that block.

If you must do it inline you'd be better off using Markdown or Textile as you can insert code sections into both and as long as you have html set to false on those areas Perch won't touch it either.

So iv just looked at Blocks in perch and it looks great.

How would a 'code block' be configured to output code that the user can read just like the <code></code> tags in the WYSIWYG editors?

Drew McLellan

Drew McLellan 2638 points
Perch Support

<perch:block type="Code">
    <code><pre>
    <perch:content id="text" type="textarea" label="Code" />
    </pre></code>
</perch:block>

I'm loving the blocks!

The <code></code> tags still don't contain my PHP code, but I'm not sure that's a perch thing?? I think it's just the PHP.

Example of my php I wanted to insert into <code> tags is here:

https://kieranhunter.co.uk/next-previous-wordpress-post-links/ (the first block of PHP)

I tried the same code with the <?php ?> before and after as well but no luck.

Drew McLellan

Drew McLellan 2638 points
Perch Support

I don't understand this:

The <code></code> tags still don't contain my PHP code

What result are you looking for?

I just double checked it again, and now it seems to be working, with the Perch Blocks solution. Really nice idea that is. Cheers.