1

I am presently learning PHP and Linux simultaneously. And I want to blog my notes not only for my future reference, but also because it could help others.

I just noticed an issue with Wordpress - - it automatically adds <pre></pre> tags in the background (HTML-side I mean, in the visual editor I see the code's background highlighted) as soon as I paste some code, be it HTML, PHP etc.

I have searched a lot, and could find nothing about this. Looks like nobody thinks this as an issue, or it's something too easy to resolve. Either way, I am on the other side of things. So, please help me out.

I want Wordpress to stop highlighting the code like that. I Just want it to keep whatever I paste as it is.

4
  • 1
    I hate to say it, but that's what <pre> does, keep your code exactly as it is. Otherwise Wordpress would change the font spacing, alignment, and everything would look awful. If you're blogging with a lot of code, I'd really strongly suggest using <pre>, and offsetting the segments of code from the rest of your post. Or, alternatively, provide a link to the entire file and only include the relevant lines on your blog.
    – Bean
    Jul 20, 2011 at 19:06
  • If I can't get a better suggestion, I guess what you said is the only way.
    – Aahan
    Jul 20, 2011 at 19:10
  • Do I understand that the problem is the background color used for the pre tag. You should be able to sort that out by modifying the CSS for the pre tag.
    – Eelke
    Jul 20, 2011 at 19:16
  • Specifically, I'm sure there's a way around auto-wrapping <pre> tags. I just think it's a bad idea stylistically for a blog. I certainly hate reading code when it's not monospaced, and indented properly.
    – Bean
    Jul 21, 2011 at 2:27

3 Answers 3

4

The only way to keep it the way you paste it is by switching to the HTML tab - this will show you the raw code as you formatted it. Wrapping code in tags is also a good idea because it tells the browser that the code is literally 'precomposed', and it therefore won't render it. In terms of WP actually altering your code it is likely it will change characters such as '<' for their HTML entity equivalent, meaning browsers will render it as text rather than code.

Why exactly do you want to keep it without the tags? It shouldn't alter that much.

2
  • Okay... then will adding escaped code in the HTML tab work as intended? What do you think?
    – Aahan
    Jul 20, 2011 at 19:13
  • If you paste indented into <pre> tags it remains indented as the browser takes it that it is pre-formatted. You will need to replace the '<' yourself to ensure the code shows up, but yes indentation will remain inside the <pre> tags.
    – Tom Walters
    Jul 20, 2011 at 19:17
0

I would like to recommend the Syntax Highlighter Evolved plugin for Wordpress. I use it on my own site and it is awesome. In fact a lot of the programming blogs you read will use it also. It supports a large number of coding formats, line numbers, alternate line colors, autocopy to clipboard, etc.

WP plugin

Authors Website

Example from my website

0

There is probably a pre tag somewhere in the included template files. If you are working with a local copy - try doing a search for <pre> and see what files contain it.

I have had similar issues with the wordpress wysisyg - and just edited the template file outright.

Of course, this only is doable with the self-hosted wordpress, and not a blog on wordpress.com

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.