How to post snippets of code

[vol7ron]

Recently I've been asked by several people how I formatted code similar to: [webmasterworld.com ]

There are a few simple rules:[/b]

1) Wrap the code in pre/code tags: [pre ][code ] ... code here ...[/code ][/pre ]

2) If you want the box and no horizontal scroll, then also add the quote brackets: [quote ][pre ][code ][/code ][/pre ][/quote ]

3) To make sure the whole code is formatted, every blank line in your code needs at least one space:
[quote ][pre ][code ]line1
<- one space
line2
line3
<- another space
line4[/code ][/pre ][/quote ]

4)To have indentations in the code, about every 6 spaces is turned into 3 spaces in the forum. So, _ _ _ _ _ _ when posting equals _ _ _ when you view it. The spacing is the biggest problem because you lose it when you preview it. It is extremely important to copy your post before you preview it. Then re-paste it when you wish to submit or make any changes. I usually code with 3 space indentation; I find it easier to use Notepad to replace every 3 spaces with 6 spaces.

So:

[quote ][pre ][code ]line1
_(one space)
__(6)_line2
____(12)____line3
_(another space)
line4[/code ][/pre ][/quote ]

Will turn into:

line1
 
 line2
 line3
 
line4

I hope this helps,
vol7ron

[edited by: Hawkgirl at 9:37 pm (utc) on Mar. 10, 2008]

[MarkFilipak]

vol7ron, you may be a Junior Member to webmasterworld, but you're a giant to me. Thanks!

[Hawkgirl]

Don't forget to read the site's rules on posting code - you can find them here [webmasterworld.com].

(Summary: only post relevant bits of code, make a test case, keep your code free of specifics, use style codes, and don't torture everyone else with "do my homework" requests.)

[vol7ron]

Thanks for the addition Hawkgirl.

Unfortunately, as you see above, if an admin formats your code, you lose the styling, unless they follow these practices. Above is a good example of how it would look like if you didn't copy your code before the preview and paste it before submitting. The last box originally looked like the following:

line1
 
   line2
      line3
 
line4

Cheers!

And thanks Mark.

[Hawkgirl]

Actually, if an admin did it, I'm sure it'd be right. I'm just a non-code-hacking moderator. But I do know that posting code is a tricky business (thus the rules and the quote-work-arounds), and the moderators of the code-heavy forums here at WebmasterWorld do a great job of keeping everything running as smoothly as possible.

[vol7ron]

:)

[Clark]

I don't know if the official rules cover this, but:

2) If you want the box and no horizontal scroll, then also add the quote brackets:

please do add the quote box because reading that page on my screen, which is 1024 x 768 makes a wide scroll causing the thread to be unreadable. Some people who are vision impaired will use 800 x 600 and as such that thread will be really intolerable and cause some people to be really lost.

[Hawkgirl]

No official rules, but of course we want everyone to be able to read the info here. I occasionally switch to 800x600 when I am VPNing and some sites do get a bit hairy with the formatting.

Clark, how often does this cause problems for you?

Not sure there's a good work-around right now, but we are very interested to know when things don't work well for everyone.

[Clark]

By that page I meant this page [webmasterworld.com].

I do get some scroll sometimes and more often an un-uniform layout, where the header won't be as wide as the middle part. Doesn't bother me unless there's a scroll.

I did send Brett a screenshot recently.

[Hawkgirl]

Thanks for letting us know!