Programmatically Update Settings in Staging

When developing WordPress sites I generally have three environments: live, staging, and local. Since I like my staging environment to be a very close replica of production, I frequently overwrite the database and files in staging. This is especially true when working with a host like WP Engine that has one-click staging environments.

However, when the database is overwritten in staging, there’s a generally a few settings that still need to be different from production. For instance, with WooCommerce sites, I may need to deactivate SSL and put Stripe into testing mode.

Occasionally I’ll also need to deactivate certain analytics plugins or third-party API integrations like MailChimp.

After making these updates manually for months, I finally moved to a programmatic update routine for many of my sites. The code basically just checks which environment we’re in. If it’s not production, it checks if the settings have been updated yet. If not, it makes the updates. Continue reading

Customizer Control: Arbitrary HTML

Sometimes it’s really useful to be able to output HTML in the Customizer that’s not a label or description for a specific control. You may want to output a line break, an image, a button, or simply some additional text.

There isn’t a native Customizer control in WordPress to do this, but you can add your own custom control to output arbitrary HTML. This was a request for the Customizer Library, and the GitHub issue explains the thought process behind the code. Continue reading

Barriers to Entry

person-woman-apple-hotel

Broad Experience is a podcast I listen to regularly. It’s a thoughtful interview show about the experience of women in the workplace.

One recent episode mentioned the lack of women in tech, which hits close to home (87% of of people who follow me on Twitter are male). It’s a complex issue and there’s no quick panacea, but there is at least one easy step companies can take recruit more female engineers: remove requirements from a job description that aren’t actually requirements.

“There’s been research that shows many women will only apply for a job if they meet 100% of the qualifications,” said Erik Michaels-Ober of Soundcloud. “Whereas men will do so even if they meet some smaller percentage. They’re willing to put themselves out there even if they’re not fully qualified.”

“So we looked at a lot of things,” said Erik. “For example, having a college degree was a requirement on a lot of our jobs. But when we looked internally, we realized had hired a lot of male engineers who didn’t have a college degree because they had decided to apply anyway.” Continue reading

Custom Conversion Tracking in WooCommerce

woocommerce-banner

If you integrate any third-party services with your WooCommerce site (for ads, analytics, marketing, drop shipping, or A/B testing), it’s often helpful or necessary to provide conversion data through javascript.

A lot of the big services, like Google Analytics (tutorial) or Facebook ads, have off-the-shelf extensions you can use. But for smaller services, you often have to write some custom code to send them the conversion information.

Generally the easiest way to do this is by using the woocommerce_thankyou hook. This action is only fired on the order confirmation page and also provides the $order_id variable, which gives access to all the order details. Continue reading

Interview: Elmastudio

elmastudio-workspace

Elmastudio is a WordPress theme shop run by Ellen Bauer and Manuel Esposito. Their approach to themes in unique, with interesting layouts and minimalist artful design. Even content for the theme demos has original photography and writing.

We talked a few months ago via Skype, soon after the release of Onigiri and Ponsonby. We discussed the design process, finding inspiration, traveling, and the WordPress community. I was inspired by the creativity and passion they bring to their craft. We talked for a little over an hour, which I edited that down to about 45 minutes of audio. I also wrote up much of the interview for you to read below. Hope you enjoy both!

Continue reading

Efficient Script Loading for oEmbeds

fitvids

I’ve been using FitVids.js in a lot of recent themes to ensure video displays nicely in responsive layouts. I wrote about this in detail for a previous post.

The FitVids script is super tiny (1.7k), and I generally concat it will all my other scripts and then minify using Grunt. So, it’s really not a lot of additional page weight to include the script. However, I was just clued into an alternate method when doing a theme review for the Make theme on wordpress.org that could be slightly more efficient.

Generally FitVids will only be required if video is loaded via an oEmbed (YouTube, Vimeo). So, if we hook into the oEmbed and already have the FitVids registered to load in wp_footer, we can just enqueue the script when it is needed. Continue reading

Tracking eCommerce in WordPress

If you run any type of eCommerce site, it’s important to understand how visitors found your site and which specific entry pages led to a conversion. Tracking data can also let you know the type of content or marketing that is worth investing in.

Here’s a screenshot from a basic eCommerce dashboard I have set up in Google Analytics for a client with a WooCommerce shop (some data changed to make anonymous):

woocommerce-dashboard

Seeing the top referrers, landing pages, and revenue at a glance is great. But once the eCommerce data is in Google Analytics, you also drill down and answer very specific questions.

For instance, is an ad campaign on one site performing better than another? Should ad traffic be sent to the home page or the shop page? What is the conversion rate (or total revenue numbers) for visitors from Google who landed on an article page via an organic search? Continue reading

Custom Links in the Customizer

custom-upsell

Adding custom links or markup to the theme customizer can be a bit difficult since everything is injected with javascript rather than the normal PHP toolkit. However, there are a number of use scenarios where this might be useful.

One common use case for theme authors might be to add a documentation link or an upsell link so users can find out about theme features.

The approach I like the best is one I first saw employed by the Theme Foundry with their theme “Make”. Their upsell link is prominent, but it doesn’t detract too much from the theme customization experience or take up too much space in the limited UI.

make-upsell

This tutorial takes a similar approach, but shows how to add a styled link to the “Active Theme” section. Continue reading