I have been using Dave Winer’s Radio3 platform/bookmarklet, but would rather a process which would allow me to store bookmarks on my blog and POSSE them. I was therefore wondering about creating a similar bookmarklet that generates ‘Bookmark’ post-kinds, as well as the possibility of posting from mobile?
Am I going down the wrong path, especially as WordPress tinkers with ‘Press This’?
Aaron, the IndieWeb PressThis version bookmarklets are certainly a laudable solution for bookmarking things (even as WordPress moves the functionality of the original out of core), but I suspect you may find a more robust solution given some of your current set up.
Post Kinds Bookmarklets
Since you have the Post Kinds plugin set up, you might consider using that for a lot of the distance it can give you instead. I’ve written up some basic usage instructions for the plugin along with screenshots, but you’ll probably be most interested in the section on Bookmarklet Configuration. I’ve created a dozen or so browser bookmarklets, with handy visual emoji, for creating specific bookmark types for my site.
As for mobile posting, I’ll mention that I’ve heard “rumors” that David Shanske has a strong itch for improving the use of Post Kinds with a better mobile flow, so I would expect it to improve in the coming months. Until that time however, you can find some great tips on the wiki page for mobile posting. I recommend reading the entire page (including the section on Known which includes tools like URL Forwarder for Android that will also work with WordPress in conjunction with Post Kinds and the URL scheme described in the Bookmarklet Configuration section noted above.)
Using these details you should be able to make bookmarklets for your desktop browser and an Android phone in under an hour. If for some reason the documentation at these locations isn’t clear enough for you to puzzle out, let me know and I can do a more complete write up with screenshots and full code. (It’s still a piece of the book I need to expand out, or I’d include it here.)
WordPress has the option of setting up an email address by which to post to your site. You can configure this pretty quickly, especially for mobile use to send URLs to your website that way. I typically use this method for quickly bookmarking things to my site for private use at a later date.
There are also services that do bookmarking and include RSS feeds to your content which you could also potentially use to trigger IFTTT.com actions to post to your website. I have something similar to this set up for Reading.am which I’ve described in the past. You could certainly use this in combination with Diigo, which I see you use. Again, here more often than not I use these methods when I post things to my site as drafts or private posts.
Simple Twitter UI buttons on an IndieWeb-enabled site can allow Twitter to become part of your commenting system.
Back at IndieWebCamp Austin, I became enamored of adding additional methods of interacting with my website, particularly for those who weren’t already on the IndieWeb train. I’d seen these types of interactions already on Tantek Çelik’s site in the past, so naturally I figured I would start there.
Some basic searching revealed that in IndieWeb parlance, these types of functionalities are known as web actions. While they’re often added to make it easier for one site with the proper infrastructure to interact with another, they’re also designed for social web silos (Like Twitter, Facebook, et al.) to do this type of interaction simply as well.
As a small scale experiment, I thought I would begin manually and add some simple interface to allow Twitter users (who may not yet have their own websites to use to respond to me instead) to be able to quickly and easily reply to, repost, or like posts on my site. A little bit of reading on the wiki and Twitter’s developer site allowed me to leverage something into existence pretty quickly.
Interestingly, although there are many plugins that help users simply share a blog post to Twitter, I couldn’t easily find a WordPress plugin that already allows these other interactions as options at all. I suspect it may be because the other side of the interaction of bringing the replies back to one’s site isn’t commonly known yet.
I was able to write a post, syndicate it to Twitter, upload the button images, and then inject the Twitter post ID (939650287622434816 in this example) for my syndicated copy into my post like so:
And voila! My new post now had some simple buttons that allow users a simple one click interaction with a popup window to reply to, repost, or like my post.
Naturally, through the “magic” of Brid.gy, I’m able to collect these responses via backfeed with the Webmention protocol using the Webmention Plugin for WordPress back to my own website. In simpler and less technical terms, if you use one of these buttons, your interaction with my website as posted to Twitter comes back to live on my website. Thus users can use Twitter to write a comment or reply on Twitter and it will display in my comments section just as if they had written it directly in my comments box. Likes and reposts are sent to my site and are displayed relatively naturally as facepiles under the comment headings “Likes” and “Reposts”.
I’ll do another manual example with this particular post, so feel free to use the buttons at the bottom of this post to make your response via Twitter if you wish.
Taking some of this code and abstracting into a plugin for others to use would be a nice feature. Doing this would also potentially make it available as a potential plugin in the larger IndieWeb suite of WordPress plugins. Perhaps it could be easily added into the codebase in one or another pre-existing plugins? I might think that David Shanske’sSyndication Links plugin or Bridgy Publish plugin might make sense as they’re already adding functionality for part of the publishing half of the cycle by either publishing to Twitter and/or importing the Tweet ID back into one’s WordPress site for potential display. One or the other could do a simple if/then on the existence of a syndicated Tweet, then extract the Twitter ID, and add the buttons to the interface appropriately.
It would be interesting to add full mark up to make <indie-action> functionality possible for a broader class of web actions, particularly if it could be integrated directly into WordPress in a more interesting manner to work with the Post Kinds Plugin or the IndieWeb PressThis type of bookmarklet functionality.
Instead of having these types of interactions injected at the bottom of the post, it may make more sense to have it display in the comment block instead.
I suspect that Facebook, Instagram, and others also enable some types of functionality, so adding the ability to use them the same way would be awesome. And even more so in the case of RSVP’s to events since Brid.gy handles those relatively well between Facebook and WordPress sites. (See this example.)
Try it yourself
Go ahead and use the buttons below to interact with this post via Twitter.
To that end, the missing piece on the other side of the equation seems to be the profile page of sorts that identifies me as a supporter of various causes. To remedy that, I’ve created a /Supporting page as the beginning of showing which organizations, institutions, artists, and other entities which I’m actively supporting or have supported in the past.
If you’re looking for something to support yourself, I highly recommend any of the organizations which I list there. I’ve added links to the organizations themselves as well as quick links for how to support them directly.
For the technically inclined, I’ve marked up the organizations with h-cards and include their homepages with u-url and p-name microformats as well as the rel=”payment” and u-payment microformats.
This is a virtual/online HWC meetup for website builders who either can’t make a regular in-person meeting in their city or don’t yet have critical mass to host one in their area. Everyone of every level is welcome to participate remotely! Don’t have a domain yet? Come along and someone can help you get started and provide resources for creating the site you’d like to have.
Interested in Attending https://2018.indieweb.org/baltimore
IndieWebCamp Baltimore 2018 is a gathering for independent web creators of all kinds, from graphic artists, to designers, UX engineers, coders, hackers, to share ideas, actively work on creating for their own personal websites, and build upon each others creations.
I really want to go to IndieWebCamp Baltimore not only for the IndieWeb portion, but it’s in one of my favorite cities!
If you’re interested in some of the most interesting things happening at the bleeding edge of what the web has to offer, this is the place, and these are the people. Bring your ideas and creativity for an excellent Bar Camp style weekend of fun!
Introduction to what one would consider basic web communication
A few days ago I had written a post on my website and a colleague had written a reply on his own website. Because we were both using the W3C Webmention specification on our websites, my site received the notification of his response and displayed it in the comments section of my website. (This in and of itself is really magic enough–cross website @mentions!)
To reply back to him I previously would have written a separate second post on my site in turn to reply to his, thereby fragmenting the conversation across multiple posts and making it harder to follow the conversation. (This is somewhat similar to what Medium.com does with their commenting system as each reply/comment is its own standalone page.)
Instead, I’ve now been able to configure my website to allow me to write a reply directly to a response within my comments section admin UI (or even in the comments section of the original page itself), publish it, and have the comment be sent to his reply and display it there. Two copies for the price of one!
This means that now, WordPress-based websites (at least self-hosted versions running the WordPress.org code) can easily and simply allow multiple parties to write posts on their own sites and participate in multi-sided conversations back and forth while all parties maintain copies of all sides of the conversation on their own websites in a way that maintains all of the context. As a result, if one site should be shut down or disappear, the remaining websites will still have a fully archived copy of the entire conversation thread. (Let’s hear it for the resilience of the web!)
What is happening?
This functionality is seemingly so simple that one is left wondering:
“Why wasn’t this baked into WordPress (and the rest of the web) from the start?”
“Why wasn’t this built after the rise of Twitter, Facebook, or other websites which do this as a basic function?”
“How can I get it tout suite?!” (aka gimme, gimme, gimme, and right now!!!)
While seeming simple, the technical hurdles aren’t necessarily because there had previously never been a universal protocol for the web to allow it. (The Webmentions spec now makes it possible.) Sites like Facebook, Twitter, and others enable it because they’ve got a highly closed and highly customized environment that makes it a simpler problem to solve. In fact, even old-school web-based bulletin boards allowed this!
But even within social media one will immediately notice that you can’t use your Facebook account to reply to a Twitter account. And why not?! (While the web would be far better if one website or page could talk to another, these sites don’t for the simple economic reason that they want you using only their site and not others, and not enabling this functionality keeps you locked into what they’re selling.)
I’ll detail the basic set up below, but thought that it would be highly illustrative to have a diagram of what’s physically happening in case the description above seems a bit confusing to picture properly. I’ll depict two websites, each in their own column and color-coded so that content from site A is one color while content from site B is another color.
It really seems nearly incomprehensible to me how this hasn’t been built into the core functionality of the web from the beginning of at least the blogosphere. Yet here we are, and somehow I’m demonstrating how to do this from one WordPress site to another via the open web in 2017. To me this is the entire difference between a true Internet and just using someone else’s intranet.
While this general functionality is doable on any website, I’ll stick to enabling it specifically on WordPress, a content management system that is powering roughly 30% of all websites on the internet. You’ll naturally need your own self-hosted WordPress-based website with a few custom plugins and a modern semantic-based theme. (Those interested in setting it up on other platforms are more than welcome to explore the resources of the IndieWeb wiki and their chat which has a wealth of resources.)
As a minimum set you’ll want to have the following list of plugins enabled and configured:
Other instructions and help for setting these up and configuring them can be found on the IndieWeb wiki, though not all of the steps there are necessarily required for this functionality.
Ideally this all should function regardless of the theme you have chosen, but WordPress only provides the most basic support for microformats version 1 and doesn’t support the more modern version 2 out of the box. As a result, the display of comments from site to site may be a bit wonky depending on how supportive your particular theme is of the microformats standards. As you can see I’m using a relatively standard version of the TwentySixteen theme without a lot of customization and getting some reasonable results. If you have a choice, I’d recommend one of the following specific themes which have solid semantic markup:
The final plugin that enables sending comments from one comment section to another is the WordPress Webmention for Comments plugin. As it is still somewhat experimental and is not available in the WordPress repository, you’ll need to download it from GitHub and activate it. That’s it! There aren’t any settings or anything else to configure.
With the plugin installed, you should now be able to send comments and replies to replies directly within your comments admin UI (or directly within your comments section in individual pages, though this can not require additional clicks to get there, but you also don’t have the benefit of the admin editor either).
There is one current caveat however. For the plugin to actually send the webmention properly, it will need to have a URL in your reply that includes the microformats u-in-reply-to class. Currently you’ll need to do this manually until the plugin can properly parse and target the fragmentions for the comments properly. I hope the functionality can be added to the plugin to make the experience seamless in the future.
So what does this u-in-reply-to part actually look like? Here’s an example of the one I used to send my reply:
The class tells the receiving site that the webmention is a reply and to display it as such and the URL is necessary for your webmention plugin to know where to send the notification. You’d simply need to change the URL and the word (or words) that appear between the anchor tags.
If you want to have a hidden link and still send a webmention you could potentially add your link to a zero width space as well. This would look like the following:
Based on my experiments, using a <link> via HTML will work, but it will send it as a plain webmention to the site and it won’t show up natively as a reply.
Sadly, a plain text reply doesn’t work (yet), but hopefully some simple changes could be made to force it to using the common fragmentions pattern that WordPress uses for replies.
Interestingly this capability has been around for a while, it just hasn’t been well documented or described. I hope now that those with WordPress sites that already support Webmentions will have a better idea what this plugin is doing and how works.
Eventually one might expect that all the bugs in the system get worked out and the sub-plugin for sending comment Webmentions will be rolled up into the main Webmentions plugin, which incidentally handles fragmentions already.
In addition to the notes above, I will say that this is still technically experimental code not running on many websites, so its functionality may not be exact or perfect in actual use, though in experimenting with it I have found it to be very stable. I would recommend checking that the replies actually post to the receiving site, which incidentally must be able to accept webmentions. If the receiving website doesn’t have webmention support, one will need to manually cut and paste the content there (and likely check the receive notification of replies via email, so you can stay apprised of future replies).
You can check the receiving site’s webmention support in most browsers by right clicking and viewing the pages source. Within the source one should see code in the <head> section of the page which indicates there is a webmention endpoint. Here is an example of the code typically injected into WordPress websites that you’d be looking for:
Also keep in mind that some users moderate their comments, so that even though your mention was sent, they may need to approve it prior to it displaying on the page.
If you do notice problems or issues or have quirks, please file the issue with as full a description of what you did and what resulted as you can so that it can be troubleshot and made to work not only for you, but hopefully work better for everyone else.
Give it a try
So you’ve implemented everything above? Go ahead and write a reply on your own WordPress website and send me a webmention! I’ll do my best to reply directly to you so you can send another reply to make sure you’ve got things working properly.
Once you’re set, go forward and continue helping to make the web a better place.
I wanted to take a moment to give special thanks to Aaron Parecki, Matthias Pfefferle, and David Shanske who have done most of the Herculean work to get this and related functionality working. And thanks also to all who make up the IndieWeb community that are pushing the boundaries of what the web is and what it can accomplish. And finally, thanks to Khürt Williams who became the unwitting guinea pig for my first attempt at this. Thank you all!
Without all the jargon, we’re actually using our own websites to carry on a back and forth threaded conversation in a way that completely makes sense.
In fact, other than that our conversation is way over the 280 character limit imposed by Twitter, the interaction was as easy and simple from a UI perspective as it it is on Twitter or even Facebook. Hallelujah!
This is how the internet was meant to work!
A hearty thanks to those who’ve made this possible! It portends a sea-change in how social media works.
For online material, I use the Post Kinds Plugin which does a good job of adding h-cite and p-read-of (experimental) microformats classes to the data for the things I’ve read.
Because Post Kinds doesn’t (yet?) support percentage finished or number of pages read, I generally do read posts for books by hand as notes with the relevant data. So I decided to add some better mark up to my book-specific read posts and added microformats classes of h-cite, u-url, u-read-of, p-name, p-author, h-card and dt-published. I’m far from an expert on microformats, but hopefully the way I’m nesting them makes sense to parsers off in the future. (Suggestions for improvement are more than welcome.)
I like Gregor’s idea of p-read-status for things he’s posting and will have to see how I can pull that off for posts in the future (or suggest it as an addition to Post Kinds). Presently I’m just adding a want to read tag, but that could be improved to better match the functionality I appreciate in silos like Goodreads. I’ll also have to load up Gregor’s recent modifications to Quill and test them out on my site as well. I know David Shanske has expressed interest in better aligning Quill and micropub clients to post to WordPress with Post Kinds in mind.
Read pages 381-461 to finish reading <span class="h-cite"><cite><a class="u-url u-read-of p-name" href="http://amzn.to/2zXnQDC" target="_blank" rel="noopener">Origin: A Novel</a></cite> by <span class="p-author h-card"><a class="p-name u-url" href="http://danbrown.com/">Dan Brown</a></span><time class="dt-published" datetime="2017-10-103 00:00:00"></time></span>
It’s also made me begin to feel itchy about some of my past quote posts and potentially revisiting them to add the appropriate h-cite and related mark up to them as well. (Or at least fix it moving forward.)
Incidentally, my real camp project was some heavy editing work on “The Book.” More on that later…
The creative community is still waiting on Patreon to officially address the new policy of passing transaction fees on to the patrons (backers), but it appears that co-founder and figurehead Jack Conte has been calling some of creators to discuss the situation with them. Jeph Jacques, the cartoonist behind Questionable Content (over 5,300 patrons as of this typing. though the number of patrons as been… fluid… for many Patreon creators in the last few days) tweeted about his conversation with Conte
Perhaps coincidentally, there was a session at IndieWebCamp Austin yesterday (12/09/17) entitled Payments, Pledges, and Donations, Oh My!. The link includes the video of the session via YouTube as well as notes.
The premise is that many creators already have their own websites/platforms for promoting or featuring their work. In some sense Patreon is only bringing a payment gateway (and apparently not a great one) as their sole feature. The conversation within the session was geared toward attempting to make it easier and simpler for creators to not only host their own work, but to accept payments and recurring payments directly. Some of the discussion was geared at making the payments systems seamless so that one could move them from one platform to another without losing hard won supporters and needing to start over again.
While we’re still in the very early days for improving the technology for this, hopefully some of the demos coming out of the camp later today will move the ball forward. Those should be posted on the IndieWeb YouTube channel later today as well.
For those looking for alternates (and particularly when they’ve already got their own websites), I suspect it’ll definitely be worth a look. Alternate platforms and methods were certainly discussed. The means of control for creators to inexpensively keep all of their workflow in-house is very near.
I wish I could have attended IndieWebCamp Austin in person today, but had a good time attending remotely! Thanks to everyone who made the remote experience so usable.
I’m also posting this in part to take a half-stab at person tagging people using homepage webmentions after the last session on post types in which Tantek mentioned tagging specifically. I can already tell this is something I wouldn’t do often without a much more automated system. #manualuntilithurts indeed!
I’ve also found a bug in Twitter in the process! Apparently I can tag people in photos there except for Tantek, who’s username is so short, it won’t populate their pull-down menu to let me add him.
Given Livefyre‘s origin as a commenting platform along the lines of Disqus and Intense Debate, this photo of their current offerings from Adobe makes it sound a lot like what the Webmention Open Spec does for my WordPress-based website.
We are proud to bring you the first alpha release of Linkback, an interesting suite of modules which can help integrate your website with the wider internet. Linkback provides the backend functionality to save both outgoing and incoming pings and webmentions involving remote sites.
Drupal 8, now (along with platforms like WithKnown, Perch, WordPress, Craft, Kirby, ProcessWire, Elgg, and Django) has Webmention support. Congratulations to Dan Feidt (aka HongPong) and everyone involved!
This means that more websites can communicate directly with each other on the open and decentralized web. (Wouldn’t you like to “@mention” someone from your own website to theirs?) It’s a rapidly growing reality on the internet.
You can find all of my audio editions and subscribe with your favorite podcast app here: martymcgui.re/podcasts/indieweb/.
Music from Aaron Parecki’s 100DaysOfMusic project: Day 85 - Suit, Day 48 - Glitch, Day 49 - Floating, Day 9, and Day 11
Thanks to everyone in the IndieWeb chat for their feedback and suggestions. Please drop me a note if there are any changes you’d like to see for this audio edition!
Sometimes it feels like I’ve got a bookmarklet (not unlike Huffduffer, but with a twist) that I use throughout the week, and at the end someone lovingly hand-creates a synopsis podcast just for me! Thanks Marty!!