13

Working on Accessibility

Bean with Tools on the Ocean of Storms flickr photo by NASA on The Commons shared with no copyright restriction (Flickr Commons) We’re taking a much deeper dive into accessibility lately. It is a fruitful and good thing to do but also one of those deceptively deep topics with lots of complications. As a result I’m learning a good bit so I better write it down before it’s all forgotten. Two Handy Tools Thanks to both Matt and Jeff, I ended up using a few different tools.1 Google’s Vox Plugin helps you get a better idea what the experience was going to be like for someone with issues seeing the website. Using this will enable you to understand exactly how some of your decisions play out. I found it very handy. As a minor warning, there appears to be no way to turn it off/on short of disabling the extension. Despite that, I really think it’s a good idea to spend some time using this tool. It really helps. The other useful tool so far has been the Siteimprove Chrome extension. It’s pretty handy to see what warnings/failures are in play in each page. It’s led me to realize that there are so many problems. Bits of Useful Code One of VCU’s requirements is a text only view for the […]

11

Correct Names in Comments

We had some trouble with the selected display name not showing up correctly in comments. It worked fine in themes which displayed post and page authors but comments was often incorrect. That wasn’t good from a user experience perspective and also concerned me a bit in terms of what students might expect to be showing vs what actually was showing. A bit of Google-ing prior to trying to write it from scratch led me to this post which I was able to add to a network activated plugin and be done with the issue. I tend to link in the source of stuff I used to solve the problem1 in the plugin. That gives me an embedded reference/footnote in case I ever need to revisit it and it provides a kind of credit as well. Good for me. Possibly even good for the author of the fix. Having a plugin network activated for fixes of this type is also handy. It keeps the plugin numbers down and ends up being a single place for adding/removing/troubleshooting random custom functions like this. 1 Harvard may not agree.

06

The Events Calendar Venue Issue

I’m a big fan of Events Calendar Pro. It makes all sorts of date related things in WordPress very pleasant. The free plugin also does a great job. I did run into a bit of an issue this afternoon as I tried to take events I created in one site and get them into another. Since the events are a custom post type you use the normal WordPress Tools>Export to get them out. That worked fine and I was able to import the events into the new site. The issue came with venues. I’d defined some Venues so I wouldn’t have to keep entering the same addresses again and again. I was able to export/import them in the same way I’d exported the events and they showed up fine as content. Unfortunately, it seems like plugin references the venues via post1 IDs. My imported venues ended up with different IDs and the IDs reference by the events ended up being random WordPress posts (in the traditional sense). This led to venues with names like ‘untitled 4’ or ‘a moment of calm in online teaching.’ Trying to change them on the backend to the venues I’d imported led to weird duplications and the prior information displayed no matter what I did. I didn’t have a huge number of events, maybe 13. […]

Troubleshooting WordPress

This is an attempt to explain a pattern of troubleshooting WordPress through a specific event and perhaps reinforce the need for me to be humble in all interactions with people. So even if you never have this problem this might be useful. Symptoms An admin for one of our sites using FeedWordPress and suddenly can’t see any feeds in her syndicated sites view for that plugin. She sends me an email. I drop into the site and check. All looks good to me. Sadly. Sadly. Sadly. I respond to her and say it seems to be working on my end . . . has she tried another browser, computer, login/logout/restart etc. It’s easy to end up assuming the person reporting the problem is wrong by default. I get a fair number of emails. Many of them, probably most of them, report problems that are more human than mechanical. It’s easy to fall into a trap of assuming it’s a human issue, especially if a superficial inspection confirms that suspicion. It’s also called a trap for a reason. Avoid it if at all possible and if you fall into it please attempt to climb out.1 A bit later she indicates that she has done these things and the problem persists. I go back to the site. It still works for me. […]

echo wp_oembed_get fix

Pure click-bait gold, baby!1 You know I’m focused on those high-traffic titles. And now on to the show . . . I’m doing a site for the esteemed Jon Becker’s school law class. The goal is to take tweets that exemplify really bad legal choices by public school administrators. They even have a hashtag – #schoollawwtf. Since we’re taking tweets into WordPress for further analysis we end up with some weird constraints. I can’t rely on useful titles if we want to automate this as the tweet content might contain any number of things and the regex to try to purify it wouldn’t be worth the hassle. New content wouldn’t have any body text either because it’s just a tweet. Granted, I could duplicate that text in the body but I didn’t really see much point in that. I opted to stick the tweet URL in a custom field. That soon led me to the handy wp_oembed_get function which was new to me.2 That worked very nicely for display on single posts (screenshot and code snippet below). Where it ended up failing me was when we needed to display a bunch of tweets in need of analysis. All I had were the Twitter oEmbed element to show and clicking on them would take you to Twitter-land rather than to thee […]

30

KSES Allow Twitter Widget Embed

The two little lines above keep the Twitter tag search widget embed code (below) from getting cleansed in the WordPress Editor. Keeping a chunk of these extra-curricular allowed elements in a plugin allows us to activate them on a per trusted user basis.

Archiving Slack Channels

Since we’re making channels in Slack via our project creation, it made sense to archive them when the project was completed. In projects (this particular post type) we have a custom field for the start date of the project and one for the end date of the project. Step one is to check on updates whether the post has the end-date field filled out. In my case, this is one of the legacy ACF fields that survived my great metadata purge. So checking it is done like so . . . The Slack archive API piece looks like this. And finally we run this function when projects are updated like so. We’re still experimenting with this workflow and archiving is a decent start. You can easily reactivate it and results still turn up in searches. It’s likely we’ll also rename it from p-whatever to z-whatever to get it out of the way.

WP API Posts Plugin

This is a little plugin I wrote while working with Jon Becker to build out the Ed Leadership Hub site. Essentially, we wanted students to be able to fill out a quick form and build out a profile page. As is my my wont, I went the Gravity Forms route. They could give a short bio, twitter account, and their portfolio URL. We’ll be tying in the the posts via Feed WordPress but it seemed like more hassle than it was worth to map the author id to this page. Pretty fun to be able to build out a solution on-the-fly and since all students were going to be in rampages I didn’t have to worry about WP not being upgraded or running from a non-HTTPS server. This chunk of the plugin builds out the HTML from the shortcode. You can see the data-url, data-num elements being populated. There’s a few other things in there I haven’t yet activated. Using data elements is the easiest way I’ve seen to pass variables to the javascript . . . the javascript looks for the altlab-getsposts id and then pulls the data elements from it. Once again, there’s some extra stuff in there for down the road that I haven’t implemented here.

Event Calendar & Participation

One pretty common need I’m starting to see around community-engaged learning is a way for students/faculty to submit events to a central calendar and then indicate their participation in various events. That comes with various program requirements. People want specific reflection patterns per event and have different ideas around what an event counts for in their program. That comes with additional metadata requirements, dashboard views etc. We did something like this with cultural events when we made the RVArts.org site.1 I’ve got at least three programs interested in this process and some are pursuing products like Give Pulse. So I took advantage of the request from the da Vinci Center to look at how quickly we could make a functional prototype that would – create a calendar of upcoming approved events for students allow students to submit reflections on those events with a particular structure allow students to submit additional events for approval generate data visualization and reporting for student reflection and for program analysis purposes I took the more difficult route and assumed we’d have no user accounts just to see what that felt like. With user accounts this become easier. Even with this restriction I was able to build out a functional custom theme in around three hours. Next time, it’d be considerably faster. We could easily bring […]

04

Outboard Memory – Query Thumbnails & Crop Images CSS Trick

Two little tricks that came up this week . . . Random Posts Must Have Featured Image Set Sometimes you want to query a random set of posts but only return those with featured images . . . you can using ‘meta_key’ => ‘_thumbnail_id’ like so . . . Handy. At least for me. object-fit: cover; Now that I’ve got featured images, I usually have a variety of aspect ratios making uniform layouts a pain. Often I’d have set those images as background images to deal with different aspect ratios and do a cover. Something like this. I was never a big fan of this method as I don’t like creating inline css and that’s the only way I could think to do it with dynamically created content in php or javascript. If just felt awkward. Enter object-fit and if you already knew of it I don’t know why you didn’t tell me. You can see the difference it makes in the two examples embedded below. Not earth shattering but really handy for stuff I do all the time. See the Pen GvNdjv by Tom (@twwoodward) on CodePen.