Local Development for WordCamp Websites

Note from 11/2019 — this approach should still work, but the recommended WordCamp.org dev environment has shifted to use docker instead of the full VVV + meta environment setup. There are instructions in the .docker folder in the repo. Join us in #meta-wordcamp on slack if you have questions 🙂

An important aspect of running a WordCamp is having a good website. That’s where all your attendees, speakers, sponsors, and volunteers will interact with you before and at the event. We’re lucky to have a number of tools built into the WordCamp environment, but the “locked-down” nature of the sites can make it hard to customize.

I’ve worked on the WordCamp Boston sites for the last 4 years: 2016, 2015, 2014, 2013. Each year, more tools are released, and I learn more about the WC environment. This year, everything came together to make it much easier to do development locally, and set up github so that anyone in the community could help out.

At the end of this walkthrough, you should have a local copy of WordCamp.org, a site for your WordCamp, and a github repo for your custom CSS. This will work best if you already have a live WordCamp.org site for your camp.

Continue reading “Local Development for WordCamp Websites”

Accessibility for WordCamps

If you’re coming here from a link I’ve shared, WordCamps are conferences for WordPress. I’m very involved in the WordPress events community, so I wanted to highlight some ways for our events to be more accessible for people with disabilities.

[skip the intro, give me the tips!]

In the past year or so, web accessibility has finally been getting the attention it needs. Last year, afercia was granted commit to WordPress core based on his accessibility work. The WordPress Accessibility team has put together standards for core development to ensure future features are accessible. Almost every WordCamp had at least one presentation on why accessibility (or a11y) is important and how to get started.

I would love to see this same attention paid to accessibility at our WordCamps and meetups.

A quick story: At WordCamp US, I took refuge in the quiet area for a while one afternoon. While I was sitting there, a few other people came through and sat on the other side of the space. I never got their names, and for the most part didn’t pay any attention to them. As I was leaving, I caught a little of their conversation. They were talking about the event so far, and one woman mentioned that she was new to WordPress (or maybe new to development), but was hoping to learn a lot more here; that our industry would provide her new job opportunities, because she couldn’t move around very well, and with WordPress, she could get a job working from home.

Considering that the unemployment rate for people with disabilities is twice that for non-disabled people, the fact that our community can provide employment opportunities that work where “traditional” jobs fall short is great. However – if our events are inaccessible, how will new people learn about all the things they can do?

Continue reading “Accessibility for WordCamps”

Anadama, A React Recipe Theme

The other week I started playing with a React-based theme using the REST API. The idea is a very simple recipe blog – no comments, no widgets, just a list of post titles on the home page and a pop-up card with the recipe content. Designed by Mel Choyce (of course), the inspiration was vintage recipe cards/books. It seemed like a great candidate for a single-page-app style theme.

The theme is called Anadama, and it’s definitely still a work-in-progress. Here’s how it looks so far:

A single recipe page shows the recipe meta from the (Jetpack) shortcode in the left column.
A list of all posts by category.
The single page view (inheriting the sidebar gap from posts, will probably be updated)

It’s definitely still in flux, but I thought it would be fun to talk about, especially with WCUS this weekend. I’m using gulp and webpack to build the JSX into javascript, and I’m trying out some ES2015 features with babel. For the CSS, I’m using Sass, with some component-specific stylesheets living with the components (all still built into the main CSS file — I’m not using Radium or the like). It’s a very simple theme, so hopefully if you’re new to the idea of React + WordPress, this should be easier to understand.

Want to check it out? The Anadama-React github repo has instructions to set it up yourself, you’ll just need a few plugins: The REST API for the content API, WP-API Menus for the menus endpoint, and (optionally) Jetpack, if you want to see the recipe shortcode in action. The theme will work with any content, but only recipes will populate the sidebar.

Look for me at WCUS if you want to chat about React/API-driven themes, using Jetpack for themes, or themes in general! 🙂

Edited 12/9: If you’re interested in a more traditional blog example, I’ve also added Foxhound to github. I’m working on both, and will write an update in a week or so about the progress on both.