#two-col

Coffee is a brewed drink prepared from roasted seeds, called coffee beans, of the coffee plant. Coffee beans are found in coffee cherries, which grow on trees in over 70 countries, cultivated primarily in Latin America, Southeast Asia, and Africa.

‘Green Unroasted’ coffee is one of the most traded agricultural commodities in the world. Coffee can have a stimulating effect on humans due to its caffeine content. It is one of the most-consumed beverages in the world. Coffee has played a crucial role in many societies. The energizing effect of the coffee bean plant is thought to have been discovered in the northeast region of Ethiopia, and the cultivation of coffee first expanded in the Arab world. The earliest credible evidence of coffee drinking appears in the middle of the 15th century, in the Sufi monasteries of Yemen in southern Arabia. From the Muslim world, coffee spread to Italy, then to the rest of Europe, to Indonesia, and to the Americas. In East Africa and Yemen, it was used in religious ceremonies. As a result, the Ethiopian Church banned its secular consumption, a ban in effect until the reign of Emperor Menelik II of Ethiopia. It was banned in Ottoman Turkey during the 17th century for political reasons, and was associated with rebellious political activities in Europe.

Coffee berries, which contain the coffee seed, or “bean”, are produced by several species of small evergreen bush of the genus Coffea. The two most commonly grown are the highly regarded Coffea arabica, and the ‘robusta’ form of the hardier Coffea canephora. The latter is resistant to the devastating coffee leaf rust (Hemileia vastatrix). Once ripe, coffee berries are picked, processed, and dried. The seeds are then roasted to varying degrees, depending on the desired flavor. They are then ground and brewed to create coffee.

If you know basic HTML then there are a lot of extras you can use to enhance your posts. The good news is even if you don't know HTML they aren't hard to learn. This post will walk you through some of the ways to add extra formatting with CSS classes and custom tags.

To begin with if you are on a modern browser then these intro paragraphs before the jump are split into two columns. This happens automatically because I wrapped this content in a <div> with a class of "two-col." You can view the source of this page to see it in action. If you are using a browser that does not support multi-columns then a single column will appear as normal. However once the jump to the full article has been made the two columns revert back to a single column. This was a intentional decision to keep the flow of the article intact. It was fine to break the preview text into columns because most of the time it will be a small amount of text that is easy to digest in one glance. There is no scrolling needed to read the first column and then back up to the beginning of the second. One very important note about the way this is setup: due to constraints of Tumblr's text edit area the preview text before the jump must be in one single paragraph. This may seem like a nuisance at first but it's actually quite nice because the columns have a greater chance of being equal in height.

The bad news about the way the two-column feature is constructed is you have a very long paragraph after the jump when the two columns become one.

Another feature is the ability to highlight text with a <span> tag with a "highlight" class. I'm not sure how useful this will be for people, but there you have it.

Aside title This is an aside that was pulled out to the right, that is if you are viewing this article on a wider monitor. If not then it is inset in the article. Either way this is accomplished by adding a "marginalia-right" class to this paragraph.

Subheadings

The standard sub-heading tags of <h2>-<h6> are styled and are available for your use. The <h1> tag has been reserved for the post title. The subheading for this section is an <h2> tag.

For now to fill up space I'm going to repeat the first paragraph. I'll add formatting examples to this post as they're created though.

To begin with if you are on a modern browser then these intro paragraphs before the jump are split into two columns. This happens automatically because I wrapped this content in a <div> with a class of "two-col." You can view the source of this page to see it in action.

If you are using a browser that does not support multi-columns then a single column will appear as normal. However once the jump to the full article has been made the two columns revert back to a single column. This was a intentional decision to keep the flow of the article intact. It was fine to break the preview text into columns because most of the time it will be a small amount of text that is easy to digest in one glance. There is no scrolling needed to read the first column and then back up to the beginning of the second.

One very important note about the way this is setup: due to constraints of Tumblr's text edit area the preview text before the jump must be in one single paragraph. This may seem like a nuisance at first but it's actually quite nice because the columns have a greater chance of being equal in height.