Source Code Formatting
Just thought I’d go back and edit some of my old posts to use the new [sourcecode]…[/sourcecode] stuff, and ran into some issues.
It’s definitely better than it was, but it doesn’t seem to preserve whitespace formatting, and in a post I just edited with lots of ‘<‘ and ‘>’ (i.e. C# generics), it scrapped those — “ICollection<MyClass> bob” became “ICollection bob”…
The FAQ says it’ll preserve formatting and automatically encode HTML entities (like ‘<‘ or ‘>’). The formatting is preserved for display perfectly fine, but if I go back to edit it, all the extra white space I added for each line is gone — it’s all straight-edge left aligned.
Am I just missing something, or….?
I can’t help you with this but perhaps another blogger can. In the meanwhile this is what the forum searchbox produced https://en.forums.wordpress.com/search.php?q=source+code
It’s also converting a few characters to some form of extended ascii characters outside of normal characters. I’ve seen that happen before when things such as double quotes, single quotes, ellipses (three periods) are pasted into the text box and its not converted to the standard symbols. This isn’t a problem if the same symbols are placed outside of the “sourcecode” block.
There’s also a text-wrapping problem. My template only provides about 500px width. So lines that are longer than that cause the sourcecode block to get messed up – background doesn’t extend all the way to the right.
Also, XML comments are removed from csharp code blocks.
mcory1, try turning off the rich text editor. When I saved and went back, my white space was preserved. I was having problems with the rich text editor removing the spaces before this was added.
You do that on your Profile page, btw.
> There’s also a text-wrapping problem. My template only provides about 500px width. So lines that are longer than that cause the sourcecode block to get messed up – background doesn’t extend all the way to the right.
you might want to embrace all of the code PRE blocks related to a single snippet into a DIV block with a custom style.
<div style="overflow-x:scroll; background: lightyellow; border: 1px solid; padding: 1em"> <pre> code here </pre> <pre> code here </pre> <pre> code here </pre> </div>
Just so everyone reading this post is on the same page, we are talking about the new sourcecode tags added by WordPress today and not about using PRE or DIV tags to format our own code within our blog posts. Please read the FAQ and WP blog for reference.
I saw the announcement, almost immediately, about “code” and started to leave (the first) comment, to the affect ‘clueless, no idea what this is about, so Good Holiday and I’ll tiptoe out’ –but didn’t, thought maybe I could find out later. “PRE” –“DIV” tags??? After reading, no more enlightened, but you sound like someone I could ask: Do I Need to know what this is? Will the blog –be going weird, this code stuff will fix? Or: can I Ignore and no probs?
If we/I HAVE to understand this ‘new feature’: I’m gonna need a Whole Lot simpler and better How To….
And can someone tell me where to submit a request for: No More New Features, for awhile? Thanks! To Americans: Good Holiday.
d a V i n e
IMO it’s highly unlikely that this information will be useful to you. And for that matter neither will it be useful to me or the vast majority of wordpress.com bloggers. I say this because we aren’t geeks and we don’t blog about IT so, we aren’t apt to be posting source code in our blog posts. :)
The new feature is only for people who want to show code in their blogs for their readers. The FAQ link above gives an example and shows how to do this. If you’re blog isn’t a programming/coding blog where you post examples of how to write code, then it won’t affect you.
Thanks for the suggestions. I went back to try it out without the visual editor, and something else kinda screwy happened — in several places where I’d tried to fix the ‘<‘ and ‘>’, the text was repeated. IE, >TItem< became >TItemTItemTItemTItemTItemTItem< — yes, I know it’s the wrong entities, but I was in a hurry and not paying much attention. I was also copy/pasting, so it’s possible that I did that myself, but I really doubt that I did (come to think of it, I’m also a little unsure on the swapping of > and <s;…
Anyways, doing it without the visual editor worked for preserving the whitespace — thanks! Unfortunately, though, it still scrapes the ‘<‘ and ‘>’ out (which is important for the main post I have with a lot of source code), and unfortunately it __does__ replace ‘&’ with an appropriate entity — so I get ‘>’ in my post, but not ‘>’ (neither as the ‘>’ that would probably be ignored by the browser or as the > that would display properly — it’s just gone, like when I go back to the editor.)
Thanks for the suggestions anyways though — maybe going to the straight-roll-your-own formatting is the best way (never really tried it, just didn’t look like that much fun.)
>we are talking about the new sourcecode tags added by WordPress today and not about using PRE or DIV tags to format our own code within our blog posts.
so am I.
above you were complaining that you’re having a “text-wrapping problem”, weren’t you?
the matter is, new sourcecode tags don’t prevent you or anyone else ‘reading this post is on the same page’ from wrapping their content into DIV block with a custom overflow style set to ‘overflow: scroll’.
this way that said DIV block containing a code will have a scroll-bars which secure sourcecode block from getting messed up by the long strings that exceed main column width.
actually, that’s how those [sourcetags] aught to be implemented by devs, perhaps they will add this.
I’ve been using the Microsoft Live Writer beta and an “Insert Code” plug-in. The writer is working fine, but there’s a bug opening any post from WP with PRE tags in it, so you can’t edit it once its been posted. Its been resolved in the next release, but MS dev team hasn’t said when they are going to release the next version.
Otherwise, there’s a few different tools you can use to get code into your blog that requires you to hard code a bunch of inline styles, but I think it will probably look better since all of the keywords, classes, etc will be correctly colored (doesn’t seem like the new sourcecode tag is catching all of the csharp keywords or coloring all of the code correctly).
I posted on one tool that works with visual studio at http://jamesewelch.wordpress.com/2007/08/23/how-to-post-code-from-visual-studio-to-your-blog/
You can’t use [sourcecode] without a language argument.
Well, for the most part, I’ve been using drivel for posting (its a GNOME utility), and it’s been decent. I haven’t really posted a lot of source code, but mainly because I haven’t found a way to do it with something simple (like what this was supposed to be).
I know there’s a few utilities for Linux that handle source -> html, and I think jEdit even has a plugin specifically for that. Just hoping I could get by without it, that’s all. That and my previous attempts kept getting most of the html removed, but I think that might have been because of the visual editor; I’ll try it again without it.
I know with the self-hosting solution there’s a plugin called geishi, and that worked really well for the few attempts I made at it — not sure if that’s wp or for a different cms though (had it for an old site of mine).
If nothing else, I think I’ll start using the pre and <div style=(scroll stuff)> tags; the actual whitespace formatting was the main thing I wanted. Syntax highlighting was just icing.
@matt — I know; I was just putting [sourcecode] instead of w/ language attribute to make it a little quicker to post. In my posts, I was using [sourcecode language='csharp']…[/sourcecode]. It formatted it nicely, just messed around with the characters it was formatting.
Opinion? How does that inform? Is the blog going to stop working? I was looking for: black/white hard answer –from someone who knows. It’s 112F here, now (night), I don’t have AC, energy or patience to decipher amorphous vagueness of “opinion.”
>show code…in their blog
??? My First instinct was ‘this must be something to impress techs.’ –Yet, it appeared on my home page –‘New Feature,’ so 2nd thought: maybe this is like ‘You shudda up-graded (e.g. to IE 8), it WAS put on your home page, did you ignore the announcement’
kinda thing, some day. Did I need to stop what I was doing, ASAP –learn/do something, or Irrelevant? Since I Don’t Even get What the Feature is, thot I wouldn’t just hit the sand with my head, but ask.
Not to put too fine a point on it: “showing code on a blog” –isn’t that the same as…showing one’s underwear? I mean, one Knows it’s there, why show it? IF the answer is technical, you can skip it. The Main part I got from you: my blog Isn’t going to go haywire If I don’t Do something. Thank you for reply (I almost understood it, too). I need to go find someone, now, to turn down the heat, put out some of the forest fires (or just shoot me). Thanks.
d a V i n e
It’s an option: use it or don’t. There are better things to get upset about, surely.
Poppy – knowing a little of you and your blog :) I think we can safely say this is not something you need worry about / implement at all. If you survive the heat wave do get back in touch :)
>It’s an option: use it or don’t.
Nice. And if isn’t understood well enough to use OR to “get upset about”? We can get detailed, cogent, clear explanation from –you?
I just remembered one of the reasons why I quit coming in to the Forum.
The topic ‘Source Code Formatting’ is closed to new replies.