How I Set Up My Indieweb WordPress Site

This site runs WordPress, but there was some question as to how I set it up and what I use to run it. It continues to evolve, but I thought I would go over it…specifically how I sent it up for some of the Indieweb stuff I’ve been working on.

Standard Plugins

  1. Character Count for Post Content and Excerpt(Link) – Because I need to be aware of the 140 character limit of Twitter, one of the services I send my content to, I need to know the character count of what I’m typing. This adds that to my editing screen
  2. EWWW Image Optimizer(Link) – It reduces file sizes for images to ensure faster loading
  3. Pushover Notifications(Link)or the forked alternative Pushbullet Notifications(Link) for WordPress – This plugin sends notifications of site events to my phone. The Pushover version is actively maintained and allows for extensions.
  4. Simple Local Avatars(Link) – Overrides the default of using the Gravatar service for profile pictures to storing them locally.
  5. WordPress SEO by Yoast(Link) – While I’m not obsessive about Search Engine Optimization, I find this plugin assists in my writing by reminding me about the importance of certain elements.
  6. Hum(Link) – This is a simple URL shortener. So for each post, there is an equivalent URL address at di5.us. This allows me to give out easier to enter links to longer post titles.

The Indieweb Stuff

  • WordPress Webmention(Link) – Adds webmention support for WordPress. This allows communications between sites.
  • Semantic Linkbacks(Link) – Adds richer content to WordPress comments received by Webmention. For example, interprets them as reply, repost, like, favorite, mention, etc. This allows different displays and actions to be done with them
  • Semantic Comments(Link) – One of my own plugins. It changes the display of WordPress comments based on the information from Semantic Linkbacks. It presents the profile pictures in a Facepile for the various types of mentions with the comments separately below.
  • Indieweb Taxonomy(Link) – Semantic Linkbacks is all about receiving webmentions for the various semantic types. But this plugin, another one of mine(although I credit several with contributions), adds new terms to WordPress posts for responding to content on another site. So, a post on this site can be a reply to another site, a like, etc. It will automatically send a webmention to the other site, if that site supports it, of course.
  • Syndication Links(Link) – Another project, which adds fields to a post for the corresponding versions on other networks. It also adds links to same to the post.
  • H-Card Tools – Still under development and not yet available for download, this is just the profile widget marked up appropriately, in the sidebar of the site.

A Few Choices

  • There is an alternative to my Syndication Links plugin…a plugin called WordPress Syndication (Link).  It automatically adds the links to the post, and extracts the data from a variety of sources that post to other sites. This includes NextScripts Social Network Auto-Poster(Link) or Mailchimp’s Social plugin(Link), and even Bridgy(we’ll get back to Bridgy in a moment).
  • The theme I use is a custom one I built, but the most popular theme for Indieweb sites is Sempress(Link). My theme isn’t quite refined enough for most people, but if you want it, a copy can be downloaded here. The version in use on my site is just a colored version of the minimal style the theme offers.

Bridgy

Bridgy is not a WordPress plugin, or something you need to install(although you can host it yourself). It is a service that you can link your accounts on places like Twitter and Facebook to, and it will pull in comments, likes, etc from those sites and send them to your site to be integrated. This requires the Webmention and Semantic Linkback plugins to understand what is being sent.

To the Future

I enjoy developing this site as a learning tool. I hadn’t done much WordPress development before this and it is very useful to know.

For anyone who comes here considering trying my setup, I’m always available to help. For those who are trying my plugins…they are still being refined, but feedback and contributions(of code) are appreciated.

This site is under development, so it does change regularly. I will often summarize some of the changes with a post, but sometimes not.

Announced My Website Version 3.0

Back in April, I announced Version 2.0 of this website, since I relaunched it. Now I announce Version 3.0. I wrote the code again, which continues to be a learning experience.

But in order to finish it, I needed to bring it live, so I could test out the various options I’m experimenting with. There is a lot similar to the previous edition. For now, the links to various syndication and communications methods, as well as a search box, are shared on the menu bar with the various ways to filter content.

In addition to Articles, longer form text like this, you can see the types of notes I’ve been filing. There is still more to do to clean that up. A lot of it is based on a custom plugin for WordPress I wrote to add Likes, Replies, and other common conventions, as well as the necessary markup for them. My development of this site and its plugins is why I now have the Github link to that work.

The site is continuing to iterate, and I’m continuing to learn. In the meantime, comments are appreciated. I have more to do. Writing pieces like this is aspirational.

  • Such as bring back the syndication links on individual posts, which involves rewriting that, which is another plugin
  • I have two other options coded for a banner image to test
  • The Bio on the Sidebar is still part of a bunch of behind the scenes development I want to do

 


 Screenshot from 2014-09-06 23:49:10

 

And all of this…and I haven’t actually been writing much. Oh, well.

Contemplating Contact Methods

In my last article, I was contemplating how to handle communications with individuals using this website. Unfortunately, technology isn’t quite there yet. Someone will have to build it. To some part, that might be another hobby for me.

The problem as I explored this that has keep me stalled is the walled garden problem. Sites like Facebook or Twitter want you to embed their code, which does a lot more than open up the service. At the least all these scripts embedded in your website slow it down. Some functions don’t even have the option for integration.

One can’t rely on asking people to install pieces of software, especially the less technically inclined. Which means you need to have a simple solution that takes advantage of what people already have.

So, in terms of instant messaging, we have Facebook and Google Hangouts(formerly Google Talk). Both had support for a common standard, XMPP. Google Hangouts is still backwards compatible with XMPP for who knows how long. Facebook is compatible until April 30, 2015, when they will discontinue support. Neither has an alternative way of accessing their service, other than their own tools.

So, that leaves me with little choice right now but to roll my own solutions. But that is the essence of the Indieweb movement I’ve gotten involved in. Of course, I’m not really a programmer, but I can do some things.

Screenshot from 2014-08-24 22:58:46So, if you look at this test for a new configuration for this site(may be in place if you are reading this in the future), I have the links at the time, which are all syndication points…Twitter, Facebook, Google Plus, RSS, etc… other locations to see the same content, if that is the way you want to seem them.

 

 

 

Below the syndication links(aka social media), I have the mockup of the new business card style profile. I want to add communication icons to this card style I have, but other than email, I, at the moment have none. This has been stalling me for some time now. This is not the final version.

 

Screenshot from 2014-08-24 22:58:46

Here is the old layout…I have no better tagline…I really need one. But, I hope to add the buttons for email and other ways to reach me. But I lack many methods.

Screenshot from 2014-08-25 00:43:54

 

 

 

 

 

 

So, next, I’m thinking of trying an experiment. Setting up some software you can click on the site and communicate with me. You don’t have to know what the protocol is, and it should hopefully work in a browser. There is one individual I saw in researching who allows you to click a link that rings his phone.

So, what do you think? Remember, you can comment using any of the links below. You can even use the contact form on this site by clicking here.

Unified and Contextual Communications

A while back, I was reading Tantek Çelik’s attempt to better define People Focused Mobile Communications. I have had the pleasure of meeting Tantek on two separate occasions at Indiewebcamp events. Ever since I missed a discussion on this matter at the end of this month, I’ve been thinking about it, although not just for mobile.

Tantek asked, “What if our mobile devices focused on people first and apps second? Remember when they used to? When you looked up a person first, and decided to txt, call, or email them second?”

I remember when I used Trillian on Windows, and now Pidgin on Linux to unify my instant messaging contacts. I didn’t have to care if Bob was on AIM, YIM, ICQ(dating myself there, aren’t I?).

I don’t mind installing applications as methods of communication, but that is the plumbing. I don’t see people going off and saying they want to know how their water gets to their sink. They just want it to work. But, as time has gone on, companies have moved away from allowing third-party clients, which means that third-party clients that take multiple services and a common interface may not be possible in the future.

So, that means that any people-focused communication has to tell a service to launch their application to handle it. The proposal would have you visiting the person’s website, see their page that shows methods of communications in order of priority, look for the method of communication, tap/click it, and you are taken to the website/native application that handles that service.

And, if you make the site smart enough, it can change the presentation based on availability and other factors. If you want people to authenticate their identity somehow, it could show different presentations to friends over strangers.

It sounds very nice. But how does one build such a thing? Or even start building toward such a thing. I’ve been building things I myself want to have for my site. .

There are two ways for a web browser to register handlers for specific types of communication. One is outlined in this Mozilla document and shows how websites can register themselves. Gmail, for example, offers to registers itself to handle email. The second is the registering of an app to handle these. This is pretty common on Android, for example…that a specific action can launch an external application to handle it. For example, if I click a Youtube link on a webpage on my phone, it will ask me if I want to open it in the Android Youtube app. Until recently, iOS has done this using URL handling schemes, but apparently in iOS 8, they will be getting something called App Extensions that will allow this functionality.

Even Facebook got into the app to app communications issue at their last developer conference with AppLinks.

So, in the end, the barrier is that the desktop experience is fragmented, the mobile experience slightly less so, but there is currently no way to ensure a consistent communications experience. If you don’t believe me…try clicking this email link. Did it open your usual email or webmail client?

If the web is the medium by which we communicate, and the web is being sectioned off into silos or walled gardens…sites whose goal is to keep your communications and activities wholly inside their ecosystem, then how do you make communications transparent so the person trying to reach you doesn’t have to know what medium you prefer, that is all handled for them?

So, let’s go back to how we build such a thing. For now, it is create a space…a website that tells people where to reach you. In the old days, we’d use a business card…but the modern tools have the same utility.

In the below shot, from one of my previous articles on this site, I have a series of social buttons that tell you how to find me on Facebook, Twitter, etc… but not how to communicate with me.

That will be changing…or at least enhancing…as soon as I figure out how to convey that. In the meantime…you are welcome to try and find me whatever way you wish…

card

References