Theme dev with Bones, Sass, Vagrant and PhpStorm

I recently played around with building a new WordPress theme from the ground up, and I'm sharing some notes here about what I learned along the way.

It had been a while since I'd created a WordPress theme from nothing, and I knew that best practices had shifted quite a bit since then. I also wanted to use a more modern development workflow than I'd previously been used to. In my daily work I get to help our clients test, refactor, optimize and launch their WordPress themes (and I enjoy that quite a bit), but sometimes I just want to tinker for a personal project.

I also had an itch to scratch with 47374.info, a site I'd created in 2011 to aggregate local news headlines into a single, simple list display. It uses the great FeedWordPress plugin (along with some custom Perl scripts I wrote to scrape news off of local sites that embarrassingly don't offer their own RSS feeds) and does its job just fine, but it wasn't responsive, the mobile theme wasn't working so well for this use case, and there were more and more parts of the original theme I'd used that needed cleaning up. I also wanted to create something that looked and worked a little bit more like the Hacker News front page (without voting or comments). I am my own primary target user here; the site in question tends to get 40-60 visitors per day (I hope you're enjoying it, whoever you are), but I know I use it every single day.

I didn't quite have the time to start with a totally blank slate, so I started looking at some of the starter themes out there: Underscores, Components, Minimum Viable VIP, and Bones were the main ones I considered. These starter themes include all of the basic requirements of a WordPress theme so you don't have to literally create each new file (like single.php and style.css from scratch). Each option then offers its own unique flavor to what a starter theme should have. For example, the Minimum Viable VIP theme is designed to have everything a developer on the WordPress.com VIP platform would need to implement basic functionality while also meeting code security and performance standards on our platform.

In my case, mobile-first and responsive was a top goal, and while Components has some great options there, Bones seemed to take care of what I wanted with a little less extra stuff thrown in. (Some day I will learn to write media queries from scratch, not this time around.)

So I downloaded Bones, opened it up, and started poking around. And that's when I encountered this:

Continue reading "Theme dev with Bones, Sass, Vagrant and PhpStorm"

New plugin, Debug Bar Widgets

A few weeks ago I created a new, simple WordPress plugin, Debug Bar Widgets.

It adds a panel to Debug Bar that displays all of the widgets registered on a site, even if the widgets aren't active. There are probably simpler ways to get at the same info but I've found it useful in developing some of my other widget-centric plugins.

Pull requests welcome.

Speaking at WordCamp Dayton

WordCamp-Dayton-2016-LogoI'll be speaking at the upcoming WordCamp Dayton 2016, happening March 4-5, 2016 at Wright State University. I'll be talking about "WordPress as your digital home," a topic I've thought about for a long time and blogged about recently:

There are tons of places to put your content, but not all of them give you the control and ownership you should have. Your WordPress site is still probably the best place to call home for your online creations. In this session I’ll show you why that is, walk through tools and techniques for using WordPress as your digital home while pushing content out to other places, and answer your questions about how to build an online presence that is fully yours.

Continue reading "Speaking at WordCamp Dayton"

Pet Adoption, Debt Clock WordPress Plugins

I recently released two simple WordPress plugins:

This creates a simple pet adoption search form in a widget on your WordPress site. Once you enter a postal/zip code, you're taken to results on Adopt-a-Pet.com where you can look for a homeless dog, cat or other animal waiting for your love. (Yes, I've worked a lot in the past with Adopt-a-Pet.com, but this plugin is not affiliated with or endorsed by them, I just created it for fun and to promote pet adoption.) Pull requests welcome.

This creates a simple widget display of the current U.S. national debt, based on the latest data available from the U.S. Treasury. If you want you can animate the number so that it is increasing/decreasing on the page according to recent changes in the actual debt. Pull requests welcome.

 

Continue reading "Pet Adoption, Debt Clock WordPress Plugins"

I'm joining Automattic

wordpress-logo-stacked-rgbOne of the main reasons I get excited about Internet technologies is that they amplify the power of the written word and other kinds of creative publishing. Modern online tools enable bloggers, software developers, poets, journalists, novelists, chefs, filmmakers, marketers, photographers, artists, scientists, organizers and many other kinds of people to bring their creations to the world, at a constantly decreasing cost. And even through all of the cultural transformations we've seen spurred on by the Internet, the power of the written word remains - publishing can still change minds, start movements, spark connections, capture beauty, reshape lives.

Next week I'm joining Automattic, Inc., the company that makes WordPress, runs WordPress.com, and provides a bunch of other publishing-related tools and services. I'm joining the WordPress.com VIP team as a full-time VIP Wrangler, where I'll be helping to provide support, hosting, training, and other services to some of the biggest and best WordPress sites on the web (NY Times, TED, CNN, Time and more).

There are many reasons I'm excited about this, including:

Continue reading "I'm joining Automattic"

47374.info: scanning for local news so you don't have to

As a fun project a few weekends ago, I created the website 47374.info.  It automatically pulls together news and headlines from a variety of different news sources in the Richmond/Wayne County Indiana area.

The site has a simple display of those headlines that's automatically updated as they're made available throughout the day, and you can click on them to go read the original content on the source site - that's about it. There's a mobile-friendly version at http://m.47374.info/ and you can also easily see some recent local tweets from Twitter.  The site's still officially in beta but I've gotten some great feedback from test users so far.

I created 47374.info because I was tired of looking in a lot of different places to see what's making news in my community, or wondering if I'd missed something that was only announced on the very transient Twitter.  Some news sources have lots of content but make getting to it hard or leave certain key things out.  Other sources have a few juicy nuggets of relevant content once in a while but don't make updates available via RSS feeds, so you never quite know how often to check back.

So with the magic of WordPress plus some custom Perl scripts, I've restored some sanity to my news-reading time.  For the first time in a long time, I've set a website (instead of a blank page) as the default "Home" page that opens when I launch my browser.  Over the last few weeks, it's meant I'm more aware of community news, and I spend less time per day getting there.

Thanks to all of the local news/headline/event publishers that work to keep our community informed!

If you try out 47374.info and have feedback, drop me a line.

Weblog Converted to WordPress

I've moved this weblog to use WordPress, instead of Movable Type. While I found Movable Type generally agreeable, WordPress has become a favorite as I've used it with the Summersault Weblog, especially in its handling of comment and trackback spam which, other than writing posts themselves, had become the most time-consuming part of having a weblog - not good. So, I'm still ironing out a few glitches from the transition, but otherwise it should be business as usual with a more consistent look thrown in; let me know if you notice any problems.