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 t开发者_如何学Chen 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?
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
take a look at http://en.support.wordpress.com/code/posting-source-code/ that's what the official wordpress hosting supports, it's really easy to use and should be tested enough.
My guess is that you have unfiltered < or & signs in your code that need to be encoded. Use "<" for < and "&" for &.
Did you read this Codex article? For highlighting code you can use wordpress plugins.
Did your <?php ?>
codes get executing?
Try with <?php phpinfo(); ?>
to confirm that.
I tried about 3 different plugins and with them all combined I finally have wordpress not filtering out my php code
I use WordPress › WP-Syntax « WordPress Plugins and there are no problems with posting and formating php, css, applescript, etc. You must not have the plugin(s) installed correctly.
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!
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.
精彩评论