Here are some examples of what a post with images might look like. If you want to display two or three images next to each other responsively use figure with the appropriate class. Each instance of figure is auto-numbered and displayed in the caption.

Figures (for images or video)

One Up

Morning Fog Emerging From Trees by A Guy Taking Pictures, on Flickr.

Two Up

Apply the half class like so to display two images side by side that share the same caption.

<figure class="half">
	<img src="/images/image-filename-1.jpg" alt="">
	<img src="/images/image-filename-2.jpg" alt="">
	<figcaption>Caption describing these two images.</figcaption>
</figure>

And you’ll get something that looks like this:

Two images.

Three Up

Apply the third class like so to display three images side by side that share the same caption.

<figure class="third">
	<a href="http://placehold.it/1200x600.jpg"><img src="http://placehold.it/600x300.jpg" alt=""></a>
	<a href="http://placehold.it/1200x600.jpg"><img src="http://placehold.it/600x300.jpg" alt=""></a>
	<a href="http://placehold.it/1200x600.jpg"><img src="http://placehold.it/600x300.jpg" alt=""></a>
	<figcaption>Caption describing these three images.</figcaption>
</figure>

And you’ll get something that looks like this:

Three images.

Alternative way

Another way to achieve the same result is to include gallery Liquid template. In this case you don’t have to write any HTML tags – just copy a small block of code, adjust the parameters (see below) and fill the block with any number of links to images. You can mix relative and external links.

Here is the block you might want to use:

{% capture images %}
	/images/abstract-10.jpg
	/images/abstract-11.jpg
	http://upload.wikimedia.org/wikipedia/en/2/24/Lenna.png
{% endcapture %}
{% include gallery images=images caption="Test images" cols=3 %}

Parameters:

  • caption: Sets the caption under the gallery (see figcaption HTML tag above);
  • cols: Sets the number of columns of the gallery. Available values: [1..3].

It will look something like this:

Test images
Testing Readability with a Bunch of Text

Portland in shoreditch Vice, labore typewriter pariatur hoodie fap sartorial Austin. Pinterest literally occupy Schlitz forage. Odio ad blue bottle vinyl, 90’s narwhal commodo bitters pour-over nostrud. Ugh est hashtag in, fingerstache adipisicing laboris esse Pinterest shabby chic Portland. Shoreditch bicycle rights anim, flexitarian laboris put a bird on it vinyl cupidatat narwhal. Hashtag artisan skateboard, flannel Bushwick nesciunt salvia aute fixie do plaid post-ironic dolor McSweeney’s. Cliche pour-over chambray nulla four loko skateboard sapiente hashtag.

Vero laborum commodo occupy. Semiotics voluptate mumblecore pug. Cosby sweater ullamco quinoa ennui assumenda, sapiente occupy delectus lo-fi. Ea fashion axe Marfa cillum aliquip. Retro Bushwick keytar cliche. Before they sold out sustainable gastropub Marfa readymade, ethical Williamsburg skateboard brunch qui consectetur gentrify semiotics. Mustache cillum irony, fingerstache magna pour-over keffiyeh tousled selfies.

Cupidatat 90’s lo-fi authentic try-hard

In pug Portland incididunt mlkshk put a bird on it vinyl quinoa. Terry Richardson shabby chic +1, scenester Tonx excepteur tempor fugiat voluptate fingerstache aliquip nisi next level. Farm-to-table hashtag Truffaut, Odd Future ex meggings gentrify single-origin coffee try-hard 90’s.

  • Sartorial hoodie
  • Labore viral forage
  • Tote bag selvage
  • DIY exercitation et id ugh tumblr church-key

Incididunt umami sriracha, ethical fugiat VHS ex assumenda yr irure direct trade. Marfa Truffaut bicycle rights, kitsch placeat Etsy kogi asymmetrical. Beard locavore flexitarian, kitsch photo booth hoodie plaid ethical readymade leggings yr.

Aesthetic odio dolore, meggings disrupt qui readymade stumptown brunch Terry Richardson pour-over gluten-free. Banksy american apparel in selfies, biodiesel flexitarian organic meh wolf quinoa gentrify banjo kogi. Readymade tofu ex, scenester dolor umami fingerstache occaecat fashion axe Carles jean shorts minim. Keffiyeh fashion axe nisi Godard mlkshk dolore. Lomo you probably haven’t heard of them eu non, Odd Future Truffaut pug keytar meggings McSweeney’s Pinterest cred. Etsy literally aute esse, eu bicycle rights qui meggings fanny pack. Gentrify leggings pug flannel duis.

Forage occaecat cardigan qui

Fashion axe hella gastropub lo-fi kogi 90’s aliquip +1 veniam delectus tousled. Cred sriracha locavore gastropub kale chips, iPhone mollit sartorial. Anim dolore 8-bit, pork belly dolor photo booth aute flannel small batch. Dolor disrupt ennui, tattooed whatever salvia Banksy sartorial roof party selfies raw denim sint meh pour-over. Ennui eu cardigan sint, gentrify iPhone cornhole.

Whatever velit occaecat quis deserunt gastropub, leggings elit tousled roof party 3 wolf moon kogi pug blue bottle ea. Fashion axe shabby chic Austin quinoa pickled laborum bitters next level, disrupt deep v accusamus non fingerstache.

Tote bag asymmetrical elit sunt. Occaecat authentic Marfa, hella McSweeney’s next level irure veniam master cleanse. Sed hoodie letterpress artisan wolf leggings, 3 wolf moon commodo ullamco. Anim occupy ea labore Terry Richardson. Tofu ex master cleanse in whatever pitchfork banh mi, occupy fugiat fanny pack Austin authentic. Magna fugiat 3 wolf moon, labore McSweeney’s sustainable vero consectetur. Gluten-free disrupt enim, aesthetic fugiat jean shorts trust fund keffiyeh magna try-hard.

Hoodie Duis

Actually salvia consectetur, hoodie duis lomo YOLO sunt sriracha. Aute pop-up brunch farm-to-table odio, salvia irure occaecat. Sriracha small batch literally skateboard. Echo Park nihil hoodie, aliquip forage artisan laboris. Trust fund reprehenderit nulla locavore. Stumptown raw denim kitsch, keffiyeh nulla twee dreamcatcher fanny pack ullamco 90’s pop-up est culpa farm-to-table. Selfies 8-bit do pug odio.

Thundercats Ho!

Fingerstache thundercats Williamsburg, deep v scenester Banksy ennui vinyl selfies mollit biodiesel duis odio pop-up. Banksy 3 wolf moon try-hard, sapiente enim stumptown deep v ad letterpress. Squid beard brunch, exercitation raw denim yr sint direct trade. Raw denim narwhal id, flannel DIY McSweeney’s seitan. Letterpress artisan bespoke accusamus, meggings laboris consequat Truffaut qui in seitan. Sustainable cornhole Schlitz, twee Cosby sweater banh mi deep v forage letterpress flannel whatever keffiyeh. Sartorial cred irure, semiotics ethical sed blue bottle nihil letterpress.

Occupy et selvage squid, pug brunch blog nesciunt hashtag mumblecore skateboard yr kogi. Ugh small batch swag four loko. Fap post-ironic qui tote bag farm-to-table american apparel scenester keffiyeh vero, swag non pour-over gentrify authentic pitchfork. Schlitz scenester lo-fi voluptate, tote bag irony bicycle rights pariatur vero Vice freegan wayfarers exercitation nisi shoreditch. Chambray tofu vero sed. Street art swag literally leggings, Cosby sweater mixtape PBR lomo Banksy non in pitchfork ennui McSweeney’s selfies. Odd Future Banksy non authentic.

Aliquip enim artisan dolor post-ironic. Pug tote bag Marfa, deserunt pour-over Portland wolf eu odio intelligentsia american apparel ugh ea. Sunt viral et, 3 wolf moon gastropub pug id. Id fashion axe est typewriter, mlkshk Portland art party aute brunch. Sint pork belly Cosby sweater, deep v mumblecore kitsch american apparel. Try-hard direct trade tumblr sint skateboard. Adipisicing bitters excepteur biodiesel, pickled gastropub aute veniam.

Sample Post

Below is just about everything you’ll need to style in the theme. Check the source code to see the many embedded elements within paragraphs.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Body text

Lorem ipsum dolor sit amet, test link adipiscing elit. This is strong. Nullam dignissim convallis est. Quisque aliquam.

Smithsonian Image

This is emphasized. Donec faucibus. Nunc iaculis suscipit dui. 53 = 125. Water is H2O. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. The New York Times (That’s a citation). Underline. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.

HTML and CSS are our tools. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus.

Blockquotes

Lorem ipsum dolor sit amet, test link adipiscing elit. Nullam dignissim convallis est. Quisque aliquam.

List Types

Ordered Lists

  1. Item one
    1. sub item one
    2. sub item two
    3. sub item three
  2. Item two

Unordered Lists

  • Item one
  • Item two
  • Item three

Tables

Header1 Header2 Header3
cell1 cell2 cell3
cell4 cell5 cell6
cell1 cell2 cell3
cell4 cell5 cell6
Foot1 Foot2 Foot3

Code Snippets

Syntax highlighting via Rouge

#container {
  float: left;
  margin: 0 -240px 0 0;
  width: 100%;
}

Non Pygments code example

<div id="awesome">
    <p>This is great isn't it?</p>
</div>

Buttons

Make any link standout more when applying the .btn class.

<a href="#" class="btn btn-success">Success Button</a>
Primary Button
Success Button
Warning Button
Danger Button
Info Button

The International System of Units (SI) [72 page pdf Brochure] is maintained by the Bureau International des Poids et Measures at it’s headquarters in Sevres near Paris, France. The Metric System as it is often known has a long history; supposedly invented in 1670 by Gabriel Mouton, a French clergyman, It was adopted by France in 1795 and by the United States in 1866. The system gained international status with the signing of The Convention of the Meter in Paris on 20th May 1875. The U.S. was one of the original seventeen signatory nations and is the only industrialized nation that still does not use the system.

Note: At this time, only three countries – Burma, Liberia, and the US – have not adopted the International System of Units (SI, or metric system) as their official system of weights and measures. Although use of the metric system has been sanctioned by law in the US since 1866, it has been slow in displacing the American adaptation of the British Imperial System known as the U.S. Customary System. The US is the only industrialized nation that does not mainly use the metric system in its commercial and standards activities, but there is increasing acceptance in science, medicine, government, and many sectors of industry.

CIA World Fact Book. 2000

In 1971 the U.S. Metric Study by the National Bureau of Standards resulted in a Report to the Congress called “A Metric America, A Decision Whose Time Has Come.” The report recommended that the U.S. should switch to the metric system deliberately and carefully through a coordinated national program, and establish a target date 10 years ahead. In 1992 NIST the National Institute of Sciences (The Successor to the National Bureau of Standards) published a report titled A Metric America: A Decision Whose Time Has Come – For Real (NISTIR 4858) June 1992. The US has spent over a century trying to switch to the metric system through a process of voluntary adoption.

The SI is without question more rational that the US Customary System and the British Imperial System on which the US system was based. But it has failed to gain acceptance in the US and its adoption in many other countries has been painfully slow. This is a classic example of the influence of network effects resulting in lock-in. But it is also an example of economic protectionism masquerading as defence of cultural heritage and patriotism. The adoption problems of the SI are not unique. When an established ontology is challenged by a newer ontology there will be resistance to the new ontology no matter how good it is. Ontologies are like Khunian Paradigms; new ontologies are resisted by those who have a vested interest in the old system. Ontologies, like jargon, can form barriers to market entry that effectively exclude potential competitors and protect established players. The benefits provided by these barriers can outweigh the benefits of adopting the new ontology. In such cases voluntary adoption will not occur. Establised players are acting out of self interest in resisting change.

Effective conversion from an old established ontology to a new replacement ontology requires more than encouragement it must be accompanied by coercion. In the UK enforcement of the metric system is proceeding through government mandated use in; the education system, the military, all government contracts and for all commerce. Government departments are also aggressively pursuing offenders like Tesco through the courts. This policy has generated a backlash. Groups like the BWMA are mounting popular resistance campaigns aimed at preventing change.

Building a great ontology is only the first step. Getting people to adopt it is far more challenging. Adoption is not driven by the merits of the new ontology alone. Enforcement is often required. The US will not become metric until congress is prepared to enact enforceable laws that mandate the use of the metric system.

Vannevar Bush and The Limits of Prescience

Today Vannevar Bush (rhymes with achiever) is often remembered for his July 1945 Atlantic Monthly article As We May Think in which he describes a hypothetical machine called a Memex. This machine contained a large indexed store of information and allowed a user to navigate through the store using a system similar to hypertext links. At the time of writing his essay Bush knew more about the state of technology development in the US than almost any other person. During the war, he was Roosevelt’s chief adviser on military research. He was responsible for many war time research projects including Radar, the Atomic Bomb, and the development of early Computers. If anyone should ever have been capable of predicting the future it was Vannevar Bush in 1945. He is an almost unprecedented test case for the art of prediction. Unlike almost anyone else before or since Bush was actually in possession of ALL the facts – as only the head of technology research in a country at war could be.

The Editor of the Atlantic Monthly introduced the article as follows:

As Director of the Office of Scientific Research and Development, Dr. Vannevar Bush has coordinated the activities of some six thousand leading American scientists in the application of science to warfare. In this significant article he holds up an incentive for scientists when the fighting has ceased. He urges that men of science should then turn to the massive task of making more accessible our bewildering store of knowledge. For years inventions have extended man’s physical powers rather than the powers of his mind. Trip hammers that multiply the fists, microscopes that sharpen the eye, and engines of destruction and detection are new results, but not the end results, of modern science. Now, says Dr. Bush, instruments are at hand which, if properly developed, will give man access to and command over the inherited knowledge of the ages. The perfection of these pacific instruments should be the first objective of our scientists as they emerge from their war work. Like Emerson’s famous address of 1837 on “The American Scholar,” this paper by Dr. Bush calls for a new relationship between thinking man and the sum of our knowledge. -THE EDITOR

The essay was prescient in many respects. However, it failed to anticipate several innovations that are fundamental to modern information management and made many predictions that are only partially correct. It is easy to ignore Bush’s off-target predictions and focus solely on what he got right, but this would be a waste of an opportunity. By examining the innovations Bush failed to anticipate and the predictions he got half-right, and even wrong, we can develop a better understanding of prediction itself.

Background

Before the War Bush had been involved in the design and construction of analog computers for many years. At MIT He led colleagues and students in the development a series of analog machines that could solve differential equations. In 1927 Bush and others started developing the Integraph – a machine capable of solving first order differential equations. This was followed by the Bush Hazen Differential Analyzer, a general purpose equation solver that could solve 6th order differential equations. The Bush Hazen machine was operational at MIT in 1932 and served as the prototype for many similar machines built elsewhere. Finally in December 1941 the Rockerfeller Differential Analyzer (RDA) became operational at MIT. Financed by the Rockefeller Foundation, this machine used vacuum tubes and relays. It weighed 100 tons and was immediately classified. It spent the war calculating artillery tables. By the Wars end the RDA was redundant having been superceded by totally electronic machines like the ENIAC.

As Director of the Office of Scientific Research and Development Bush was Roosevelt’s chief adviser on military research. He was an engineer, an expert administrator, a capable politician, and was not afraid of fight. He allocated funds and managed priorities for many of the major US funded research projects of the Second World War. At the end of the war when he wrote the essay he knew many secrets.

Veiled Secrets not Predictions

Vannear Bush’s paper was published at the dawn of the digital age in July 1945. Many of the “predictions” it contained were merely veiled descriptions of secret wartime developments that had yet to be declassified. When Bush wrote his essay the great electronic computers that had been developed to aid the war effort were still secret. The ENIAC was the first of these machines to be publicly announced by the New York Times on February 16th, 1946. Bush undoubtedly knew of ENIAC and other machines under development. The following quote from the essay is stated as a prediction but is actually a fairly accurate description of the ENIAC.

Moreover, they [computers] will be far more versatile than present commercial machines [punch card tabulators and hand calculators], so that they may readily be adapted for a wide variety of operations. They will be controlled by a control card or film, they will select their own data and manipulate it in accordance with the instructions thus inserted, they will perform complex arithmetical computations at exceedingly high speeds, and they will record results in such form as to be readily available for distribution or for later further manipulation. Such machines will have enormous appetites. One of them will take instructions and data from a whole roomful of girls armed with simple key board punches, and will deliver sheets of computed results every few minutes. There will always be plenty of things to compute in the detailed affairs of millions of people doing complicated things.

The first atomic bomb was detonated at the Trinity site in New Mexico on July 16, 1945. a few weeks after the essay was published. Bush is said to have had a nervous collapse after witnessing the test detonation. It’s success must have been a tremendous relief for Bush who had persuaded the President to commit the $2 Billion necessary to build the bomb. The following paragraph describing the impact of the war on scientific research, especially physics, seems to refer to the massive Manhattan Project and all the physicists involved.

It is the physicists who have been thrown most violently off stride, who have left academic pursuits for the making of strange destructive gadgets, who have had to devise new methods for their unanticipated assignments. They have done their part on the devices that made it possible to turn back the enemy, have worked in combined effort with the physicists of our allies. They have felt within themselves the stir of achievement. They have been part of a great team. Now, as peace approaches, one asks where they will find objectives worthy of their best.

Predictions

Bush starts his visionary predictions by suggesting that computers could be made to manipulate premises in than same way they manipulate numbers.

It is readily possible to construct a machine which will manipulate premises in accordance with formal logic, simply by the clever use of relay circuits. Put a set of premises into such a device and turn the crank, and it will readily pass out conclusion after conclusion, all in accordance with logical law, and with no more slips than would be expected of a keyboard adding machine.

He then describes the Memex as a personal desktop interactive device. However it is here that his foresight breaks down because the Memex it described as analog not digital. While it contained some computing components information was stored photographically on microfilm and retrieved electro-mechanically. The Memex was nothing like the room sized computers of the late 1940′s. In the 1946 New York Times article announcing the ENIAC the new computer was described as “an amazing machine which applies electronic speeds for the first time to mathematical tasks hitherto too difficult and cumbersome for solution.” It took a long time before people began to implement Bush’s suggestion that computers could manipulate premises as well as numbers. Alan Turing had understood that computers were manipulators of symbols and that those symbols could represent any concept. But this knowledge was tightly bound to his work on code breaking and he in turn was bound by secrecy not to discuss it.

Ultimately Bush’s prescience was limited by two factors: Failure to anticipate the emergence of fundamentally new technologies, and failure to predict the exponential improvements in many areas that such inventions would support.

The Relay gave way to the Thermionic Value which in turn gave way to the Transistor which itself was replaced by the Silicon Chip. Each paradigm shift maintained the exponential rate of growth in computing power. Bush could not have predicted this chain of technological advances. But as Moore has shown the exponential growth it has produced is predictable.

In 1945 the ENIAC could not even store its own meager program in what little memory it had and all data was stored externally. The idea of storing vast quantities of data digitally was not considered realistic, it was accepted that there had to be some form of external physical storage. Bush merely replaced the punched card with a microfilm. But memory storage advanced in a similar way to computing power, from mercury delay lines, and magnetic drums to William’s tubes, magnetic core memory and tape, to modern chip based RAM, and high speed disc drives. Today a standard home computer is typically shipped with over a 100 Gigabytes of storage and several hundred Megabytes of memory.

Bush’s biggest failings were in predicting implementation details and his most accurate predictions concerned the interaction of people and technology. The Memex is eerily similar to a networked PC running a web browser. Even Bushes description of the wearable camera is remarkably close. We don’t wear our cameras because they double as portable phones but everything else about them from their size to the number of photos they can take is remarkably accurate.

Conclusions

Reading this essay with hind sight, and knowing that large amounts of information were still secret in July 1945, one is forced to wonder who was the intended audience of the essay. The essay seems to be an inverse call to arms, aimed at the scientists and researchers who would have recognized their own secret war time work between Bush’s lines. In effect Bush was suggesting a path for post war research and development based on his uniquely broad knowledge of the state of technology. The Memex was a technological phoenix to be built from the ashes of wartime science. It was an example of how various wartime advances could be combined to create something awesome but benign. A modern library of Alexandria on every desktop.

The Memex

The ability to see even a decade into the future is impressive. That Vannevar Bush was able to see much further is remarkable and a testament to his brilliance. It would be a shame if he were only remembered as the inventor of hypertext. When in fact he foresaw the information revolution.