Whostyles

(THIS IS A WORKING DRAFT.)

The 'whostyle' is a way of styling syndicated hypertext from other writers. This could be a quoted excerpt or a complete article. A feed reader could use a 'whostyle' to show a post without stripping all of its layout.

Here is a sample note:

And here is the URL to the 'whostyle':

(Some other whostyles to try: h0p3, kicks, sphygmus, k0sh3k.)

Here is the text of the 'whostyle', if you want to fiddle with it:

Making a Whostyle

Basically, you are attaching all of your styles to a class called (*dun-dun*) 'whostyle'! The 'whostyle' element can be any kind of HTML element (on this page it is a div) but the parent might assign it any kind of 'display' or 'width' or 'overflow'. You are allowed to define other non-layout styles like the border, colors and fonts.

All styles within the file must be attached to the .whostyle selector, unless it's an @-rule (such as @font-face.)


        .whostyle { ... }
        .whostyle p { ... }
        .whostyle blockquote { ... }
      

It is assumed that sanitize.css is loaded before the whostyle css is loaded.

Load some of the examples linked above to see fuller prototype examples.

Broadcasting the Style

Quite simply, place a rel="whostyle" link in the metadata of your HTML pages.


      <link rel="whostyle" href="/css/whostyle.css">
      

You can attach multiple whostyles by attaching a title to subsequent link tags:


      <link rel="whostyle" title="dark" href="/css/whostyle-dark.css">
      

A missing 'title' attribute indicates the default whostyle.

To attach to your Atom or RSS feed, use the xml-stylesheet directive:


      <?xml-stylesheet href="/css/whostyle.css" type="text/css"?>
      

(TODO: I hope to also attach an XSL file that can be used to display an RSS or Atom feed using the whostyle class.)

Loading Whostyles

Two main approaches to embedding hypertext from RSS feeds, microformats or your basic copy-and-paste:

  1. Inline: place the hypertext right in your page. (Could conflict with your other CSS.)
  2. IFrame: store the hypertext in a srcdoc attribute of an IFrame. (The approach used on this page---and used by Twitter and YouTube for embedding their stuff.)

While the #2 option (iframes) is the cleanest way to ensure that the styles show up properly, option #1 is certainly possible. However, you will need to audit each style independently.

(TODO: Some guidelines for sanitization and modifying the whostyle should be given here. Specific style attributes will be whitelisted at different levels. Also, external URLs will only be allowed in specific ways.)

Thank you to 'sphygmus' for first dabbling in this!