WebmentionDressing

From IndieWeb
Jump to: navigation, search

WebmebtionDressing (demo) is an "iframe ready" webmention display that lets you view webmentions of a specific page on this wiki (for example this page). The code can also be configured to show webmentions of any other site using webmention.io.

It can work on static sites (it's javascript) but not with javascript-disabled browers (for the same reason ;) ).

Embeddind at Sites Using webmention.io

Simply edit SITE_ROOTS and DEMO_PATH at the top of script.js (as explained in the README).

You can then include an iframe with your own copy of WebmentionDressing (configured as explained above), and supply the current page's path as the URL's hash (e.g. #WebmentionDressing for this page or #2014/Online for 2014/Online).

Theming

To change the design (it doesn't have to be bootstrap), just edit the mustache templates at the bottom of index.html[1]. Of course, if you don't want it to be bootstrap you'll also need to redesign the rest of the html :)

This was the original intention of WebmentionDressing: to create an easy platform for designers to try out various ideas of comment presentation.

Interactive Theming

An earlier version of the template exists as a codepen.io [pen]. This enables realtime tweaking of templates. Remember to click "fork" before you begin so that you can save your changes :). You can either login to codepen via github, or simply save an "anonymous fork" (if you don't intend to maintain it later).

Contribs are Welcome

If you fork something nice (codepen, gist, or your own site), please let us know (e.g. post about it and webmention this page :)

Deployment

Acceptance :)

  • nice! thanks!! [2]
  • thedod, you could always add a page. [3]