FI Video Collective – The Project & Theme

The FI Video Collective is a really fun project that Molly is leading centered around VCU’s common book.

This spring semester, Focused Inquiry faculty are teaming up with ALT Lab to offer a unique creative opportunity to UNIV 112 students. This project is inspired by the artistic style of the winter reading selection, Lauren Redniss’ “Radioactive,” in combination with crowdsourced video projects like Hit Record’s “First Stars I See Tonight” and The Johnny Cash Project. The end product will be a single video featuring a story collectively written and created by as many UNIV 112 students as are interested in participating. The video will premiere at the FI Expo on May 4th.

My summary, in case you are not a video person (really, just watch it), is imagine a bunch of faculty and students collaboratively creating a video with options for participation ranging from script writing and acting, to creating music, to drawing a lamp. Lots of access points for people who like to do different things all leading to a massive collaborative project.

The Theme Part

While nothing like driving the project1, I had a couple challenges on the web side of things. We needed a way to say what media was needed from students and to associate it with the script/narrative so that’d it make sense to anyone dropping in. Additionally we needed a structured submission process that would make that media easy for the video team to find/use/credit later on.

The interesting thing about writing these explanations of how I built a theme is that while I did this a month or two ago, I now know considerably more. . . enough to realize I could have done chunks of this in much better ways. That’s some sort of mix of awesome and depressing.2 Let it also serve as a warning.

General stuff-

  • This is a custom theme, could be managed with a child theme. I slapped it into another theme I’d be using and regret not starting fresh.
  • There is custom post type I named scenes so that I could do some specific layouts.
  • There is a custom page template to display the scenes

The portion that I think is worth looking at is the way in which needed items get created/displayed and how the data is added to Gravity Forms.


The Scene post type is pretty normal (body for the script section, featured image for the storyboard image) but has a unique layout with some of the elements driven by the scene name itself. It ends up showing the storyboard in the upper left, the needed media on the right, a media files tip sheet Emma made, and the script section at the bottom of the page.

Screen Shot 2016-04-08 at 10.58.57 AM


So this should have been written as functions and applied more intelligently but these work and I promise to do better next time. I’ll break down the details of how the wanted media shows up in the code comments below.

global $post;
$mediatype = 'image'; //this changes depending on what we want
$scene = $post_slug; //gets the name of the scene so we can use it to get all the posts in the category that matches the title of the scene
$sub_tag = get_term_by('slug','submission','post_tag');
$sub_tag = $sub_tag->term_taxonomy_id; //don't get submissions that are also in this category

//gets the stuff you asked for above
$posts = get_posts(array(
'numberposts' => -1,
'post_type' => 'post',
'category_name' => $mediatype .'+' . $scene,
'tag__not_in' => array( $sub_tag ), )


foreach($posts as $post)
$cats = array();
foreach (get_the_category() as $c) {
$cat = get_category($c);
array_push($cats, $cat->term_id);

if (sizeOf($cats) > 0) {
$post_categories = implode(', ', $cats);
} else {
$post_categories = 'Not Assigned';

echo '<div class="asset-list"><div class="asset-name">' . get_the_title($post->ID) . '</div><div class="asset-links"><a href="' . get_site_url() . '/form/?title=' . $scene . '&cats=' . $post_categories . '&fi_filename=' . $scene . '-' . urlencode(get_the_title($post->ID)) . '" class="clickit"> Submit</a> <a href="' . get_site_url() . '/category/'. $scene .'+'. $mediatype .'?tag=submission" class="clickit">View</a></div></div>' ; //this builds our two buttons- submit and view

else {
echo 'No images needed. Thanks.';


To breakdown what’s going on in the buttons . . .

Submit Button

<a href="' . get_site_url() . '/form/?title=' . $scene . '&cats=' . $post_categories . '&fi_filename=' . $scene . '-' . urlencode(get_the_title($post->ID)) . '" class="clickit"> Submit</a> 

To break it down, we pull the site URL and then start to fill in the hidden fields in the Gravity Form- we want the scene name, the relevant categories, the file name, and the title. All that is added to the form transparently. So all the user needs to do is add their name and attach the file. There’s also a Gravity Forms hook that renames the file so that all the relevant information is there when it’s downloaded.

View Button

<a href="' . get_site_url() . '/category/'. $scene .'+'. $mediatype .'?tag=submission" class="clickit">View</a>

This is pretty simple but useful. It’s just taking you to the standard archive page but with the relevant categories added and restricted by items tagged submission. So you end up with a URL like

Big Picture

As a reminder to myself . . .
Start clean whenever possible.
If you find you’re repeating large chunks of code you ought to write a function. Functions prevent mistakes and streamline/simplify things. It is worth the extra time.
Code comments are your friend- annotate like crazy. You will forget.
Data flows like water. That’s still pretty amazing.
With the Gravity Forms after submission hook, you can avoid all sorts of irritating duplication/duct tape and still get what you want.

1 The humans are always the hardest part.

2 As I’ve continued to write, it’s gotten more depressing. Concepts are decent. Execution is dismal.