Posted inInformation Technology

A Bit of Green Bar for Your Blog

seasoned_geek by seasoned_geek

Green bar paper imageThose of us old enough to have worked with actual continuous form printouts have a certain soft spot for printed code. Oh, not on that nasty loose white paper which comes out of our laser printers, but that always in the right order continuous stuff. It made great scratch paper. Most WordPress themes don’t even try to get close to the look and feel for either the <code> or <pre> tags. On rare occasions you can find one which does a bang up job duplicating the numbered border and punched holes just like the real McCoy.

With just a tiny bit of effort you can get something close. When you are in your dashboard and hover over “Appearance” a sub-menu displays the “Customize” entry. Somewhere on the left of that screen will be the “Additional CSS” entry. There you can hack your current theme (somewhat) without hacking your current theme. You can override some very specific things, depending how deep into jQuery your current theme went to implement features.

Let’s take a look at the CSS code we need for a simple attempt at green bar.

code, pre {
    word-wrap: 0;
    white-space: pre;
    overflow: auto;
    line-height: 25px;
    padding: 2px 8px;
    margin-bottom: 10px;
    border: 1px solid #333333;
    background: linear-gradient(to bottom, #e6ffe6 50%, #FFFFFF 50%);
    background-size: 50px 50px;
   max-height: 500px;
}

Word of caution. Your current theme might have really pooched one or more of the tags. I had to use the <pre> tag above because the <code> tag is royally hosed in my current theme. How hosed you ask?

code, pre {
word-wrap: 0;
white-space: pre;
overflow: auto;
line-height: 25px;
padding: 2px 8px;
margin-bottom: 10px;
border: 1px solid #333333;
background: linear-gradient(to bottom, #e6ffe6 50%, #FFFFFF 50%);
background-size: 50px 50px;
max-height: 500px;
}

Nice, huh?

Yes, I could have spent days trying to figure out what got inherited where using Firefox’s “Inspect Element” option and hacked out 2 different styles for code and pre. Maybe code would then work as expected. That would be wasting quite a bit of time though. I need to educate the script kiddies who never worked with green bar. Hopefully you clicked on the image and zoomed the page as much as physically possible so you could see that isn’t just some “design” along the right and left edge. Usually it is 2 different sets of line numbers because band printers generally had 2 different LPI (Lines Per Inch) bands. Unlike most of the green bar things we see on-line today, with one color per line, the green bars were typically 1/2″. (Yes, there were also blue bars and I seem to remember seeing a box or two of gray bars.) Most real line printers accepted bands with different character sizes which required you to toggle the LPI switch usually between 6 and 8. If everything was right with the world, you would get exactly 3 lines in each bar at 6 LPI and 4 and 8 LPI. Keep in mind 8 was a bit hard on the eyes so it was used sparingly by most shops. The two different sets of line numbers are for the two different LPI. They also helped the lowly computer operator get the form lined up correctly in the printer. When loading paper into the LP27 back in the day I would line the perf up where I “thought” it was supposed to be, then tapped the “test pattern” button, let it print a few lines, tapped the button again to stop the test pattern, checked the placement against the pre-printed line number, made any needed adjustments, then hit “formfeed” and tapped on-line.

A few months into my computer operations career I could skip the test pattern step with green bar and a few other forms because I _knew_ exactly where the perf needed to be placed in the printer.

Please take a look at this site for an example of greenbar which went farther. They used a table though so not a generic solution.

Here is another solution I have not played with.

Roland Hughes started his IT career in the early 1980s. He quickly became a consultant and president of Logikal Solutions, a software consulting firm specializing in OpenVMS application and C++/Qt touchscreen/embedded Linux development. Early in his career he became involved in what is now called cross platform development. Given the dearth of useful books on the subject he ventured into the world of professional author in 1995 writing the first of the "Zinc It!" book series for John Gordon Burke Publisher, Inc.

A decade later he released a massive (nearly 800 pages) tome "The Minimum You Need to Know to Be an OpenVMS Application Developer" which tried to encapsulate the essential skills gained over what was nearly a 20 year career at that point. From there "The Minimum You Need to Know" book series was born.

Three years later he wrote his first novel "Infinite Exposure" which got much notice from people involved in the banking and financial security worlds. Some of the attacks predicted in that book have since come to pass. While it was not originally intended to be a trilogy, it became the first book of "The Earth That Was" trilogy:
Infinite Exposure
Lesedi - The Greatest Lie Ever Told
John Smith - Last Known Survivor of the Microsoft Wars

When he is not consulting Roland Hughes posts about technology and sometimes politics on his blog. He also has regularly scheduled Sunday posts appearing on the Interesting Authors blog.