01

Super Cleansing Cut/Paste into Tiny MCE in WordPress

Had someone cut/pasting from Google Docs into WordPress and it was ending up littered with internal style elements and super irritating span classes. I found this post which got me 95% of the way there and just added .removeAttr(‘style’) to get rid of the inline styles. Now I can just re-cut/paste and get a clean chunk of text.

24

Accessible ACF-Based Tooltip Dictionary

We have a bunch of world language professors prying at the edges of Pressbooks. One of the requests yesterday was to be able to create a mini-dictionary of target language words at the beginning of sections written in that target language. Mousing over the words would show their English equivalent. The intent is to have ready assistance for those who need it so that writing in the target language can happen earlier in the course. ACF came to mind pretty quickly for this case. I really just needed the ability to generate two values that are paired together- the target language word and the English definition. I need to be able to make as many of these pairs as the person wants to put in there. That’s custom made for the ACF repeater field. Now that I had an easy way for people to add the words, I just needed a way to do the tooltip display. There are 12,000 ways to do this but I just looked around for one that bragged on its accessibility. I found this example on codepen and went with it. This bit of php builds that content. Now that we have the the content and way to handle the tooltip piece, I needed to stick it at the top of the posts. That’s just […]

Will Wonka asking you to tell him again what WordPress can't do.

Workshop to Event Workflow in WordPress

I have been doing little other than semi-real web development for three weeks across a number of projects. It’s a level of sustained practice/work that I’ve probably never done before. Who knew that kind of focus could actually result in fairly dramatic improvement? One of the projects is the reconstruction of our ALT Lab department page and I have had the chance to really do some stuff that I’ve been considering for several years. There’s a lot going on in the site but I’ll focus on one little concept/workflow for the moment. We have two goals in this case. We want a browsable catalog of workshops we offer that can be shared with people so they can request them.1 We need a calendar of events. Those events will include workshops that are presented at a particular date. We use Events Calendar Pro for this and are very happy with it. Workshops – The Post Type Step one was to create a custom post type called ‘workshop’ and then assign some custom fields to it with ACF. That keeps the content fairly consistent in look/feel and gives us enough standardization to do other tricks. We ended up with a custom post interface that looks like the gif2 below. You can see the ability to add learning objectives, examples, audience etc. in […]

17

iFrame Height

We have a site on rampages.us that’s being used for the creation of world language OER modules. They’re using H5P and a variety of media elements with some text to give context etc. The goal was to be able to embed these pages on another WordPress site that is running PressBooks on another server. There are two levels of hassle I wished to make go away. I didn’t want them having to go into text view and I didn’t want them to have to guess how big the page was to set the iframe height manually. I started going down the road with a WordPress plugin for iframe resizer but was failing to do something right and got annoyed . . . so I went in multiple other directions. Given I had control of both sites, I decided I’d make my own little embed code cut/paste element on the source site that’d use a simple shortcode plugin on the destination site.1 The source site got a little element on the PHP end that would show you the embed code box if you were an editor or higher. A dab of javascript gets us the height and writes out the iframe details. A bit more javascript gives us a button that will copy it to the clipboard. Now the people can […]

stranger portrait - what?

Filtering WordPress Titles

As you may have seen here before VA passed a bill saying universities can’t have student email visible without written consent from the student. We had a legacy site that had student emails as part of the title structure for the posts. We had stuff titled stuff like This is twwoodward@ecuniv.edu post or This is twwoodward@mymail.ecuniv.edu. We want to remove a chunk so it’s not an obvious email any longer. The following function cleans up our two different email patterns so that the titles no longer include emails. It does this by tying a custom function to a WordPress filter. The first thing we do is get the post type. In this case we just want a custom post type we named profile. $type = get_post_type( get_the_ID( ) ); should get us that variable. Next, we’re defining the things we’d like to find in the title. $find = array(‘@mymail.vcu.edu’, ‘@vcu.edu’); – this is letting us look for multiple items and it could be many more than two. Now our if loop only runs if the $type equals ‘profile’ otherwise it just passes the $title variable right back unharmed. If it is a profile custom post type, it uses PHP’s built in str_replace function to look for the things we defined in $find, replaces them with our second variable (” in […]

Example WordPress editor view for the custom post type publications. Indicates various specific entry fields that help keep authoring easy and structured.

The ENVS Site Documentation & Program Syndication Aside

We’re on our way to building an interesting knitting of sites for our Environmental Studies program. Imagine a tiered connection of syndication that moves from student portfolio sites at the base through courses in the middle and up to the program at the top. It’s a pyramid of aggregation where the metadata can be added at each level. I feel like I’ve sketched this out before but, if so, I can’t find it. It doesn’t hurt to do it again anyway. So this is the basic idea. Students can build the kind of portfolios they want rather than highly constrained artifices that focus more on serving the program. Now the visual design and structure can be what the student wants. The only thing that needs to be consistent is the categories and tags used to indicate how that piece of content fits into the program/course. As long as a post is associated with an assignment1 or competency then it can be pulled elsewhere for consistent display, association with a particular course, etc. At a basic level, this structure provides a pretty frictionless workflow to have assignments bubble up to the program-level that are great examples of the kind of work your students can/will do. This is PR for potential students. Used properly helps build consistency in expectations between faculty. It […]

Man sweating as he tries to decided between the shortcode and gutenburg buttons.

WordPress Multisite Network Footer Plugin

We needed to put a data privacy footer link on all our rampages sites. To do that I added this code in our generic network activated plugin. Then we realized we’d need to skip that occasionally for particular sites and that’s why we ended up adding a loop to skip sites by ID. It could be fancier and enqueueI cannot spell this word. scripts etc. rather than just stapling them in but the pattern’s likely to be useful to others wandering in the darkness.

Forest xGump on a bench with the text simple is as simple does.

Make H5P Quiz Images Go Big by Default

When you add images to H5P questions, the default behavior is to present them small. You can then click to make them go full size. We didn’t want to do that with the histology stuff. Luckily you can override the css as described here. I didn’t test this against other H5P options so it may do more than other people would like but we’re only using quizzes so this is fine. Jeff also got us most of the way there with some javascript and could have done it all that way as well.