How to post Source Code inside a WordPress blog post

I just started a coding related wordpress bog to basicly discuss topics and store code snippets in. I installed a code syntax highlighter plugin which is very nice but I am having a problem. I just tried posting my first code related blog post and wordpress seems to only post some of my code and then it makes some of it not show, like it filters some of it out even though I am wrapping it in tags like this..

<pre class="brush:php">

<?PHP
my code
?>

</pre>

Some of my code works and some gets filtered out somehow. I know this is possible as many wordpress coding sites show source code. Do I need to modify something to make it work in wordpress?

Read More

UPDATE

I have confirmed that it does save ALL my code into the database it just filters it out when it try to print to screen, so when I go in to edit the post and textbox populates with ALL the source code intact

Related posts

Leave a Reply

8 comments

  1. I have had a lot of trouble with inserting codes into wordpress posts in the past, but I did find a very easy way to do it! I would add this code to your stylesheet:

    pre {
        font-family: courier,"courier new",monospace;
        font-size: 12px;
        overflow-x: auto; /* Use horizontal scroller if needed; for Firefox 2, not needed in Firefox 3 */
        white-space: pre-wrap; /* css-3 */
        white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
        white-space: -pre-wrap; /* Opera 4-6 */
        white-space: -o-pre-wrap; /* Opera 7 */
        /* width: 99%; */
        word-wrap: break-word; /* Internet Explorer 5.5+ */
    }
    

    And then just make sure whatever code you are trying to display as code is within the <pre> tags. Works great for me!

    I just wrote a blog post about this too (http://blog.thelibzter.com/displaying-snippets-of-code-correctly-in-wordpress-posts) since it was something that I could not find a solution to for a long time! Hope that helps!

  2. An idea is using gist of Github: http://gist.github.com, for each source code that you post on gist, you receive a embedded code that simply you can paste it on your post on WordPress.

    For example see this: https://gist.github.com/meysampg/0a6524b13b8be8e6205a#file-rtl_css_prestashop-tpl, I used embedded code of this gist on this HTML file:

    <!doctype html>
    <html>
    <head>
        <title>Sample of Gist code</title>
    </head>
    <body>
        <p>This is a code:</p>
        <script src="https://gist.github.com/meysampg/0a6524b13b8be8e6205a.js"></script>
    </body> 
    </html>
    

    You can see an online demo here: http://jsfiddle.net/meysampg/nadsffe7.