More WordPress.com VIP Open Source

At WordPress.com VIP, we are currently hard at work designing new platform services for our clients we think will help us take their sites to the next level of WordPress awesome. And today, my colleagues open sourced two of the tools we are using internally.

(Both of them are use on this very site, actually—because my blog has been running on our new platform as a test for some time now.)

The first is VIP Jetpack, which is a series of forced module activations and testing preparation we use with the Jetpack plugin suite for VIP Go. (Yes, this site and other sites on VIP Go always use Jetpack. No, it’s not a performance hog.)

The second is VIP Support, which we use to access client administration pages when troubleshooting a site. This ensures that we don’t always have admin access to client sites, but that we can assist when something goes wrong.

This project is so exciting for me, because we have a dedication to developing as much as we can in the open, a test-driven development process, and a peer review-heavy culture. I’m not actually generating any of the code you see in these repos, but that doesn’t mean I’m not proud of what we are accomplishing and how we are doing it.

By the way, the source used to power this site on that same platform is available here; I’m working on things in the open as well even though I don’t have much time to work on them. :)

I Helped Launch This: Major Nelson 4.0

I love days like this one where we get a new site off the ground on WordPress.com VIP and I can finally talk about cool things I’ve been working on.

First, a little back story: In late 2010 and early 2011, I had heard that Major Nelson was looking to move from Telligent Community to another CMS for his site. I reached out via email and had some conversation with him about WordPress as an option.

Thankfully, the suggestion was a good one and he transitioned the site a couple of months later to be on WordPress, where it’s been ever since.

At the time, I’d brought up the idea of WordPress.com VIP as an option, but the time wasn’t right and instead majornelson.com ended up as a—still awesome—self-hosted site.

Time passes.

A few months ago, my colleague Nick Gernert posted to our team to note that we had reached out to the Xbox team to see if WordPress.com VIP was a good fit. It is, and for the last couple of months, I’ve been assisting with the migration and support for the new majornelson.com, which launched this morning in advance of E3.

Take a look! I think it looks fantastic—especially the podcast post views. They look really sharp.

And welcome to WordPress.com VIP, Major! I’m happy to be part of the team that will be supporting your site.

WordPress Plugin: HTTPS All the Things

I guess there’s sort of a tradition for WordPress developers where they start out by forking code they don’t really understand and then release it upon the world while not fully grokking how it works or how to maintain it.

There’s probably not much of a better way to learn how this stuff works in the first place. (If you know of one, certainly let me know.)

When transitioning this site to use HTTPS recently on the front-end, there was a problem with existing legacy content not conforming to the new URI scheme. In an effort to solve this problem, I did what any self-respecting novice coder would do: I asked everyone I knew who is smarter than me for help.

I was led by my colleagues on the WordPress.com VIP to a code snippet that was written at Code for the People to handle exactly such a problem. It filters content to ensure that the URI scheme matches the scheme that’s set in a given site’s options. It’s been running on this site for some time now and I’m happy to say that it appears to work quite beautifully.

Assuming that others would be able to use this as well, I’m releasing the plugin on GitHub and with a reference page here, encouraging issues and pull requests as you might feel moved to create them. I can’t promise that I’ll know what to do with those requests, but I’ll do what I can to keep it properly maintained.

I hope you do indeed find it useful.

VIP Workshop 2014 Recap

My colleague Sara just posted the “official” recap post for this year’s VIP Workshop, which I attended and at which I learned quite a bit and had a great time. A quote from the writeup that stood out to me:

We again had some great flash talks from VIP clients and partners, and this year’s presentations included talks from CBS Local, Re/code, USA Today, Digital First Media, BlueHost, The New York Times, Tribune Broadcasting, and Interactive One.

These are all top-notch clients doing amazing things with WordPress and the WordPress.com VIP service, and I get to work with them every day. I love that.

If you want to see my thoughts on the workshop, you can find them here.

2014 VIP Workshop: Photos

This past week, I was happy to attend the WordPress.com VIP Intensive Workshop with my colleagues and some of our clients, spend time with them chatting about all things WordPress and VIP (and even some things not), and learn a ton of things myself—including attending a security workshop taught by my colleague Mike Adams.

The last dinner we had as a big group (both the VIP team and our clients) was a fantastic time and we had some great conversation. (Special guest photographer on some of these shots is the one, the only Peter Slutsky.)

As you can see, the grounds where we stayed, learned, and worked for three nights are just fantastic. It rained a bit much in the early going, but once the sun came out it was beautiful and just a great place to retreat and spend time building relationships with the people who make WordPress.com VIP what it is.

Some shout-outs are due post-event:

All these people (and more) had a bigger impact on me than they probably think. I saw—time and time again—people talking about problems and then going and starting to solve them, collaborating on the potential solutions, and walking away having learned something.

It was the first time it struck me how much of a community WordPress developers (and really, developers of all stripes) tend to be. And it was about fixing real problems not just for themselves, but for other people who would run in to those same things down the line.

This is why I’m renewing my effort at upping my game, engineer-wise. This is something I want to be a part of and contribute to. I want to have these conversations more often.

Now, if I can just clone myself so I have enough time to get everything done…

VIP Workshop 2014: Sage Advice

vip-mug

I’ll write more about my week and takeaways from it in a bit, but this is one of the swag pieces we gave to our clients at the WordPress.com VIP Workshop this past week in Napa.

The best preview I can give is that I’m much more motivated to be in a position where the above pictured advice will be useful.

Let’s Think Out Loud: Making a Twitch Embed Handler

Earlier tonight, I said:

This is because I am looking at writing a new embed handler for WordPress that would allow embedding of a Twitch stream, video, or highlight using just the URL of the video itself. Let’s collaborate on this, because I don’t know what I’m doing.

First, enumerate the options that are available.

Live Broadcasts

The URL to a live broadcast is just the channel URL, like this one:

http://www.twitch.tv/backlogathon/

(Twitch forces “www” but we should probably act like it’s possible it won’t be there when someone adds the URL manually.)

The embed for that URL looks like this:

<object type="application/x-shockwave-flash" height="378" width="620" id="live_embed_player_flash" data="http://www.twitch.tv/widgets/live_embed_player.swf?channel=backlogathon" bgcolor="#000000”>
	<param name="allowFullScreen" value="true" />
	<param name="allowScriptAccess" value="always" />
	<param name="allowNetworking" value="all" />
	<param name="movie" value="http://www.twitch.tv/widgets/live_embed_player.swf" />
	<param name="flashvars" value="hostname=www.twitch.tv&channel=backlogathon&auto_play=true&start_volume=25" />
</object>
<a href="http://www.twitch.tv/backlogathon" style="padding:2px 0px 4px; display:block; width:345px; font-weight:normal; font-size:10px;text-decoration:underline; text-align:center;">Watch live video from backlogathon on www.twitch.tv</a>

The only thing in there that is provided in the URL is the channel ID, so the embed should assume using full $content_width in the embed handler and provide options for the rest in a shortcode.

There’s also a chat embed, but for the purposes of the media embed it’s not needed. Let’s leave that for the shortcode. We can probably omit the link addition to the bottom of the video, assuming that the blog owner will be adding that automatically.

Archived Broadcasts

Twitch archived broadcasts are referred to by channel ID, then a divider, then the ID of the archived broadcast, like this:

http://www.twitch.tv/backlogathon/b/512356452

The embed for that looks like this:

<object bgcolor='#000000' data='http://www.twitch.tv/widgets/archive_embed_player.swf' height='378' id='clip_embed_player_flash' type='application/x-shockwave-flash' width='620’>
	<param name='movie' value='http://www.twitch.tv/widgets/archive_embed_player.swf'>
	<param name='allowScriptAccess' value='always’>
	<param name='allowNetworking' value='all’>
	<param name='allowFullScreen' value='true’>
	<param name='flashvars' value='title=It%2BCame%2Bfrom%2Bthe%2BBacklog%2521&amp;channel=backlogathon&amp;auto_play=false&amp;start_volume=25&amp;archive_id=512356452’>
</object>
<br>
<a href="http://www.twitch.tv/backlogathon" class="trk" style="padding:2px 0px 4px; display:block; width: 320px; font-weight:normal; font-size:10px; text-decoration:underline; text-align:center;">Watch live video from backlogathon on TwitchTV</a>

The same bits from above would seem to apply here. We can omit the link at the end, and assume we want the video to span the content width.

Everything else we’ll leave to a shortcode, which will need some regex anyway.

Edited Highlights

Once you have edited a clip using the built-in tools, it’s available at a different URL, but much the same as the archive one:

http://www.twitch.tv/backlogathon/c/3915617

It generates this embed:

<object bgcolor='#000000' data='http://www.twitch.tv/widgets/archive_embed_player.swf' height='378' id='clip_embed_player_flash' type='application/x-shockwave-flash' width='620’>
	<param name='movie' value='http://www.twitch.tv/widgets/archive_embed_player.swf'>
	<param name='allowScriptAccess' value='always’>
	<param name='allowNetworking' value='all’>
	<param name='allowFullScreen' value='true’>
	<param name='flashvars' value='title=Titanfall%2B-%2BCTF%2Bon%2BCorporate%2B-%2B4.7%2BK%252FD%2BRun&amp;channel=backlogathon&amp;auto_play=false&amp;start_volume=25&amp;chapter_id=3915617’>
</object>
<br>
<a href="http://www.twitch.tv/backlogathon" class="trk" style="padding:2px 0px 4px; display:block; width: 320px; font-weight:normal; font-size:10px; text-decoration:underline; text-align:center;">Watch live video from backlogathon on TwitchTV</a>

Repeat the above.

I don’t think there are any other URL possibilities with Twitch, or at least I have not seen them yet.

So that’s the list of what needs to be figured; next step (which I’m currently avoiding and/or failing at) is writing the correct regex and the handler for it.

Removing Theme Support from a Parent Theme Using a Child Theme

I was just doing some messing around with removing features from a parent theme, most specifically looking at something like infinite scroll. At first, I thought you could just do it with:

remove_theme_support('infinite-scroll');

But as it turns out, that won’t work.

Instead, you need to find a place to run that. So create a new action and make sure it runs after the parent theme. Parent themes run at priority 10, so set this up at priority 11. This will work:

add_action( 'after_setup_theme', 'child_alter_parent_theme', 11 );

function child_alter_parent_theme()
	{
		remove_theme_support('infinite-scroll');
	}

Put that in your child theme’s functions.php and it will remove infinite scroll (as an example). You can add as many things as you want to remove there and it should take care of all of them.

Hack Day: Finding the Problem

Yet another reason I like working with Automattic is that we regularly hold internal Hack Days, where anyone in the company who has an inkling can take a day and set it aside to work on a pet project, presenting what’s done at the end.

Last Hack Day, I made some basic changes to the Gravatar site, which was a fun challenge and taught me a lot about how our development environment functions. (Background: calling me a “developer” is a pretty big stretch; I’m still very basic in what I can do.)

The first part of any Hack Day is finding the problem you want to tackle, and I have something I’ve been wanting to solve for my personal blog for some time now. Generally, the only time I get for writing on my personal blog is at night, often quite late, when most of the people I know are not actively reading things. I also tend to write in big batches, where I’ll put up five or six posts in a relatively short timeframe.

What I would like to do is have a plugin that would:

  • Have a “deferred” post status that would place a post into a queue. First in, first out.
  • Deferred posts would be cron-published. The cron would publish only between certain hours of the day, and would maintain a certain amount of temporal spacing between posts, maybe with a small amount of randomness to make it look less robotic.
  • Authors should be able to publish immediately if they want to (hence having a separate status for the deferred posts).
  • It will work with Jetpack and specifically Publicize.

There are already a couple of existing plugins that try to scratch this itch, but neither of them has been updated in a while and on looking at them I don’t think they are exactly what I want.

I’m pretty certain I won’t be able to get this all done in one day just because I don’t have all the knowledge I think I need to do it. But I’m going to look at the existing work around the idea and see what I can do. I have a feeling this is something that would be useful to other people as well.

WordPress 3.6

WordPress 3.6 shipped today, after a long wait and a lot of testing. It’s got a bunch of features I’ve been waiting for, including a better autosave, improved post revisions (in more than one way), vastly better post locking, and a great theme I’ve been using myself for most of the beta cycle called Twenty Thirteen.

I also love the new release video format:

Somehow, I ended up in that video with some rather amazing people. See if you can find me.

And watch the download counter. It’s always fun.