This is hopefully a useful tip for organising pupil created content on WordPress blogs like Glow Blogs.

Most of the content posed to blogs consists of posts or pages. Posts join the stream, pages are static generally accessed from menus.

This is another way to organise content that can be useful. Especially if several pupils are posting similar content at the same time. It helps organise that content and the early posters don’t get pushed away down the stream.

An Example Banton Birds

At school we are trying to pay attention to the local birdlife. We took part in the BIG BBC Bird watch with local Bird watchers, Mr & Mrs Carter. We started feeding the birds and trying to get some photos.

The pupils are doing a bit of research on the birds we saw (not too many it was a windy hour) and I hope they will continue over time adding other birds seen in the playground and around.

I want to organise these bits of research automatically collecting them together. To do this the pupils create, not posts or pages but a custom post type, project.

How it is done

This is just one way to do this but it is, at least on Glow Blogs, the most straightforward. It uses the JetPack Custom Content Types module and the unfortunately 1 named Portfolio Projects.

These projects are like pages in that they are out of the flow but like posts have Project Types (like categories) and Project Tags (like tags) that can be used to organise them. The also have a shortcode that can be used to create an index of the projects by type or tag2.

  1. Activate the Jetpack plugin.
  2. In Jetpack Settings Activate Custom Content Types.
  3. In Settings-> Writing Enable Portfolio Projects for this site
  4. Pupils create Projects for each item, add a project type (in this case Birds).

To create an index of these projects I add a page Banton Birds and add a shortcode to the page:

[portfolio include_type=birds display_types=false]

To make the index more visual the pupils make sure they have added a featured image to their posts. That automatically creates a thumbnail.

I’ve used this technique several times on blogs myself, including the Projects page on this blog. I’ve used it too to provide and organise photos and links on the Biggies blog for the pupils.

1. For Glow Blogs where we have a lot of pupil e-portfolios through a custom plugin.

2. You could do the same with pages using the hierarchy and the Display Posts Shortcode plugin, but not as easily.

A little blue sky thinking, or borrowing some ideas from @davewiner & @mrkrndvs

I wonder if a WordPress plugin could ape pngWriter and create images for twitter cards with the text from the excerpt on the image used by twitter.
Like this, but with less fireworks.

I’ve been thinking about twitter again.

I think I’d have preferred twitter to be just text rather than being expanded to include all the media and ‘twitter cards’. I’d rather the reading flow would be twitter for short stuff and link to more visual or longer material out on your blog. That would perhaps make reading a little deeper and avoid the problem of folk just seeing the main point of an article and reacting to that 1.

But that cat left the bag a while ago. Now when I look at my twitter stream it is full of images. I occasionally use OneShot to grab and crop out interesting bits of text to share and surmount the 140 char limitation too.

I am not sure if this is a great idea

Recently I’ve watched Dave Winer experimenting with pngWriter (see the about page: About pngWriter). This creates images of blocks of text and sends them out in a tweet. It also creates an RSS feed of the text (pngWriter is not open for use at the moment).

This reminded me of how Aaron uses featured images in his blog: Creative Commons Starts with Making – A Reflection on Creating and Sharing – Read Write Respond

So I am kicking round a couple of ideas.

  1. If you used pngWriter you could pull the rss into your blog. You could do it in WordPress with the FeedWordPress plugin.
  2. A plugin could be made that would do the same sort of thing in WordPress, take the except text from a post and make an image for twitter from that.

Here is how I imagine that working

  1. Using an html5 canvas to automatically create an image of the post’s excerpt.
  2. Auto upload that to WordPress media library.
  3. Make it the featured image of the post

Alternatively (better?) make it the content of the twitter:image metatag for the post, that means that the featured image on the post would not have the text, visitors could read the post.

Or make a copy of the posts featured image, add the text and make that the twitter card image (I can imagine that might be different to get the text readable.).

For a couple of minutes I imagined that my babysteps php & JavaScript could put something like this together. Then reality kicked in. So I though I’d post it out here maybe someone else would think it would be a good idea.

Veering off into territories where I am out of my depth a bit of fun in the last days of the holiday.

I’ve been playing with the new WordPress REST API using ideas from API Nirvana – Functional Details, then I remembered CogDog’s WordPress search javascript bookmarklet.

Multi WP Blog search allows you to search across a few blogs.

I doubt if this is actually a practical way to do things but it hints of ways of joining different blogs, small parts loosely joined?

It’s also example of doing something that only I would want to do and yet having that thing echo into eternity without any additional effort.

from: API Nirvana – The Content – Bionic Teaching

Tom Woodward writing about his love of APIs, one of a series of posts. I love the idea of playing with things that do something that only I would want to do.

If you have a slightly geeky interest in technology & edu tech Bionic Teaching is a great blog to read.

I’ve a long term casual interest in playing with APIs, and love trying out some of the stuff Tom blogs about. In a timely fashion wordPress 4.7 came out today, including:

WordPress 4.7 comes with REST API endpoints for posts, comments, terms, users, meta, and settings.

from: WordPress 4.7 “Vaughan”.

This is the same API that Tom blogged about (I guess he was using a plugin). The opening up of WordPress sites via an API that an amateur like myself can use it welcome. Over the past few years several sites with interesting APIs move to make them harder to access with out a deeper knowledge than I have (twitter, instagram…).

I had a quick play with the WordPress api making a page that lists recent posts on 3 of my blogs, including this one. 1

wp-json-render

I guess this sort of thing is a minority interest, but I find it enjoyable and although I am never going to be a programmer, helpful in getting a better understanding of how technology can work.

Featured image on this post, one of my own turned up in a search for echo. test1-echo.tif | Using Image Bending in Audacity – CogDogBlo… | John Johnston | Flickr

 

  1. I added the Better REST API Featured Images WordPress Plugin to et the images following a hint on Tom’s post.

Posting to WordPresss is pretty simple on the go. Recent versions of WordPress have a fairly good performance on Mobile Safari. the WordPress app performs a little better the body field is less ‘jumpy’ and uploading photos a little simpler.

There are a few other blogging apps but I’ve not stuck with any.

I tend to write posts in drafts as there is even less chrome and more space to type. It also has some clever shortcuts, helps with markdown and can do cleaver stuff with text and scripts.

A while back I noticed that the new version of Workflow had actions for posting to WordPress. I made some quick tests sand it seemed to do the trick.

Today I started thinking about it again. Workflow allows you to make posts, pages and media. When I tried uploading media I was disappointed that uploading an image returns the url to the attachment webpage rather than the attachment itself.

I’ve tried to extract the url form the page but the best I have is to extract all of the urls on the page and present this as a list to choose from. This is copied to the clipboard.

image upload

So I have an workflow that is an action extension. This allow me to pick a photo then run the workflow. It is presented as a document picker in other apps, for example pixelmator. When this workflow runs it resizes the image and uploads it to my blog. It then grabs the attachment page and pulls a list of links out of that. I can pick a link to copy to the clipboard.

Making a post

The next workflow I have is one for making a post. This runs from drafts.
It first set a variable to the draft. Then it shows the photo library. When a phot is picked it uploads the photo to the blog. As in the first script it downloads the attachment page, extracts the urls and let’s me pick one. This time the one picked is put in another variable.

The workflow then get the first variable, and posts it to the blog as a draft. It asks for a title and used the url to the uploaded image as the posts featured image.

It also asks for tags when it runs.

The featured image for this post is a couple of screenshots taken on my phone. They were stitched together with workflow and the result edited a bit in snapseed.

Image by anika ready to sew public domain

Since I changed themes here I’ve been using featured images a lot more on posts. 1

There are a couple of things that bother me about WordPress featured images, the fact they do not show up in an RSS feed and that any attribution needs to go in the body of the post.

This morning I read Transforming Photo Attribution from Credit to Stories on Alan’s blog, which mentioned these problems while discussion a much more important one.

I though I’d see if it was easy enough to find a fix and headed to google.

First I found a few plugins but also some DIY advice. I decided that these looks simple enough for me.

Featured Images in RSS

How to Show Featured Image in WordPress RSS Feed shows how to do just that. You need to edit the functions.php file in your blogs theme 2.

All I needed to do was copy the code suggested from that site and add it to the bottom of my functions.php file which I already had in my child theme. The post shows how to edit this file via the WordPress dashboard. I do this with my ftp application.

A quick look at my feed in Forefox (Safari dos not show RSS any more 🙁 )
http://johnjohnston.info/blog/feed/ or http://feeds.feedburner.com/johnjohnston
Looks good.

Captions for featured images

Again there are plugins for this, but I found:
How to add caption to the featured images in WordPress which had done the trick.

This uses the built in caption from the media library. To do this I needed to copy the content-single.php file from the theme to my child themes folder. I then edited that one.

My theme’s code was slightly different to the example but it was easy enough to figure out where the code for the featured image/thumbnail was and add:

<?php if ( $caption = get_post( get_post_thumbnail_id() )->post_excerpt ) : ?>
    <p class="featuredcaption"><?php echo $caption; ?></p>
<?php endif; ?>

After it. I also added a bit of css to the child themes styles.css file to align the text right. I’ll think about how to make that better looking….

What I particularly like is that this approach uses the built in WordPress caption for the image. When I started thinking about it I was thinking about adding a custom field and complexity. I keep finding that WordPress is already half way to do what I want, if only I knew where to look. Until I do google will keep me right.

  1. I choose the theme because it supports indyweb features I wanted to test. I’ve still not got my head round many of them.
  2.  This just works if you can edit your theme, so you would need a self hosted blog. I use a child theme here which should avoid changes being overwritten if the them is updated.Child Themes « WordPress Codex covers the details

Image opensource.com | Flickr – Photo Sharing! used under a CC-BY license.

File under another thing about WordPress I didn’t know.

I do not use the more tag on this blog very often, but it is a handy thing if you do not want all the text from a post filling up your home page. I was using it elsewhere today and wondered if I could edit the text from the standard Continue reading → turns out you can. You need to stitch to the Text view in the post editor, rather than the Visual, There you will see:

<!–more–>

you can edit it like this:
<!–more Find out more about more… –>

Find out more about more…

I quite often read above my understanding age, which is why Hapgood is in my RSS feeds. The other day I read: Connected Copies where I read this:

the future of the web involves moving away from the idea of centralized, authoritative locations and into something I call “connected copies”.

This lead me to AMBER where it says:

The Berkman Center for Internet & Society wants to keep linked content accessible.

Whether links fail because of DDoS attacks, censorship, or just plain old link rot, reliably accessing linked content is a problem for Internet users everywhere.

Having blogged for a while I am very aware of this problem, links I’ve made have fallen away. My bookmarks are full of holes.

Just the other day I linked to a couple of posts here that were made this month. They have already gone.1

Preserve Links Now. The plugin added this to my post editor.

Preserve Links Now. The plugin added this to my post editor.

I’ve installed the Amber WordPress Plugin here and set it to use the Internet Archive to ‘save links’ when I make them. I could have chosen to save them here, but I wonder if that could get messy?

The other thing that crosses my mind is what if people want to rub out something they have published. When a post is taken down deliberately, should I be archiving it?  The posts I mentioned above were deleted by the author (I presume). Should I then make public copies available?  That is what would have happened if I’d had the amber plugin working at the time.

I don’t know the answer to these questions or how the plugin works, but I’ll keep it running here for a while and look out for broken links.

After hitting the button

After hitting the button I get a list of links preserved. Presumably on the Internet Archive.

 

Featured image Flickr photo Public Domain: Image from page 28 of “The effect of black rot on turnips, a series of photomicrographs, accompanied by an explanatory text” (1903) | Flickr – Photo Sharing!

1. These links were to posts Dean Groom made about Microsoft acquiring Minecraft EDU. Strangely they have persisted in my RSS reader. I’d recommend a more recent one that is still there: Media Literacy: 5 key concepts to teach this year | Playable

I am posting this with the WordPress.com desktop app on my mac. The app has been out for a while but I’ve just got round to testing it.

I’ve done  nothing to set this up other than log on with my WordPress.com username and password, I am presuming that I can post with the app because I’ve got jetpack installed.

The editor looks pretty much like the WordPress.com editor as opposed to the web interface to my self-hosted WordPress blog.

WordPress

The application feels a bit like a site specfic browser.

On my site I am having problems uploading images so will be switching to the browsers to finish this post off.

Screen Shot 2016-01-25 at 20.52.55

It does not give me access to things added to my editor by plugins. For example the post to medium plugin or the indie-web post kinds plugin.

I guess the writing ‘experience’ is a bit smoother than the browser. I am surprised that there is now distraction free mode for writing.

Hitting preview opened Safari but pointed to the post without &preview=true the first time I clicked Preview. The next time was fine.

There are a huge number of Revisions saved. I don’t know if this is a good thing.

An interesting editor but I think I’ll stick to writing posts locally with TextMate for now. This gives me local/dropbox backups and lots of shortcuts.

It is worth noting that this app will currently not work with Glow Blogs. I suspect that the WordPress.com connection would worry the security folk at Scot Gov.

From what I’ve read this app is part of major changes happening with WordPress and the Rest API hence the featured image!

Featured image credit: wordpress revolution | Flickr – Photo Sharing! CC BY NC by Tom Woodward.