Customizing

Customizing the Look of Vienna

Ok, now that we've set a few basic preferences for Vienna, let's take a look at what it does best! Scanning headlines! To begin, click on the "BBC World News" feed in the left column. You will see the current headlines (not the ones displayed below), show up in the Articles section.

Vienna's default look with the BBC feed selected. Here is a brief overview of the columns in the Articles area. The blue dot shows whether or not you've read the summary of that news item. Depending on how you've set Preferences > General > Mark current article read, the dot will disappear:

  • after a short delay,
  • after you've clicked the dot itself,
  • after you've chosen the menu Article > Marked Read,
  • pressed the keyboard shortcut for "Marked Read," or
  • used the space bar to page through reach article headline.

The next column is the "Flagged" column which allows you to flag a headline you consider important, or want to come back to later. By clicking on the column headers you can also sort by that column, thus allowing you to find all the flagged articles in that feed.

Beside the flagged column is the paper-clip, or "Enclosure" column. This is empty if there is no "enclosure." If the headline has a link to a media file, like an mp4, mp4, or some other kind of audio or video, this column will show that.

View menu. Next to that column is the "Subject" column, basically this is the headline. To the right of that is the "Date" column which tells you when that headline was published.

It's also possible to show and hide other columns if you'd like. There are two ways. You can either click the triangle at the far right of the Articles list header. Or use the menu bar View > Columns, then check or uncheck the columns you wish to see.

Tip: Another standard user interface convention is to let you adjust the size of the columns. To do that just move your mouse over the header of the table, and between where the adjacent columns meet, you will notice your pointer turns in to a column with arrows pointing left and right. Click and drag the columns to be the width you want them.

Let's change the location of where the headlines and summaries are displayed. Currently the headlines are above the summary. If you click the headline, the summary associated with the headline will be displayed underneath it. However, this leads to a wide summary area, and text in wide lines is harder to read than text in narrow columns, which is why newspapers have lots of columns and don't print each story the full width of the paper.

Layout submenu. There are three layouts Vienna has to divide its interface. Currently we are looking at the "Report" layout. Just pull down the View menu, choose Layout, and then choose the Condensed option. This sets Vienna to a 3 column layout,which shows more headlines, and makes the summary area both narrower, and longer, thus showing more text and making it easier to read, in my opinion.


Quick Filtering Example

Vienna with an article selected. We will now see how to see more information about each headline.

Select the BBC news feed and the headlines are displayed in the next column over. Select one of those headlines and the summary is displayed in the column to the right of that. Using the methods I describe above, you can mark that headline "read" and move to the next one.

Filtering articles on 'obama.' But what if you want to search the news feed for a specific word? As you can see in the screen shot, there are two search fields. The search field in the toolbar allows you to search all the articles Vienna has, and you must hit "return" to start the search. The search field above the headlines allows you to search just that news feed, you only need to start typing to being the search. (If you don't see the search field directly above the headlines, just pull down the View menu and choose "Show Filter Bar.")

In this screen shot you can see I typed "obama" in the Filter Bar search field and all the articles with "obama" are shown and the others, without the word "obama" are hidden. This is a very quick way to search through lots of news for items specific to what you want.

Modifying Vienna's Style

Ok, let's get back to customizing the look of Vienna. In the next four screen shots you'll see a little of how you can change the look of Vienna to suit your style. Speaking of styles, the method for customizing how the summary is displayed is through "Style Sheets." Style sheets are an openly documented standard that work (or should) across all web browsers.

Vienna with new style. Each style Vienna can use is found in the View menu, under the Style submenu. If you choose "More Styles…" at the bottom of the menu, you will go to the Vienna web site and find even more styles you can use, with instructions on how to install them.

Vienna with new style. In these screen shots you can see I have the same headline selected, but each screen shot shows a different "look" for Vienna's summary area. This is because I chose a new style under the View > Style submenu. Some of the styles are better suited for a larger Vienna window. In order to keep the screenshots manageable in this web browser display, I made the Vienna window smaller than I usually keep it.

Vienna with new style. Changing the styles is as easy as choosing a menu.

Vienna with new style. If you like one of the styles, but don't like a color, or can think of a slight variation you'd like to change. It's fairly easy to do so. However, I won't go in to details here, except to say that it's best to duplicate the style you want to modify, give it a unique name, then edit the text-based CSS files to modify it the way you like! That's what I've done for my personal use.


Comments

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <p> <a> <i> <em> <b> <strong> <hr /> <br /> <pre> <tt> <sup> <sub> <small> <big> <h6> <h5> <h4> <h3> <h2> <h1> <blockquote> <cite> <q> <ul> <ol> <li> <dl> <dt> <dd> <del> <ins> <span> <code>
  • Lines and paragraphs break automatically.

More information about formatting options