Simplr

Version 4.5.2
Behold! the power of telling a single story.
  1. Table of contents

    1. About Simplr
    2. Installing the theme files
    3. Enabling comments on pages
    4. Using page templates
    5. Customizing the sidebar
    6. Special classes and styled elements
    7. Standards compliance
    8. License information
    9. Development and help
    10. Credits and thanks
  1. About Simplr

    Simplr is a single-column theme for WordPress. It provides a unique format for narrowing focus to the content at hand. Simplr is about reducing clutter.

    Simplr version 4.5 is compatible with Wordpress 2.5.x.

    The Simplr theme features:

    • a theme options menu, which allows
      • control over fonts and text size
      • control over the layout and alignment
    • standards compliance with
    • option for enabling comments on pages
    • a robust stylesheet and separate print stylesheet
    • highly semantic markup
    • latest Widgets compatibility

    Using Simplr Effectively

    The key to using the Simplr theme effectively, in my opinion, is to limit the number of posts appearing to one: one column, one post. Posts are then accessed in index pages (i.e., with the previous/next post links) or in Simplr's unique Recent Posts sidebar content.

    To limit the number of posts appearing on the blog pages to one, go to Options › Reading and change the value for Blog Pages › Show at most: to 1. But that's just how I think this theme is best used.

  2. Installing the theme files

    The theme is installed just like any other WordPress theme. You can read more detailed installation instructions on the WordPress Codex in Adding New Themes.

    If you are upgrading from an older version, first reset the theme options in the Theme Options submenu. Then delete all the Simplr theme files and folders before uploading the new version.

    To install the theme:

    1. Download Simplr
    2. Extract the /simplr/ folder from the archive
    3. Upload this folder to the /wp-contents/themes/ directory
    4. Activate the theme in the Dashboard › Design menu
    5. After activating, the Design › Theme Options will appear
    6. Enjoy. And then consider donating.

    Support and donations

    If you would like to support this theme or just say "Thanks," please consider donating. Voluntary support from users is what makes providing WordPress themes possible, so consider throwing a few bucks my way. Even the smallest donations are earnestly appreciated.

  3. Enabling comments on pages

    Pages are usually considered static in blogging and different from posts, which are what make a blog a blog. Comments are not displayed on pages by default and the author's name is also omitted; however, you can enable both of these features with this theme.

    To enable comments on a page:

    1. In the Write › Page menu, expand the Custom Fields box
    2. In the Custom Fields box, add a new key with the exact text: comments
    3. Add any text for a value (some text must be included for the key to save)
    4. Click Add Custom Field to save the key/value
    5. Comments should now be enabled on that page

    Enabling comments simply attaches the comments.php file to the page. You can turn off comments on a page by deleting the comments key/value. This does not delete any exisiting comments, but simply disables them from loading with the page.

  4. Using page templates

    There are three page templates included with the Simplr theme: Archives Page (archives.php), Links Page (links.php), and Sitemap Page (sitemap.php). You can add a title, text, and enable comments and/or an author bylines (see above) with page templates.

    To use the page templates:

    1. In the Write › Page menu, expand the Page Templates box
    2. From the drop-down, select the page template to use
    3. Add a title and text (optional) for the page
    4. Click Create New Page / Save to publish the page

    The Archive Page displays archives by month and by category (with a link to each category RSS feed). The Links Page displays all the links by link category. The Sitemap Page produces an exhaustive list of all pages and all posts, and lists all category, monthly, and tag archives.

  5. Customizing the sidebars

    For complete control over the sidebar without editing the theme files, use the Design › Widgets menu options. Here you have complete control over the sidebar content.

    The Simplr theme will correctly display all of the default widgets. There are, however, hundreds of other widgets available that do all sorts of things; therefore, some widgets will require additional CSS declarations to be added to the style.css file.

    Unforunately I can't write CSS for other widgets/plugins. I can't help you learn CSS, but I can help you use CSS.

    For help learning CSS, visit:

    The Simplr theme automatically replaces a few of the default widgets that come with the Widgets plugin, e.g., Meta, Links, Search, with ones that match the default Simplr sidebar style.

    Similarly the theme also automatically loads some of its own widgets, e.g., RSS Links, Home Link. This allows the default Simplr sidebar to be completely replicated using the Widgets.

  6. Special classes and styled elements

    The Simplr theme stylesheet (the /simplr/style.css file) includes specific styles for some special classes and many HTML elements. Some explanation may be helpful for some of the styled HTML elements.

    Note that these classes and elements won't work correctly when entered into the visual rich editor. I highly recommend disabling the visual rich editor feature in your user profile.

    Styled elements

    The Simplr theme includes information for many, many HTML elements (e.g., blockquote, q, ins, del) but it may be useful to note how Simplr handles two particular HTML elements: em and strong.

    I would like to promote semantic markup in blogging. It helps make the content more accessible, consistent, and future-friendly. This theme considers em (emphasis) different from i (italics), and strong (strong emphasis) different from b (bold).

    Bold and italics refer to the appearance of the text, whereas em and strong refer to levels of emphasis put on the word(s). It's the difference between presentation (b/i) and meaning/context (em/strong).

    1. I shouted <strong>stop doing that!!</strong>
    2. Did you read the <b>readme.html</b> file?

    In item a, the <strong> element denotes strong emphasis and adds meaning/context to the words. In item b, the <b> element simply bolds the text and is purely cosmetic.

    Imagine if someone were reading your blog aloud. You would want them to shout "stop doing that!" but not to shout "readme.html!" right?

    Below are examples of how the <em>, <strong> and <b>, <i> elements have been styled for Simplr:

    Emphasis
    Used to add meaning and context to text
    em
    Used to indicate emphasis
    You <em>should not</em> be late.
    strong
    Used to indicate stronger emphasis
    He shouted <strong>You're fired!</strong>
    Presentation
    Used to style text (not to add meaning)
    b
    Used to bold text
    Find the word <b>happy</b> in the glossary.
    i
    Used to italicize text
    Go to the <i>Presentation</i> subpanel.

    For more information on how to write semantic markup in your blog, visit:

    Headings

    Headings for the content area have been styled to display correctly: with more space above than below as content must logically follow headings. Headings help create an outline of the content on your page. They guide the reader and also help machines understand the structure of content.

    While there are no hard-and-fast rules regarding this, I believe the headings should follow a logical progression, e.g., h1 › h2 › h3 › h4 › h3 › h3 › h4 … . There should not be two h1-level headings on a single page. Therefore, since post and page titles are h2-level, the only headings that should be used in the content area are h3h6.

    Special classes

    There are certain conventions amongst many WordPress themes for special classes. Notably common are the image classes. Again, these won't work correctly if entered directly into the visual rich editor.

    You should have a basic understanding of HTML before using these classes. I won't be able to help you learn HTML. I can, however, help you use HTML.

    Alignment classes
    Used to align elements, notably images
    alignleft - Floats element to the left, e.g.,
    <img class="alignleft" … /> <p class="alignleft" … />
    	XXXXXXX
    	⌈¯⌉ XXX
    	⌊_⌋ XXX
    	XXXXXXX
    <img class="alignleft" src="http://www.example.com/example.jpg" alt="Example" />
    alignright - Floats element to the right, e.g.,
    <img class="alignright" … /> <div class="alignright" … />
    	XXXXXXX
    	XXX ⌈¯⌉
    	XXX ⌊_⌋
    	XXXXXXX
    <img class="alignright" src="http://www.example.com/example.jpg" alt="Example" />
    center - Centers element as a block, e.g.,
    <img class="center" … /> <span class="center" … />
    	XXXXXXX
    	  ⌈¯⌉  
    	  ⌊_⌋  
    	XXXXXXX
    <img class="center" src="http://www.example.com/example.jpg" alt="Example" />
    content-column - Sets element in column (Should be used with one of the elements above), e.g.,
    <p class="content-column alignleft" … /> <div class="content-column alignright" … />
    <div class="content-column alignright"> … </div>
    Icon element classes
    Used to add a Silk icon to any HTML element
    download - Adds a download icon, e.g.,
    class="download"
    Download this file
    <a class="download" href="http://example.com/example-file">Download this file</a>
    html - Adds an html (web) icon, e.g.,
    class="html"

    This webpage is great!

    <p class="html">This webpage is great!</p>
    pdf - Adds a pdf icon, e.g.,
    class="pdf"
    The Adobe pdf is a …
    The <span class="pdf">Adobe pdf</span> is a &hellip;
    zip - Adds a zip (compressed archive) icon, e.g.,
    class="zip"
    Get the zip
    <a class="zip" href="http://example.com/example-zip">Get the zip</a>
    Micellaneous classes
    Other presentational classes that can be applied to elements
    important - Adds an info icon and other styles, e.g.,
    class="important"

    Lorem ipsum importanto habeo inciderint mei at …

    <p class="important">Lorem ipsum importanto habeo inciderint mei at &hellip;</p>
    caps - Used to style text in small-caps, e.g.,
    class="caps"
    I work at Ini-Tech
    I work at <span class="caps">Ini-Tech</span> &hellip;
  7. Standards compliance

    The Simplr theme is compliant with both XHTML and CSS standards. What does this mean? An explanation of web standards from The Web Standards Project:

    Complying with web standards can give your web pages greater visibility in web searches. The structural information present in compliant documents makes it easy for search engines to access and evaluate the information in those documents, and they get indexed more accurately.

    Accessibility is an important idea behind many web standards. Not only does this mean allowing the web to be used by people with disabilities, but also allowing web pages to be understood by people using browsers other than the usual ones — including voice browsers that read web pages aloud to people with sight impairments, Braille browsers, hand-held browsers, teletext displays, and other unusual output devices.

    You can read more about developing with web standards at 456 Berea Street.

    hAtom microformat

    In addition to XHTML and CSS web standards, the Simplr theme implements the hAtom 0.1 microformat. Microformats are markup that express semantic information in webpages.

    Programs can extract information from webpages marked up in a microformat much like feed readers extract information from Atom or RSS syndicated feeds.

    hCard microformat

    hCard is a microformat that expresses basic contact information much like a vCard, except within your blog itself. Basically this is done by using <span>'s with certain class attributes.

    The first name, last name, and website information for the admin user is automatically used to create an hCard that is placed in the footer and followed by basic copyright information.

    The hCard microformat is used throughout the theme, actually, for author links, bylines, and comment authors. You don't need to do anything, as basically hAtom and hCard are ways of making your blog more accessible.

  8. License information

    The Simplr theme, © 2006–2008 Scott Allan Wallick, is licensed under the GNU General Public License:

    This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.

    This program is distributed in the hope that it will be useful, but without any warranty; without even the implied warranty of merchantability or fitness for a particular purpose. See the GNU General Public License for more details.

    You should have received a copy of the GNU General Public License along with this program. If not, see http://www.gnu.org/licenses/.

    Please feel free to alter the Simplr theme in any way that pleases you. All I ask is that you allow my original design credit to remain.

  9. Development and help

    If something isn't working correctly with this theme, please visit Simplr on Google Code, the project home, to file issues, report problems, help create documentation, etc., because the more everyone shares, the better things can be.

    You can also access the Simplr Subversion repo, which hosts pre-release fixes and allows changes to be tracked. Please ignore if unfamiliar with Subversion.

    Please feel free to send me an email if you're having a problem; however, I will ask that you start an issue on the Simplr project home (see above) before problem solving. Thanks.

  10. Credits and thanks

    A special thanks goes to Andy Skelton, who taught me heaps. Andy I collaborated to create the Sandbox. Thanks to Rick Lee for his thoughtful feedback. And to Adam Freetly for helping me see 20 things I had to fix.

    Icons

    The file icons are from the Silk Icons collection by Mark James. The feed icon is from the Feed Icons collection by Matt Brett.