Over the last 8 months I’ve been tinkering on a WordPress site made for my wife Cori’s high school program. It’s a place for students most at risk of not graduating across three local schools to write, reflect, connect.

It’s a web site but there’s much more to it.

If you think Central Canada is just tranquil quiet life on a pasture, the kids in the city she teaches in face all the challenges and then some of any major urban setting. It seems just a feat to get to school.

And what Cori achieves with them i creating a sense of belonging is just this side of amazing. So I was excited when she asked me last summer about building a site for her program.

It’s a place called… WordPlace. And maybe it just looks like another class site where students post, there’s much more that happens away from the site that matters.

The “digital postcard” reference on the front refers to how in previous years, students wrote letters to each other, between schools, and responded back to each other via a system of paper notecards. Low tech. High connection.

Cori wanted a place where they could write safely, deeply, openly yet in a space more conducive and speedy in exchange.

Meet WordPlace.

We are slated to co-present our work this Wednesday in a session WordPlace: An Online Writing Space for Resilient Youth at the TCC 2020 Online Conference.

This post does not even get to what the site accomplished in the fall; I’m leaving that for Cori to blog about as she does so with heart. But by getting it started as a “place” back in October, one that the students knew about and used in school, we find it more compelling right now in this odd time of not having a physical school location.

WordPlace is by no means a replacement for the teaching, but it gives her students something to work from that is not some corporate designed shell. It’s a place co-created.

I’d like to say that the value of using WordPress and especially being able to drop in extra customizations above what comes out of the box, reinforces to me the benefit of being able to make technology doing what we want it to do. Most educational technologies make educators mold their plans to what a platform provides. WhizzyTech is easy to use but, what? you want to do that? No can do.

In a WordPress site I’ve been able to make small changes as we went, and discovered limitations or needs. In this case it’s a more useful way to fly than the cliché videos suggested.

Quite a few bits of the tinkering on WordPlace were also helpful in some of my other work, there ya go, bootstrapping.

This post is a code laden pile of the things I built on top of vanilla WordPress. Just to lay out the working parts of the engine.

The needs for the project were centered on simplifying everything possible, identity protection, anonymity/confidentiality, and offering friendly interface that would work on mobile devices — the classrooms only have a few Chromebooks and these are not kids who have laptops at home; they do nearly everything on their phones.

Not only are all the students brand new to WordPress, two of Cori’s teaching colleagues are novices too, and rather leery of technology.

The site is outwardly facing public, but logins are required for commenting, and seeing certain parts of the site.

Yes, below is a lot of code that will make most reader’s eyes glaze over. It’s here for my own note taking. And for many it will be a reason to just stop, go back to the WhizzyTech platform.

That’s okay, I don’t care what you use to build your learning materials, just make it interesting learning.

But I do have to say just knowing what is possible is a help. More importantly, I always want tools that can give me some level of convenience (for many things I use other plugins) but knowing, in WordPress, I can almost change every single interaction. It has these nifty hooks and filters that let you tap to the flow of creating the stuff a visitor sees, and you can almost modify everything. It is a plane you can fly by pressing a button or go full on manual control.

A Domain and a Metaphor

I suggested Cori host this in her own domain already established in the greatest place for domains, Reclaim Hosting. The total cost here was a new domain, maybe $15.

We tossed around a few domain names I forget now, we know we wanted Word in it. I was rather pleased to find wordplace.ca was available, it fits the way Cori describes her class environment as a home, a place. One for words (and more).

The idea of an intersection came from one of our country road walks, this one has a Saskatchewan St on it.

a local corner… a idea

and I thought the idea of editing it so WordPlace would intersect at Saskatchewan, CA as the image for the site shows.

Cori tells me that the students love this local feel to their site, that it adds to a sense of place and ownership for them.

Small things count in unexpected ways.

Meet The Parent Theme, Chaplin

The site is a child theme of Anders Norén’s Chaplin. I went with this theme after finding it clean, flexible after putting it to use on another project. I like the screen-wide option of a Cover template for header images (fills screen with image behind title).

As much as most of my colleagues scream and rant about the evilness of the Gutenberg Editor, I’ve made my peace. As a side bit, all of the high students who used this site were able to navigate and edit their writing without the gut wrenching pain you hear from others who have a cold death grip on the Classic editor.

Chaplin was designed to work well with the Block Editor modality and pretty much is the antecedent what the same developer has folded into the latest default Twenty Twenty theme.

Coordinates and Curiosities

We had for a while a naming convention of parts of the site beginning with the letter “C” (that happened to be Alan’s idea, not Cori’s!).

The plan was to have the teacher’s posts (setting up assignments, activities) being known (via category) as Coordinates. and all student posts where in a subcategory of the default category, Curiosities.

For the front page, this called for a means to display posts in a category. I tried first the ever handy Display Posts plugin, but found I did not like the way it displayed in the theme because of a need to define numbers of columns in Chaplin (on a different project I did find the way the developer provides, and that does work well).

Shortcode generate front view of student posts by category

So I rolled my own shortcode to display posts in a category on the front of the siter, using the main template the theme itself uses.

So on the front page of the site, I have a display of the recent student posts using this shortcode for 9 posts in 3 columns from the curiosities category:

Above it I use another handy plugin, Simple Blog Stats, to display the number of posts in this category. This is all entered in the block editor, with see all linked to the category archive

But also, in the area to list the current assignment, activity, I can put into a column block this shortcode:

Giving a display of just the most recent announcement:

First Login Stop: Not the Dashboard

One of the most confusing to new users is after logging in seeing the pile of confusion known as the Dashboard. I did write this one up earlier:

This uses the Login and Logout Redirect plugin, making it so logins are sent to a special landing page with the typical actions student might do upon logging in.

Also, because one of the bigger blocks even to get that far is knowing where/how to login (sure I know to slap /admin on a WordPress site’s home, but few others will remember that, but the students and two of the teachers on this project have no experience in WordPress), I just put a row of big buttons on the main site page.

Creating/Managing Accounts

The accounts for students needed to be set up in advance; while they all have school provided email addresses, most of them don’t regularly use email. So teachers would need a means of knowing student usernames/passwords.

We wanted to keep the student identity as “pen names” so usernames were generated in a spreadsheet based on 2 letters in their name, grades, schools. Passwords needed to be something not to cryptic but random enough. In looking for some password generators I came across DinoPass which is aimed at elementary kids. Each click creates ones like kindlight59 or slowrules22. Not super secure, but enough.

Interestingly Cori shared that for her students the passwords were one of the favorite features of the site. The fact they were not pure random felt to them that the passwords were created as a personal act of care. These small things are not so small.

I did find that dinopass stopped giving out after about twenty clicks, so sometimes it took some cookie clearing, and eventually just assembling some on the fly following the same two word + 2 digital number pattern.

Also, for the student accounts, I added in code a means to include an additional profile field for their school name (as later used to create ways for each of the three teachers in the dashboard to find their students).

This first bit adds an editable field to user profiles for admins; for all other users it simply displays it when a user looks at their own profile.

and the second bit saves the profile when changed by an admin.

I used the Import and Export Users plugin to batch create accounts by importing a CSV data file. There were times too when Cori messaged with a new student to be added, it only takes a few minutes. We did not send any login info by email to students, just made sure teachers each had a reference document for logins.

I also made a custom author template that shows all the posts and comment activity of each user.

Because it’s WordPress, students do have the ability to change their display name. I installed the Simple User Avatar plugin to enable uploads of avatars (because gravatars are way too much effort to deal with). What’s interesting is that we did not tell the students or offer directions on how to do this. The ones who made these changes figured it out on their own.

Small, but significant.

See Only My Media

Here’s another small thing that occured to me as students started using the site. By default, as an author, when adding an image to a post, you can see all other media uploaded to the site.

With a small bit of code, I was able to make it so author accounts (students) can only see media they have uploaded (the fainter media are ones an admin can see).

In this example, my test account only has a single media uploaded, that’s all they can see.

Here’s the bit of code where that happens.

Post and User Filtering By School

We have three teachers needing to moderate all posts, comments, as well as needing to see activity of what their students are doing. I knew by having the profile field, it should be possible to add a display of a user’s school when viewing posts and viewing users. It took a lot more code wrangling to get it to be able to filter posts too.

An enhanced view of posts

I was able to add a column with the school name of an author, and when clicked, an editor or admin can see just posts from that one school.

Notice also the pending status on posts. The site is set for all posts published by students to be put into a moderation queue. The teachers then have to change the status to publish to the public site.

What you will hear in the presentation is that this was actually an idea that came from the students, not from a teacher control mindset. It was seen as a way for a conversation to happen before a post went to the site, but also a way for students not to worry all the time about having perfect grammar, etc.

I also wanted a similar interface for the Users area of the dashboard, so teachers could see at a glance the activity for a student, or click through to see their profile.

School column and filter added to the Users interface, at a glance this can show teachers post and comment activity.

This is a whole wad of code, not even sure if it has value here, but…

Comments et al

Commenting is a significant part of this project, as a goal is to have students show care, support, connection with each other. The site is set so that only logged in users can write comments (with the idea maybe in the future we’d open it up, maybe briefly for outside comments. This damn pandemic got a bit in the way of that).

The site is also set so each comment needs to be approved by a teacher as well. We’ve not heard anything from students that suggest they feel censored by this, more of what we hear is that they feel safe.

One small thing I wanted is having comment notifications/ moderations sent to the student accounts. Lo and behold, there always seems to be an answer often in StackExchange.

The Lounge

We had an idea to create an open discussion / conversation area for students, beyond post commenting, mainly in response to some teacher prompts, but also without moderation. I did scouting of plugins that add discussion forums, and wpforo looked the most useful.

But it has a gazillion interface options, and still it has way too many features that might be good in fan culture and gamer forums, but it was cluttered for students, not intuitive to reply in threads.

I pulled the plug, and since we had a good amount of comment activity, ended up doing something more simple- just creating a set of Pages as The Lounge.

The “threads” are each a sub-page, and I use the ever so I use the Page-list plugin to create a dynamic index on the entry page.

A few tricks were necessary, one upfront in the code is to keep track of the page that is the Lounge (parent of all sub pages which act as topics).

Then it took a WordPress filter to change the comment form labels and text to be more specific to the Lounge.

Finally, we wanted this area to be open to students without comment moderation, so I needed to override the moderation action.

And Then… Audio

The big project Cori’s students worked on through then end of the last (normal semester, ending in January) was a culminating of their work to define and understand resilience. The ask was for them to publish to WordPlace, their own personal audio stories of resilience.

I had hoped my work on the SPLOTbox theme with built in audio recording might be bent to work as a plugin. I did not quite make it. My first effort was building in instructions and a Big Button to go to Online Voice Recorder. It’s a single click recorder that saves as mp3, and it worked okay on what I could test for mobile. Then they could upload audio to WordPress like they already had done for images.

It seemed easier that trying to help students figure put recording apps on their phones; the various forms of audio you end up with makes it complicated.

But then one of the first students to try it ended up with a very garbly sound file, I unplugged that method. We ended up offering a few options– if they wanted to record audio and figure out file conversions, that was one route.

Cori then let me know a student had tried doing a short video on their device, and uploading it directly to the media library. Well what do you know that works, and its direct from a smart phone, if the videos are small enough for available upload. I built a small bit of code that provides a way in the dashboard to set an upload limit just for author accounts, so if needed we could nudge it up.

We encouraged students to not show their faces for uploaded videos, they could just cover the camera or point it at their shoes. These are very personal stories, and still a few of them chose to speak to the camera.

Some students still had trouble. We then suggested uploading to YouTube as unlisted videos. When Cori sent me a link, I downloaded it as mp4 and uploaded directly to replace a YouTube embed in the post. Then students could delete the YouTube version.

What was remarkable is that every one of her students completed this project; some of these were students who skipped pretty much the prior year of school. Most of them went above and beyond the suggested 1-3 minute recorded stories.

And the students regularly figured out the technology and how to publish on their own, and.or taught each other.

What they recorded was startling insight into what resilience truly is as lived by these students.

And what we found was that the very act of writing, recording, and publishing online these stories of resilience… is the very act of resilience.

So What

This is a code heavy post much about the nuts and bolts of the WordPlace.ca site. There’s much more to what we did, that will be shared in our talk Wednesday and as well on Cori’s own blog.

But I want more to give maybe a taste of what it means to not have tools and platforms tell you what you can or can’t do. A lot of people may diss WordPress because it’s gotten so big, or the editor makes them scream, or that it has a large wad of database chewing code, or that it’s not as cool as static HTML generators.

For me, what remains its beauty is that it sits in that space where many/most can build beautiful sites without coding, but that the hood is always there that can be popped to do almost anything you want/need. Just when I wonder if X can be done, I usually find a StackExchange entry or a blog post showing how to do it.

WordPress is my place to for doing stuff like WordPlace.

This was a case I tried to make some years ago, that it’s got those same elements that made HyperCard so important long ago, it straddles visual interface users and coders. All in one.

And alway, in working on a project like WordPlace, I leave with more things I can use elsewhere. It’s happened several times since I began hammering the site together.

Knowing I am not limited by a platform is a grand place to be.

And the real rewards are the stories Cori comes home with, that this not so fancy site has a place of importance and a sense of being owned by students many who do not have much of their own.


Featured Image: A slightly photoshopped image of a local street sign I photographed, that we use as the main image at WordPlace. Call this public domain, Creative Commons CC0 because that’s how I roll.

If this kind of stuff has value, please support me by tossing a one time PayPal kibble or monthly on Patreon
Profile Picture for Alan Levine aka CogDog
An early 90s builder of the web and blogging Alan Levine barks at CogDogBlog.com on web storytelling (#ds106 #4life), photography, bending WordPress, and serendipity in the infinite internet river. He thinks it's weird to write about himself in the third person.

Comments

  1. Alan,
    This is a fantastic breakdown of yet another awesome looking theme. I really dig the way that there were the touches that made it feel more Saskatchewan and it’s obvious that the students appreciated that. The use of BBB was interesting for one click audio recording. One tool I’ve used for language courses before is H5P’s audio recorder https://h5p.org/audio-recorder however I just tested it again on mobile and it seems to only work on Safari on iOS (disappoint).
    Thanks for sharing your work, really inspiring stuff here.

Leave a Reply

Your email address will not be published. Required fields are marked *