Migrating to Digital Ocean

I’ve had a number of tiny WordPress sites on shared hosting (BlueHost) for over a decade. It’s been pretty great. Shared hosting has a lot of benefits: it’s cheap, it’s relatively easy to manage, e-mail is included, and there’s basic support.

The drawback is that servers aren’t generally optimized for WordPress performance, and once a site begins to scale in traffic you need to move it to a managed host or a VPS.

droplet-screen

I’ve been wanting to try DigitalOcean (one of the many cloud providers) because my hosting bills have been growing. I still have my basic shared hosting with BlueHost, but I also have large sites on WP Engine, and a VPS with WiredTree. They’ve all been great and have their own benefits, but the idea of consolidating into one provider and reducing my hosting bill significantly is a huge draw. Continue reading

How to Install a Purchased Theme

When you purchase a WordPress theme you’ll generally get a download link for the zip file. To upload this theme to your site involves a couple simple steps.

  1. Log into your WordPress site, and go to “Appearances > Themes” menu item
  2. Click the “Add New” button at the top of the screen
  3. Click the “Upload Theme” button at the top of the screen
  4. Now choose the .zip file that you have of the theme click “Install Now”

Add New

add-new

Upload Theme

upload-theme

Overwriting a Theme

If you are uploading a newer version of an existing theme, you will likely get this message:

“Destination folder already exists. Theme install failed.”

In that case, you will need to temporarily switch themes (perhaps to the default). Find the theme you want to replace, click “Theme Details” and then click “Delete”. Now you can upload the newer version.

Additional Notes

  • If you use WordPress.com, you cannot upload your own themes.
  • If your zip file contains multiple themes, you’ll need to unzip it, and then re-zip each theme individually.
  • Purchase themes only from trusted sources- otherwise you run the risk of getting a hacked version (no fun).

Social Menu Links

I (like most everyone) have number of social profiles spread across the web. Facebook, Twitter, Instagram, GitHub, etc. I tend to think of my website as my “home” on the web- it’s the only place I have complete control over the content, design and functionality. But I like to link to these other sites so folks can find me and engage there. For most brands and companies this is an essential requirement for their website.

icon-examples

There’s a number of ways for users to add social links. The simplest is to use the default WordPress menus and have text links. These can be added in a menu area or a widget. There’s also a few plugins that have purpose built widgets or absolute positioned icons that can work with most any theme.

But in most cases icon links in the menu are the best option for linking. Icons don’t take up much space and they’re immediately identifiable.

If a theme doesn’t support social icons by default, there are a couple plugins that allow you to use icon sets by adding classes to menu. Font Awesome 4 Menus is one. But since this is such an essential feature for most sites, I think it’s great when the theme itself handles it. This ensures that the icons used also match the rest of the theme design. Continue reading

How to Use the WordPress Menus

I’ve been getting a lot of questions about how to use and set up the WordPress menu navigation, so I created this video tutorial to walk you through it. These menus are a new feature in WordPress 3.0, and you’ll know if your theme supports it by clicking on Appearance > Menus.

Post Format Views with Categories and Tags

I think it makes a lot of sense to display certain post format archives differently than standard post archives. For instance, image post formats might look a lot better in a grid view with large images rather than a traditional blog format.

It’s easy enough to alter the post format archive template, but the taxonomy views (categories and tags) will still display in the standard layout- even if all the posts are the same format.

I thought it would be great to detect what type of posts were being displayed in the taxonomy before they rendered, and use a different layout if they were all in the same post format. This way I could continuity between the post format archives and taxonomy archives- assuming they all contained the same post format. Continue reading

IE Browser Testing on OSX

Browser testing in Internet Explorer can be a bit tricky since I do all my WordPress development work on a Mac- but I finally got a setup that works well.

virtualmachines

I’m using Virtual Box because it is free, rather easy to set up, and I could store all the disk images on an external drive (they take up too much space on my MacBook Air, 10GB a piece).

The disk images with Windows and Internet Explorer can be downloaded from Modern IE. I had to download some of the rar files multiple times because the zips were corrupted in the download (they’re large files)- but I eventually got a clean version. Disk images are available for IE6, IE7, IE8, IE9, IE10 and IE11. Continue reading

Template Hijacking and Useful Styling Tricks

Portfolio Press has always used custom post types to display portfolio content. When the theme was released in 2010 this was a novel way to do it (custom post types had just been released in WordPress 3.0).

Post types allowed the portfolio to be styled differently, use different templates, and keep portfolio content separate from standard content. In the dark ages before WordPress 3.0, developers had only achieved this by requiring users to post in a pre-defined category or tag.

screenshot

But since WordPress 3.4 we’ve had post formats like “gallery” and “image” which are now supported by most new themes. With the latest version of Portfolio Press, I wanted users to be able to choose which to use. Post formats are the new default, but users can install the Portfolio Post Type plugin and use post types instead if they choose.

To save a lot of duplication in template code and styling, I used a bit of template hijacking and a few other useful styling tricks. I doubt anyone is working on this exact same issue, but I think some of the ideas might be useful for other applications. Continue reading