The Flat template is—in my opinion—a simple and elegant WordPress template.
Still, when printing blog pages, the output contains a large amount of whitespace.
CSS Customization
Using the template customization feature of WordPress, I adjusted the CSS of the Flat template to suit my needs.
The following CSS fragment is a suggestion for producing a more concise print rendering using the Flat WordPress theme.
@media print { .site-info, .entry-meta, .nav-links, .tags-links, a::after, #bit, .fa { display: none; } #masthead .site-title, .hentry .entry-title { font-size: 30px; font-family: Handlee; } #masthead .site-title { padding-bottom: 0px; } .post { padding-top: 0px; } .hentry .entry-content { padding-top: 0px; } h2 { font-size: 24px; margin-top: 5px; } table.easy-table { max-width: 90%; } .easy-table th, .easy-table td { padding-top: 1px; padding-bottom: 1px; } }
Testing
I tested the print template live inside Firefox using the Developer Toolbar (Tools → Web Developer → Developer Toolbar) and the command media emulate print.
Chromium also offers a similar functionality in the Developer Tools (Ctrl+Shift+I) → Menu → More tools → Rendering → Emulate CSS media.