❖ Building The Daily Create

Last year a lot of us in the ds106 group were shocked when we found out the Daily Shoot website would be taken down by the end of the year. Unfortunately the developers of the site were moving on to other things and didn’t feel it would be worthwhile to release any of the code for others to build on. What a waste. I don’t want to go on a rant here but I can find no reason for a developer who has no plans on ever updating a line of code again to let a popular website die on the vine like that, and then to stubbornly claim that the code is worthless to anyone else and therefore would not be released. I had great respect for the developers of that site, and then I watched them kill that community that was built around their site and they lost that respect from me. But that’s another blog post for another time perhaps. This is about something new.

Last semester when the Daily Shoot closed its doors a few of us talked for a bit on Twitter about how we needed to build our own clone. Obviously we have plenty of people in the WordPress community with the chops to make it happen. And the great thing is we wouldn’t be restricted to photography, it could house multiple disciplines. We talked and ruminated but nothing really came of it until early this year when I started talking in earnest with . He had seen how I was pulling in Twitter posts to DS106 via the hashtag using FeedWordpress and combination of restricted tag searches and started thinking this would be a good method to pull in info for the daily create. As happens most of the time all I need is permission to run with an idea and I’ll do it, and so I started working.

I initially thought I’d do a lot with FeedWordpress for this, grabbing RSS feeds from the various third-party sites like Flickr, YouTube, and SoundCloud. I had also played around briefly with IFTTT (If This, Then That) which is an incredible site that makes it easy to hook up channels that apply actions to certain triggers like posting a photo to website when you favorite it on Flickr. But it turns out IFTTT was too restrictive and I had issues with pulling in RSS feeds with FeedWordpress and getting all that content to look proper. And then I realized I was making things too difficult.

I’m not a programmer, I’m more of a “hack away at something and make it work” type of guy. In the end The Daily Create is very simple in how it works. I’ll break it down here for anyone else that wants to build a similar site, as I’m sure the idea of pulling in visual and audio content based on tags has a lot of potential for a lot of people. Here’s the nuts and bolts that make it work.

The Homepage


The homepage is a WordPress loop that is restricted to a certain category called “TDC Assignments” and only displays 1 post along with a link to the previous post underneath. The rest of the homepage is static content blocks describing what the project is about. We have schedule these assignments to automatically post each day at 10AM EST. When the new one is posted, the old one becomes the previous link and Twitter Tools fires off a tweet to the TDC Twitter account. Basically it’s all automated and makes it look like there’s someone behind the scenes doing a lot of work.

Photography


For photography assignments we’re restricting people to using Flickr. I’m perfectly OK with this because we’re not programmers and Flickr is extremely simple for people to use. We use a plugin called Awesome Flickr Gallery and despite the hyperbole it lives up to its name. You can create multiple galleries, restrict them to a specific tag, and control how they display. Each assignment gets its own gallery which gets put into the post as a shortcode. The only edit we made to the plugin was Alan figured out how to link back to the original Flickr photo so folks could go there to comment. The feed for this pulls in very quickly, with the longest I’ve seen taking no more than 15 minutes and many times photos showing up instantly.

Audio


For audio we decided to use SoundCloud which I have a love/hate relationship with. They’ve built a great social network around sharing audio and they’ve got a dead simple widget for groups that we’re using on The Daily Create. We create a group, anyone can upload an audio file and add it to that group, and the widget automatically puts them in the playlist. If you play audio on the Daily Create site it will automatically move to each new file when the previous is finished. What I hate about it is SoundCloud is very restrictive with free accounts and very expensive for paid features. Free users only get 120 minutes of audio total and can only create 1 group. This means I have to find folks to create these groups for each assignment. Ultimately it may not be sustainable but for now we’re using it and it works really well.

Video


For video YouTube was an obvious choice since so many people already use it and I just needed to find the best way to visualize a tag. The answer to that was TubePress with allows you to build shortcodes with TONS of options. Each video comes in as a thumbnail that uses Lightbox to display the video in an overlay. It looks and works perfect with the only exception being that YouTube apparently has incredibly long and random delays on their tag search. Not only is it not immediate, there were times that users videos took 14 hours to show up on the site. The annoying this is this part of the process is completely out of my control. I experimented with Vimeo to see if that would be a better option because TubePress supports it, but Vimeo had similarly long delays. We’ll work through the long delays because ultimately the site is archiving these posts and keeping them available anyway, so if it takes awhile to feed in that’s not the end of the world for now.

Submissions

The last piece of the pie was allowing folks to submit suggestions for new assignments. Normally people would probably go to a Google Form for something like this, but we’ve already found a better solution which we currently use on the DS106 Assignments Site. We use a plugin called Gravity Forms which I’ve raved about before here that allows us to create a form whose submission automatically creates a new post in draft. The user assigns it a category. All we have to do is decide when it should be published, add the widget/shortcode for visualizing it, and give it a tag. The more submissions we get the more posts will be scheduled in advance and there’s very little turnaround work for us. It’s yet another amazing way we’ve taken advantage of Gravity Forms. Obviously if someone didn’t want to invest in that plugin and wanted to do this on the cheap Google Forms would be a decent alternative and just require you to manually copy and paste the submission into a new form.

After a lot of testing this past week and a fun weekend of people participating in telling jokes to each other, the site is now live and rolled back to Assignment #1 for today. I’m excited about TDC as a way for daily creative prompts to allow us all to quickly find some inspiration in the world and work with it. I hope you’ll consider joining us (no registration involved, just read the assignment, complete it, and tag it) and maybe consider submitting a few ideas for future assignments that people could complete.

❖ Writing HTML by Hand

This was the next assignment in the P2PU Webcraft course. I can honestly say I didn’t have to much of a struggle with this one. Obviously writing with a pen is difficult. Which slash is correct, forward or back? I only know where the key is on the keyboard. I’m spoiled. But considering I only screwed up one time and wrote this out pretty quickly I’m pleased with it. A lot of that just has to do with my experience digging in to HTML code.

❖ I

The more I use Gravity Forms for WordPress here at UMW, the more I am constantly impressed by such a full-featured and flexible plugin. This is not some shill paid post. I’ve used WordPress for 5 years now developing sites and themes and my discovery of Gravity Forms this year has blown my mind by the possibilities it opens up for flexible web systems using WordPress. Here are just a few cases where I’ve had the opportunity recently of implementing that plugin with some other great tricks:

Month of Microfinance

The department of Economics wanted to have a form on the homepage of their website where they could ask people to submit their name and e-mail address to become a “supporter” of the cause. Then they wanted to have these names scrolling across the screen in a widget. Because I’ve enjoyed implementing Custom Posts recently to solve some of these odd database items I went with that here, creating a custom post called “Endorsements” and then using the awesome Gravity Forms + Custom Post Types plugin to create a new custom post for each form submission. Last step was employing the Vertical Scroll Recent Posts plugin (and doing a custom edit to it to look at that custom post type instead of regular “posts”) and throw the widget on the site. The result is an awesome dynamic scrolling list of supporters who have entered their information on the site. Check it out here!

Germanna Syllabus Repository

The College of Arts and Sciences is starting some preliminary discussion on how to collaborate on their syllabi with the local community colleges and perhaps glean some information about learning is directed across these campuses. To that end Jim and I recommended a UMW Blogs site (naturally) and I set to figuring out how to easily allow folks to upload their syllabi to the site and collaborate. Gravity Forms was an absolute breeze because it allowed me to assign the uploaded document to a custom field and then use that URL however I saw fit. What I did here was made use of the template https://docs.google.com/viewer provides to automatically display a post template (again, a custom post type called Syllabus) with an embedded version of the syllabus right in the page. I also made use of just a few custom taxonomies on that page like “Institution” and “Subject” that will allow for some flexibility in drilling down sets of syllabi later on. Much more to come on this site but check it out here!

I’m a cheapskate and don’t like to spend money on plugins when I don’t have to, and I’ve tried plenty of standard form plugins (which are fine if you just need someone to submit a form and get an email from it). But Gravity Forms is amazing in the way it can be used for so many other customized functions. Also the support folks are incredibly helpful (special shoutout to Carl Hancock), even to the point of responding on Twitter to advice when they found me complaining and figured out my problem. The plugin is an incredible tool to have with WordPress that makes this platform that much more powerful for building customized websites and applications on top of it.

Encouraging Gravatar Use in WordPress Multisite

We’re in the process of redesigning the layout and look of UMW Blogs and one of the features Martha Burtis has added is a stream of the 5 latests posts from the entire network. The plugin is pulling the user’s Gravatar along with the title, author, a character-limited description, and link to read the full post. Gravatars are built into WordPress and have been for awhile and it’s adds quite a bit of personality to the design to feature them in the stream.

That being said after a first stab at designing the look of the sidebar, we immediately noticed a problem. Most people don’t register their email address with a profile picture on Gravatar’s website, leaving them with a default icon. So much for personality. Gravatar offers a few randomized images instead of a single default image for users that aren’t registered, but none of them are incredibly attractive. We settled on Identicons but we knew we would want to figure out a way to encourage users to register an email address with Gravatar and upload their own image.

Encouraging registration is not an easy task, mostly because Gravatar is a third-party website requiring a separate registration (although all they need is an email address to get a user started). After a bit of searching I happened to come across a plugin called (appropriately) Gravatar Signup Encouragement. It has quite a few options for encouraging users to register a Gravatar and in every case it checks a user’s email address against the Gravatar site to see whether or not they are already registered. You can enable it for commenting on forms, site registration, user signup (particularly useful for Multisite installs), and/or as an admin notification. The plugin notifies the user that their email address is not registered and offers a link to register on Gravatar’s site with their email address already filled in for them.

We opted to only enable the admin notification, thinking that most users who are using their blog would find the prominent notification enough encouragement to quickly register their e-mail address and upload a picture. It will be interesting to see over the course of the first few weeks of school if the plugin works well to encourage adoption of Gravatars.

In order to get the plugin to work with our system I did have to make a few minor modifications which I’ll detail here for anyone looking for a similar use case. The plugin needs to be active for all users, which means it had to be put in the wp-content/mu-plugins folder. The plugin itself consists of a folder with several files, however setting up must-use plugins means moving the main php file directly into the mu-plugins folder or it won’t work. Here’s the workaround for that. Download, unzip, and copy the entire plugin folder inside of mu-plugins. Then take the gravatar-signup-encouragment.php file out of that plugin’s folder and place it directly in mu-plugins. You will need to edit that file now to add the relative path /gravatar-signup-encouragement/ to any calls to the other files (since the rest of the files are still in the plugin’s own folder). At the time of this blog post these are the following lines that need to be changed and the new text:

  • Line 41 – ‘/gravatar-signup-encouragement/gravatar-check.php’
  • Line 50 – ‘/gravatar-signup-encouragement/translations’
  • Line 68 – ‘/gravatar-signup-encouragement/translations
  • Line 106 – ‘/gravatar-signup-encouragement/translations’
  • Line 144 – ‘/gravatar-signup-encouragement/translations’
  • Line 325 – ‘/gravatar-signup-encouragement/screenshot-2.jpg’
  • Line 358 – ‘/gravatar-signup-encouragement/screenshot-3.jpg’
  • Line 389 – ‘/gravatar-signup-encouragement/screenshot-4.jpg’
  • Line 394 – ‘/gravatar-signup-encouragement/screenshot-5.jpg’
  • Line 399 – ‘/gravatar-signup-encouragement/screenshot-6.jpg’
  • Line 404 – ‘/gravatar-signup-encouragement/screenshot-7.jpg’
  • Line 439 – ‘/gravatar-signup-encouragement/screenshot-8.jpg’
  • Line 461 – ‘/gravatar-signup-encouragement/screenshot-9.jpg’

The other necessary change is to the default enabled settings. By default the plugin has the option to notify unregistered commenters but leaves the rest of the options unchecked (all options are found under Settings>Discussion). We wanted to only have the option checked to notify the user within the admin panel (since we really only care about the author of the blog, although ultimately encouraging commenters to register a Gravatar is a great option for individual blogs to enable). The default options are in the same php file at Line 128 (at the time of this post) and the defaults are as follows:

$gse_options['show_comments_unreg'] = ’1′;
$gse_options['below_comments_unreg'] = ‘#comment’;
$gse_options['below_comments_reg'] = ‘#comment’;
$gse_options['below_profile'] = ‘h2′;
$gse_options['below_registration'] = ‘#user_email’;
if ( function_exists(‘is_multisite’) && is_multisite() ) {
$gse_options['below_ms_signup'] = ‘#user_email’;
}

Changing the ’1′ to a ’0′ will keep the unregistered commenter option unchecked by default. To add a checkmark for admin notifications add this line below it:

$gse_options['show_in_admin_notices'] = ’1′;

You can also adjust the text the plugin uses to notify the user on Line 71:

$message = sprintf(__(“You haven’t setup a profile picture with your e-mail address yet. This picture is used in comments and posts across all UMW Blogs sites.
If you would like to setup your profile picture, click here (link opens in new tab/window).”, “gse_textdomain”), ‘URL’);

Now the plugin will propagate to all users and when they log into their blog if they are registered with Gravatar already they will never notice it (unless they dig into the Discussions area) but if they’re not registered yet they will get a notification like the one in the screenshot below (click for full-size), hopefully encouraging them to head over and update their profile picture, if for no other reason than for the notification to disappear.

DTLT Announces Special UMW Blogs Development Series

UMW Blogs 2.0: From Basics to Beyond

This series will explore and expose current innovative uses of the UMW Blogs platform. It will also provide consulting, support, and resources to the UMW Blogs user who wishes to go beyond basic blogging capabilities. The series will be book-ended with two, more formal, forums made up of UMW Blogs users. In between, DTLT will host several open sessions which anybody at UMW can attend to learn more about the possibilities of building a site on UMW Blogs [Read more...]