custom post style

From IndieWeb
Jump to: navigation, search

Custom post style is the practice of styling individual posts differently from the rest of the site styles.

Contents

Why

There are at least a few reasons why you may want to support custom post styles.

  • special styling for a holiday
  • testing / showing / teaching new styles
  • post with a complicated table that needs custom styling
  • ...

How to

No general recommended technique yet. Check examples and brainstorming and try similar approaches.

Indieweb Examples

Kartik Prabhu

Kartik Prabhu using Bundle has custom post styles for certain articles which are stored as CSS files with the same filename as the slug of the article.

  • Oldest example from (2006-08-23): [1] imported from original Blogger post [2].
  • ... add more examples here ...

Aaron Parecki

Aaron Parecki using p3k has posted custom styles for certain articles, by adding an inline <style> tag to the contents of the article.

Tantek

Tantek Çelik using Falcon has custom post styles since 2015-07-04, e.g. added as an update to one recent post in particular:

Method:

  • use <style scoped="scoped" class="p-x-style"> ... </style> directly inside an h-entry in storage
  • retrieve that like any h-entry property and display as the last style element before the close </head> on the permalink for that post, again directly inside the h-entry, so it applies to it.
  • use style scoped to show custom post style on post in-stream (e.g. on homepage)
    • Note: As of 2015-07-03 only Firefox desktop/Android/OS supports style scoped - but maybe that's ok and will provide a good real world use-case for other browsers to add support.

Itch previously documented:

Silo Examples

Blogger

Blogger allows inserting <style> elements directly into the HTML of a post, which can be used as a hack for custom post styles. E.g. [3]

Tumblr

Tumblr allows post styles in the same way as Blogger.

Facebook

Facebook allows you to select a background color to notes

  • ...add more examples here...

Other Examples

Jason Santa Maria

Jason Santa Maria using ExpressionEngine had custom post styles for (almost) all posts made on version 4 of his site, between 2008-06-17 [4] and 2011-06-16. Version 5 has rarely featured some custom post styles, recognisable by the screenshots on the archive page.

Method:

  • External CSS from /css/entry/post_slug.css included in the <head>.
  • External JS from /js/entry/post_slug.css included in the <head>.

Brainstorming

nothing here currently.

See Also

Personal tools
Namespaces
Variants
Actions
Recent & Upcoming
Resources
Toolbox