NYCGadgetGirl

How To Configure CDN Support in WP Super Cache

nycgadgetgirl — Sat, 21 Apr 2012 15:34:21 +0000

I recently started using CDN Support in WP Super Cache with CDN Sync Tool, Amazon S3, and Amazon CloudFront on my WordPress driven sites. I couldn’t find step-by-step configuration instructions for this combination of tools. I figured it out with only a few initial missteps, but it took longer than I would have liked. I’ve written these instructions in case they might be helpful to someone else in the future.

What Is A CDN and How Can It Help?

CDN stands for Content Delivery Network. By using services like Amazon’s S3 and CloudFront, you can significantly increase your website’s page speed. This is because Amazon has robust servers all over the world that can serve your content much faster than the single shared hosting server that your WordPress site is most likely installed on. When I decided to set up CDN Support, I went with Amazon as my provider because I already had an Amazon S3 account and was familiar with using it. There are other providers offering comparable Content Distribution Network services as well.

How To Implement CDN Support To Speed Up Your WordPress Site

This post assumes that you already have WP Super Cache installed, the latest version of WordPress (currently 3.3.2 while I’m writing this), and a basic understanding of WordPress and plugin configuration.

If you don’t already have one, sign up for Amazon Web Services.
Go to the AWS Console, click on the S3 tab, and then click the “Create Bucket” button.
You can name the bucket anything you want, so long as no other S3 user has created a bucket with that name. I use the domain name of the site it is for. After choosing a name, hit the “create” button.
Now, you need to get the content that you want hosted into your S3 bucket. One choice is to simply use the “Upload” button and put copies of your files into the bucket. For a totally static site, this could be fine, but for your dynamic WordPress site, you need an easy way to keep your changing files synced between your site and your S3 bucket. This is where the CDN Sync Tool plugin comes into play. Install and activate this plugin.
Go to the settings page for CDN Sync Tool. First, choose what to sync. By default, it will upload everything in your wp-content/plugin, wp-content/themes, wp-content/uploads, wp-includes/css, wp-includes-images, and wp-includes/js folders and then keep it all synchronized*. If you have other directories, that need to be synced, add them to the “Sync Custom Directory To CDN” box. Be sure to enter the path relative to your WordPress site root. Hint: The CDN Sync Tool seems to sync the folders it expects in wp-content/uploads. If you have created extra folders here through FTP, you need to enter them into the custom directory box.
Go to the CDN Options tab. Choose Amazon S3 in the dropdown. Go to your AWS Console. Click your name in the top right corner and choose “Security Credentials.” Scroll down the page to “Access Credentials.” You should have an access key there. Copy the Access Key ID and the Secret Access Key to your CDN Sync Tool options. Also enter the bucket name for the bucket you just created.
On the JS and CSS tabs, I choose to combine my files and I use “wp-content/uploads/cdn” as the save path. Hint: This path will only work if you’ve already created the directory on your server.
After saving all your options, go back to the Sync tab and click the “Sync” button. This may take some time, especially if you have a large site with a lot of images in your uploads folder. When the sync completes, you’ll see a list of files that were synced.
At this point, clink through your newly populated S3 bucket to confirm that everything is there. (Click “refresh” if you don’t see the files in your bucket.) You may want to add more folders to the “Sync Custom Directory To CDN” box.” Hints: Confirm that your plugins folder was uploaded. I’ve noticed on two sites now that it wasn’t, even though “Plugin Files” was checked in the Sync tab. Also, I’ve noticed that on large sites, not everything copies over during the initial sync. A large number of my uploaded images didn’t sync on both of the sites I’ve done so far. This may be a problem with my host or something else, I’m not sure. I also got a few error messages that I couldn’t resolve on some random, older files. This may not have been the best solution, but I chose to use Amazon’s “Upload” button to upload those files to my S3 bucket instead of trying to sort out why the tool wasn’t getting them all.
In your bucket, go to wp-content and right click on the uploads folder. Click “Make Public” in the pop-up menu.
The next step is to create a distribution for your files in Amazon CloudFront. In the AWS Console, click the CloudFront tab and then click the “Create Distribution” button.
Delivery Method should be Download. Choose Amazon S3 Origin and choose the appropriate bucket in the dropdown. Click continue. Leave everything on the Distribution Details step as is, unless you wish to create a CNAME (see #13 below). If you plan to create a CNAME, enter it here. Click “Continue” and then “Create Distribution.”
It isn’t necessary for functionality, but I recommend creating a CNAME for your distribution to maintain cleaner links in your page source. Personally, I use a sub-domain of “cdn.” For example, the CNAME for the distribution I use for this site is cdn.nycgadgetgirl.com.
- Enter the CNAME you wish to use, then click “Continue” and then “Create Distribution.”
- Go to wherever you manage the DNS for your site, most likely your registrar’s website, and add a CNAME record for the CNAME you just used in your distribution setup. For the value, enter the domain name shown in the CloudFront distribution’s properties.
The last step is to actually enable CDN Support in WP Super Cache! In your WordPress Dashboard. Go to the settings for WP Super Cache and click the CDN tab. Check the “Enable CDN Support” box. Enter the full URL of the CNAME you just created. For example, for this site, I entered http://cdn.nycgadgetgirl.com
If you synced some directories to your S3 bucket that are outside of wp-includes or wp-content, you should enter them in the “Include directories” field. You can probably leave the other fields as they are. I check the “Skip https URLs to avoid ‘mixed content’ errors” box.
Click the “Save Changes” button and you’re in business.

*Note: I don’t know yet if it really keeps everything synced as it claims to.

I hope this post helps others configure CDN Support in WP Super Cache. If you have any questions, comments, or corrections, feel free to post in the comments below.

Another Client Update: Cathleen Schine

nycgadgetgirl — Sun, 31 Jan 2010 07:32:40 +0000

Cathy is one of my favorite clients (partly because she’s so easy to work with and partly because she’s a dog lover). I created her original website back in 2006, right before her book The New Yorkers was released. Cathy’s latest book – The Three Weissmanns of Westport – will be released this Tuesday so she contacted me to give her site a corresponding face lift.

The major change on the back end was that I created the new look with Thesis, both for ease of development and also to see if it will improve her search engine results. The visible changes were not really extreme. We removed the splash page she’d had on the original site, eliminated the static home page and moved the blog to the home page instead. I widened the sidebar and added all her book covers to the sidebar above her blogroll and other links. I’m still tweaking things a bit on the back end, but the site is up before the book release, so I call that a win.

Cathy’s blog and books are intelligent and humorous. Go visit cathleenschine.com and see for yourself.

Client Update Launched: Lisa Berg Photography

nycgadgetgirl — Thu, 07 Jan 2010 03:50:06 +0000

I created Lisa’s original photography website back in 2005. She recently contacted me for a facelift. The great thing was that she still loved the original look of the site! All she wanted to do was make the photos larger – to take advantage of higher bandwidth and larger monitors in use these days – and add a blog.

While I was at it, I added in some CSS to preload the larger images and also tweaked the meta tags for better search engine performance. We launched the updated photo site today. The blog is ready too, but the first entry has to be written before it goes live.

A Little Pro Bono Work: nycshibarescue.org

nycgadgetgirl — Mon, 04 Jan 2010 23:53:23 +0000

I spent a good part of the long New Year’s weekend revamping the website for NYC Shiba Rescue, Inc. The site is built on WordPress and the group uses the blogging functionality extensively to share information about their foster dogs. There is a lot more information in the site than the blog entries though and, as the group has grown, that information has become harder to find. The site needed to be revamped in a way that would bring attention to fund raising and volunteering opportunities as well as the dogs available for adoption.

I used Thesis (I told you, I drank the Koolaid) to create a new theme for the site, moving the foster dogs into a wide sidebar, highlighting important links in the header and featuring more posts on the home page than before.
My friend, Scott Lauben, created six great new images for the aforementioned links in the banner. Scott is an NYCSR volunteer as well and has created all of the print materials, banners, etc. used by the group.
While I was at it, I hardened the security on the site and added all my favorite plugins.
When I have time, I’m planning to go back and edit a number of past blog posts to include a "post thumbnail" so Thesis can make the excerpts on the category archive pages look fancy.

NYCSR, a 501(c)(3) non-profit organization, was founded in April 2007 and is incorporated under the non-profit laws of the State of New York.

Making the Move to Thesis

nycgadgetgirl — Sun, 20 Dec 2009 09:49:55 +0000

I’ve been drinking the Thesis Koolaid folks. And I like it!

I decided a few days ago that it was time to dust the cobwebs off nycgadgetgirl.com and start lining up some new blog development work for the new year. (I have enough work for current clients now to keep me busy till February.) What better time to delve into the world of Thesis than when I need to re-do my own site?

I decided, for a test, to see how long it would take to re-theme my site using Thesis while keeping all the design elements that I still like (forcing me to figure out all the customization instead of just using it out-of-the-box). Well, I downloaded Thesis on Thursday evening and finished the site on Saturday night, after spending about eight hours on it, including checking all the plugins and removing the ones I no longer need.

Me likey! You’ll be seeing more Thesis development from me.

Back in the New York Groove

nycgadgetgirl — Fri, 24 Apr 2009 00:44:10 +0000

Luckily, I don’t have to say it’s been many years since I was here.

Last summer I decided, rather suddenly, to take a A Four Year Vacation from NYC. I quit my job, packed my stuff, wrote about What I Will Miss About NYC and What I Will NOT Miss About NYC, loaded up the U-Haul and drove to Indiana. A couple weeks after I arrived, I blogged about the many Wonderful Things I had experienced as I was preparing to leave my NYC life behind.

Well… Indiana didn’t turn out to be quite the vacation I’d hoped for. It was gorgeous and peaceful. I got lots of sleep. The house and yard were awesome. I spent more time with my daughter and my sister. I worked freelance (set my own hours!) and got to spend lots of time with my darling Shiba Inu, Snickers.

But, I was bored. And "real" work wasn’t forthcoming. The cost of living there is low, but not so low that I could stay there four years without a real job!

My first visit home to NYC was in early February, for Westminster. Before I arrived, I reached out to the CEO of a tech firm I’d become acquainted with shortly before moving away. They were hiring. Hmmm…. interesting! I met with them while I was in town for Westminster and by the time I arrived back in Indiana, I was planning my move back east. Three weeks later I was settled into a new job and a new apartment (both of which are right across the Hudson from my old job and apt).

Like the KISS song says… "This place was meant for me!"

Happy Birthday Kayla

nycgadgetgirl — Thu, 19 Mar 2009 18:27:14 +0000

I received this email yesterday from Rick and Colleen, who adopted Kaos/Kayla from me a year and a half ago. I wanted to share it because so many of my blog friends helped with rescuing Kayla from Miami Dade Animal Control and taking care of her for six months until she was adopted.

HAPPY BIRTHDAY KAYLA!!

HI EVERYONE RICK HERE. KAYLA IS 3 YEARS OLD! DO YOU BELIEVE IT?? MY WIFE AND I WOULD ONCE AGAIN LIKE TO THANK EVERYBODY INVOLVED IN KAYLA’S LIFE. WE HAVE NO PROBLEMS WITH KAYLA, SHE IS A WONDERFUL PART OF OUR FAMILY. SHE SHE IS WELL ADJUSTED TO OUR FAMILY AND FRIENDS. DAILY WALKS AND CHASING RABBITS IN THE YARD HAVE KEPT HER HEALTHY AND AT A WEIGHT OF 65 LBS!!

THANKS AGAIN RICK AND COLLEEN

Makes ya feel good, doesn’t it?

Redesign for Client: Pierson Bark Park

nycgadgetgirl — Thu, 23 Oct 2008 06:51:04 +0000

The Client
Pierson Bark Park is a privately owned, four acre canine recreation area in Fishers, Indiana. I met Heather Pierson shortly after moving to Indiana.

The Need
Heather had a website but was ready for a redesign. Her content was out-of-date and she had no idea how to update it herself. The link to get directions was broken and she was also unhappy with the restrictive layout of the site, primarily because of the extremely small content area. She wanted to maintain the existing identity of the site and also needed to be careful to maintain her Google rankings.

The Solution
The new Pierson Bark Park site is in WordPress, so Heather can easily make her own content changes without worrying about accidentally breaking the layout or format of the site. I created a WordPress theme using the same colors and some of the same graphic elements from the original site, so the site is still familiar.

There is much more focus on the content in the new site than there was in the previous site. We’ve also made it more useful by adding more content and by using the Google Maps API to include an interactive directions page for new visitors. I put 301 redirect instructions in the .htaccess file to maintain the existing page rank and incorporated some SEO WordPress plugins to optimize the pages and hopefully improve their rank over time.

The Long Time-Traveling Arm of the Law

nycgadgetgirl — Thu, 02 Oct 2008 07:47:27 +0000

AAAAAAAUUUUGH

I don’t like NJ. I’ve never been a fan of NJ, even when I lived there. Or maybe ESPECIALLY when I lived there. By far, the WORST things about New Jersey are all related to driving – the DMV, the interstates, the traffic, the auto insurance rates, etc. But OH MY GOD, this has to beat all.

Tuesday, I went to the Indiana BMV to get my drivers license and to register to vote. Well, primarily, to register to vote, since Indiana is a decision state and I’m excited about casting my vote here where it will really matter. So, anyway… after waiting in line, I had to take a written test since I’m coming from another state. 50 questions. Pretty quick but then I had to wait for the same person who was helping me before (instead of getting back in line). SIX people were helped while I waited for her to help some jerk with 18 forms to fill out. Finally, she’s free. 49 answers right. Everything looks good. Oh. Wait. The State of NJ says I can’t have my license. NEW JERSEY? I haven’t lived there for almost two decades! They tell me to wait. They’ll call. Oh, too bad, NJ is closed now. They gave me the number for the DMV (now renamed the MVC?) in Trenton.

Wednesday, I called Trenton. They wouldn’t tell me anything unless I could tell them the address that was on my license when I left NJ. Hmmm… ten minutes later after searching my paper files, Google Desktop saved me. I gave the lady my old address. She told me I have an unpaid parking ticket in Hoboken from 1989. OK, no problem. I’ll pay it. Nope! All this fabulous technology, but can I give her a credit card number and take care of it? Ohhh nooooo, of course not! I have to call the Hoboken Court for the details, mail Hoboken a check, get the receipt (by mail), MAIL the receipt BACK to Trenton with a $100 reinstatement fee, and then they will MAIL something to me that I can take to the BMV in Indiana to get my license. This whole process will take weeks. Meanwhile, I never had any idea this ticket existed AND I’ve had licenses in three other states since 1989 without it ever coming up.

Oh, and when I called Hoboken… she said the parking ticket would cost $14.

Here’s hoping I can register to vote.

Happy Anniversary Kayla :)

nycgadgetgirl — Sat, 27 Sep 2008 04:09:33 +0000

I received a welcome and gratifying email today. Kayla (the doggy formerly known as Kaos) has been with Rick and Colleen for over a year now. They sent photos, a video and a note saying that she’s happy and healthy and they couldn’t be happier that she is part of their family.

Stuff like that makes it all worth it.