A stylesheet for NetNewsWire which optimises your feed reading experience with clean typography, clever CSS and crafty JavaScript.

Download and install

ollicle-reflex8.zip

Double-click the unzipped .nnwstyle file and NetNewsWire will copy it to where it needs to be.

~/Library/Application Support/NetNewsWire/StyleSheets/

This style uses JavaScript to do some things CSS alone cannot. Make sure you enable it

• NetNewsWire Preferences
  • Browsing
    • News Items
      • Enable JavaScript

Requirements

I have not tested this style extensively with anything other than the current version of NetNewsWire (3.1.3) and Safari 3.1 (which determines the version of WebKit NetNewsWire is sporting).

Note: styles for NetNewsWire 3 do not affect the Combined view - only the Traditional and Widescreen views.

Key features

• Simple clean style

  Doesn’t get in the way of your choice of feed reading font and size. New for Version 6: added some simple styling to make data tables easier to read.

• Clever image handling

  Large images are scaled to fit available space. New for Version 6: automatic alignment of smaller images, avoiding awkwardly squashed text.

• Automatic line height

  Optimises line spacing of the feed text to suit your window and font size. More about this: Flex CSS with JavaScript for better reading

• Del.icio.us Tagometer

  The number of del.icio.us bookmarks for the linked webpage is displayed along with the most popular tags they assigned to it. New for Version 6: a little hackery to see through feedburner urls and a more compact and stylish look.

• Tidy diff display for recent feed changes

  With Highlight Differences checked in NetNewsWires general preferences you can toggle between the current and previous version of a changed feed. New for Version 6: feed changes are highlighted in a vertical bar in the left hand column. Hovering the bar with your cursor highlights additions inline, clicking it hides additions and reveals the deleted content.

• A choice of layouts

  Two layouts to choose from: One column (default for NetNewsWires Widescreen layout) with the feed info in the footer, or two column (default for the Traditional layout) with the feed info persistent in the right hand margin. New for Version 6: now possible to set a default irrespective of your choice of NNW layout (see below).

• Dark or light theme

  Choose between the default white background or the image enhancing black background. New for Version 6: changed method for setting black as the default (see below).

• Per feed layout and theme prefs

  Clicking the little button in the top right hand corner of the feed pane toggles the preference pop-up for your currently viewed feed. Cookies NetNewsWire shares with Safari are used to store your selection of layout or theme for any post from that feed. New for Version 6: the preference pop-up now scales nicely when you make the feed text bigger and smaller with Command +/-.

• Customisable defaults

  New for Version 6: If you don’t like my selection of defaults in Ollicle Reflex I have made a few of the prefences more easily configurable. I have removed the unintuitive hack for changing the default theme (adding “Black” to the filename of the the nnwstyle package). Now you will need to roll up your sleeves and launch your text editor.

  Locate the Ollicle Reflex style package ~/Library/Application Support/NetNewsWire/StyleSheets/Ollicle Reflex.nnwstyle reveal it’s contents by right (or control) clicking it and selecting “Show Package Contents”.

  At the top of the contained “javascript.js” you will find values set within the curly brackets of var userPref = {};. To set a default layout you need to first uncomment the line by removing the // from the start of the line. Otherwise make sure you only edit what falls between the colon and the comma, and ensure you leave the quotes around the layout and skin names. Note the last item shouldn’t have a trailing comma.

  To see your changes take effect it is necessary to relaunch NetNewsWire so it can update it’s cache of the style.

  Maybe someday I’ll try my hand at making a small AppleScript app to edit these options in a more friendly manner. If in the meanwhile you manage to break it (the JavaScript elements of the style will stop working), you can always come back here and download the style again.

Screenshots

I’d love to have a screencast to give you a better preview of the style. For now here’s a few screenshots that illustrate the font size and layout flexibility. Although, rather than waste time looking at them, I recommend scrolling back up the top of this page and downloading it.

Widescreen NetNewsWire layout

One column layout by default

Larger font size

Two column—smaller font size

Traditional NetNewsWire layout

Two column layout by default

Larger font size

One column—larger font size

Black background

Blog entries

ollicle.com entry: Reflex for NetNewsWire

Update entry: Del.icio.us Reflex

Update entry: Safari 3 fix for Ollicle Reflex

Update entry: Ollicle Reflex refined for smarter feed reading

Rough version history

First version of Ollicle Reflex

An evolutionary improvement on Ollicle Flex. Makes use of the wonderful jQuery to help stretch what's possible in a NewNewsWire style further again. Ollicle Reflex introduced:

• A new preference ‘UI’.
• Optional black background (nice for images).
• Inline feed styles stripped for consistent feed legibility.
• Some small tweaks to the display of images.
• Fixed position news title now only appears when you scroll down the page.
• And improvements to most of what was good in Flex!

Also:

Added in version 4

• Del.icio.us Tagometer
• Per item Highlight differences deleted content toggle

Version 5 fixes some issues with Safari 3 beta

Version 6 refines almost everything previous versions offered, in particular:

• Intelligently positions smaller images.
• Adds customisable layout and background defaults.
• Completely new diff display.
• Scalable pref interface.
• Easier to read data tables.

Version 7:

• Line-height user pref now works.
• Added pref to hide del.icio.us tagometer.

Version 8:

• Respects the layout of consecutive images typical of image galleries.
• Avoids the load ‘jump’ of images that have specified dimensions.