👓 whitehouse.gov Redesign | inkdroid

Read whitehouse.gov Redesign (inkdroid.org)
TLDR; By “redesign” I actually mean clusterfuck. As of last Thursday 47% of the 315 whitehouse.gov URLs I’ve collected during 2017 are now 404 Not Found
Dollars to donuts this goes down to switching CMSes from Drupal to WordPress–probably because the tech team doesn’t know Drupal, but also doesn’t know how to remap the URLs or to port over any of the data. I’ll bet it’s down more to incompetence than it is being evil, though being evil may be part of it too.

👓 Experiments with Instagram and WordPress | Island in the Net

Read Experiments with Instagram and WordPress by Khürt WilliamsKhürt Williams (islandinthenet.com)
Earlier this year I started using an Adobe Lightroom plugin to export my images directly to Instagram. I also use an Adobe Lightroom to WordPress plugin from Automatt...

Accessibility on the Web

I certainly don’t go out of my way to follow the topic of accessibility, though I do think about it occasionally. It’s apparently bubbling up more frequently as something in need of some dire attention on both the web and in real life.

I ran across three different pleas in less than the span of an hour, so it’s something I’ll commend to everyone’s attention. Rachel’s tweet has some nice linked resources. I’ll have to take a closer look at what I can do to better support these ideas myself.

I’m glad that WordPress.org has a feature filter checkbox for “accessibility ready” on their themes page, but they should begin using that flag to filter out those which aren’t and just not showing them. It would be nice to have that type of functionality to be able to sort plugins by as well, or to leverage plugins to support it against the threat of being de-listed.

I highly recommend these two additional articles I saw that touch upon two different areas:

Excluded from Confoo Speaker Dinner: What Happened and How it Made Me Feel by Nicolas Steenhout

Spooled Twitter Thread: OK Third-Party WordPress, We Need To Have A Come-to-Jesus Meeting About Your Accessibility Flare by Amanda Rush

👓 Spooled Twitter Thread: OK Third-Party WordPress, We Need To Have A Come-to-Jesus Meeting About Your Accessibility Flare | Amanda Rush

Read Spooled Twitter Thread: OK Third-Party WordPress, We Need To Have A Come-to-Jesus Meeting About Your Accessibility Flare by Amanda Rush (Customer Servant Consultancy)
This post originally started as a Twitter thread. Since those can be difficult to read in some circumstances, and since this content is I think valuable for more than just WordPress Twitter, I’m spooling it up and re-sharing as a complete post. I’ve also added a link and a video to this. OK thir...

Reply to Storify Bites the Dust. If You Have WordPress, You Don’t Need Another Third Party Clown Service

Replied to Storify Bites the Dust. If You Have WordPress, You Don't Need Another Third Party Clown Service by Alan LevineAlan Levine (CogDogBlog)
How many more times do people have to get stiffed by a free web service that just bites the dust and leaves you bubkas? A monster post, some ranting on companies like Storify who offer free services that leverage our effort to get worth enough to get sold – when they do they just yank our content, an approach for local archiving your storify dying content, a new home spun tool for extracting all embeddable content links and how to use it to create your own archives in WordPress. Storify Is Nuking, for no credible reason, All Your Content Okay there are two kinds of people or organizations that create things for the web. One is looking to make money or fame and cares not what happens once they get either (or none and go back to flipping burgers). The other has an understanding and care for the history and future of the web, and makes every effort to make archived content live on, to not leave trails of dead links.
I like Alan Levine’s take on type one and type two silo services. Adobe/Storify definitely seems to be doing things the wrong way for shutting down a service. He does a great job of laying out some thought on how to create collection posts, particularly on WordPress, though I suspect the user interface could easily be recreated on other platforms.

I would add some caution to some of his methods as he suggests using WordPress’s embed capabilities by using raw URLs to services like Twitter. While this can be a reasonable short term solution and the output looks nice, if the original tweet or content at that URL is deleted (or Twitter shuts down and 86s it the same way Storify has just done), then you’re out of luck again!

Better than relying on the auto-embed handled by WordPress, actually copy the entire embed from Twitter to capture the text and content from the original.

There’s a big difference in the following two pieces of data:

https://twitter.com/judell/status/940973536675471360

and

<blockquote class="twitter-tweet" data-lang="en">
<p dir="ltr" lang="en">I hope <a href="https://twitter.com/Storify?ref_src=twsrc%5Etfw">@storify</a> will follow the example set by <a href="https://twitter.com/dougkaye?ref_src=twsrc%5Etfw">@dougkaye</a> when he shut down ITConversations: <a href="https://t.co/oBTWmR5M3A">https://t.co/oBTWmR5M3A</a>.</p>
My shows there are now preserved (<a href="https://t.co/IuIUMvMXi3">https://t.co/IuIUMvMXi3</a>) in a way that none of my magazine writing was.
— Jon Udell (@judell) <a href="https://twitter.com/judell/status/940973536675471360?ref_src=twsrc%5Etfw">December 13, 2017</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8">

While WordPress ostensibly displays them the same, one will work as long as Twitter lives, and the other lives as long as your own site lives and actually maintains the original content.

Now there are certainly bigger issues for saving video content this way from places like YouTube given copyright issues as well as bandwidth and other technical concerns. In these cases, perhaps embedding the URLs only within WordPress is the way to go. But keep in mind what it is you’re actually copying/archiving when you use the method he discusses.

Incidentally, I use both Broken Link Checker and Post Archival in the Internet Archive plugins to save a copy of content as well as to help fix broken links on my site when services or sites go down unexpectedly.

Those who are interested in better saving/archiving their content might appreciate the following links/resources:

Side note: I prefer the closer Yiddish spelling of bupkis. It is however a great term for what you often end up receiving from social silos that provide you with services that you can usually pretty easily maintain yourself.

👓 Storify Bites the Dust. If You Have WordPress, You Don’t Need Another Third Party Clown Service | CogDogBlog

Read Storify Bites the Dust. If You Have WordPress, You Don’t Need Another Third Party Clown Service by Alan Levine (CogDogBlog)
How many more times do people have to get stiffed by a free web service that just bites the dust and leaves you bubkas? What follows is a monster post. You will find me ranting ar companies like St…

Threaded Replies and Comments with Webmentions in WordPress

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!

From the comments list in my Admin UI, I can write a reply and it not only lives on my site but it can now be sent as a comment to the site that made the original comment! As an example, here’s my first one and the resultant copy on the site I was replying to.

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.

A diagram of where comments live when sent via webmention.
Each site composes and owns its own content and sends the replies to the other site.

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.

Implementation

Prerequisites

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.)

Plugins

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.

Themes

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:

Plugin

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.

Use

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:

<a class="u-in-reply-to" href="https://islandinthenet.com/manually-adding-microfomats-markup/">Khürt</a>

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:

<a class="u-in-reply-to" href="http://www.example.com">&​#8203;​</a>

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.

Future

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.

Caveats

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:

<link rel="webmention" href="http://example.com/wp-json/webmention/1.0/endpoint" />
<link rel="http://webmention.org/" href="http://example.com/wp-json/webmention/1.0/endpoint" />

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.

Special Thanks

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!

​​​​​​

👓 WordPress is a Typewriter by Jack Baty

Read WordPress is a Typewriter by Jack Baty (baty.net)
Using WordPress makes me feel like that boy at the Type-In. I feel like the words are going right onto the paper. Sure, the metaphor is a little thin, but the point is that when writing with WordPress (or any CMS, really), the distance between what I’m typing and what I’m publishing is very short. The only thing closer is editing HTML directly on a live page, but that’s something only crazy people do. On the other hand, publishing a static site is like sending a document to a printer. I have to make sure everything is connected, that there’s paper in the machine, and then wait for the job to finish before seeing the output. If something needs editing, and something always needs editing, the whole process starts over.
I’ve never thought of it in these terms, but there is a nice immediacy and satisfaction to WordPress for this reason. (Though naturally one shouldn’t compose in their CMS in any case.)

I might submit that his issue is a deeper one about on which platform and where to publish though given that he’s got almost as many personal websites as I do social silos. The tougher part for him is making a decision where to publish and why in addition to all the overhead of maintaining so many sites. However, I’m not one to point fingers here since I’ve got enough sites of my own, so I know his affliction.

OPML files for categories within WordPress’s Links Manager

Last week I wrote about creating my following page and a related OPML file which one could put into a feed reader to subscribe to the list itself instead of importing it. I haven’t heard anyone mention it (yet), but I suspect that like I, some may be disappointed that some feed readers that allow OPML subscriptions don’t always respect the categorizations within the file and instead lump all of the feeds into one massive list. Fortunately there’s a quick remedy!

WordPress in its wisdom used a somewhat self-documenting API that allows one to create standalone OPML files by category. Thus if you only want to subscribe to just the feeds categorized as IndieWeb related in my OPML file, you can append the category id to the end of the URL to filter the others out.

The main OPML file: http://boffosocko.com/wp-links-opml.php
The IndieWeb only file: http://boffosocko.com/wp-links-opml.php?link_cat=1521

So in general, for WordPress sites one can append ?link_cat=[category id] (with or with out the brackets) to the main URL for the OPML file typically found at http://www.example.com/wp-links-opml.php.

I was going to post about this later this week after running across it this weekend, but by odd serendipity, while I was subscribing to Henrik Carlsson’s site I noticed that he posted a note about this very same thing recently! Thanks for the unintended nudge Henrik!

For quick reference, below are links to the specific OPML files for the following categories within my larger OPML file for those who’d like to subscribe to subsections:

👓 Using Custom Fields with PressForward and WordPress | PressForward

Read Using Custom Fields with PressForward and WordPress by Amanda Regan
One of the questions that the PressForward team gets repeatedly is how publications can use custom fields to automatically print data about a post once it is published. Publications often wish to display a generic name, such as “The Editors,” on a post rather than the name of the user who published the post. On Digital Humanities Now we use custom fields to store the names of our Editors-at-Large for the week a piece is featured as well as the name of the Editor-in-Chief for that week.

👓 “How Do I Get a Job at Automattic?” | Ryan Markel

Read “How Do I Get a Job at Automattic?” by Ryan Markel (Ryan Markel)
I get about a half-dozen emails a year via my contact form asking me this question or asking related questions, like how to craft a resume, or what it’s like to work at Automattic. I thought I’d jot something down so I can just send a link the next time this happens, as my advice hasn’t chan...

👓 Gutenberg: First Impressions | Matt Cromwell

Read Gutenberg: First Impressions by Matt CromwellMatt Cromwell (Matt Cromwell)
Gutenberg is the future of content in WordPress. It will deliver the elegance of Medium but with far more power and flexibility of layouts and content types

👓 IndieWebifying my website: part 1, the why & how | AltPlatform

Read IndieWebifying my website: part 1, the why & how by Richard MacManus (AltPlatform)
I’ve decided to re-design my personal website, richardmacmanus.com. My primary reason is to become a full-fledged member of the IndieWeb community. If I’m writing about Open Web technologies here on AltPlatform, then I ought to be eating my own dog food. Another reason is to discover – likely ...