How to Build Your Photography Website With WordPress in 2020: Part 3 with Alicia Simpson
Over the last couple of months, we’ve picked out and set up a WordPress theme, then used a page builder to create the pages and blog posts on our site. Now all the pages are designed and the site is live, but there is still more to be done.
Backups
Website backups are something that a lot of people ignore until it’s too late. (But that’s not going to be you, because you’re reading this!) No website is immune from things that can break your site, and if you find yourself without a backup, you’re looking at a lot of work while your site sits broken.
Basically, a backup is a snapshot of your website from a certain point in time. If a change is made on your site that breaks something, you (read: your host) can simply swap out the broken site with the files from your backup, and you get back to business like nothing ever happened. Two important principles here are to take backups as often as it makes sense (so that you lose as little data as possible if you have to restore a backup) and store them in as many places as possible (just like you should be doing with your images).
First, you’re going to have to do some research on what kind of backups your web host does. Good hosts will back up your site at minimum once a week. If you’re on a dedicated server, you can most likely control this schedule and how many backups are retained.
Your host is your first line of defense, but you don’t have to rely on them completely. I use a plugin called UpdraftPlus on all our sites, and the backups are saved to our Dropbox Business account.
UpdraftPlus is a free plugin and can be installed from the Plugins menu in your WordPress dashboard. Once it’s installed, you can find the plugin settings under Settings > UpdraftPlus Backups. Go to the settings tab at the top of the page to set up a backup schedule and place for them to be stored. Ideally, you want them stored remotely so that if something were to happen to your server, you have an off-site backup.
For the schedule, this can depend on how often you are making changes and posting to your site. There are two things to set: files and database. The files are things like your plugins and themes. The database is the actual content of the site, such as blog posts. For most sites, I back up the database daily and the files weekly, because I am not typically adding new plugins often, but blog posts do get published and updated pretty frequently. You can also choose how many backups to retain. The default is two, which is fine.
Next, you can choose from a variety of remote storage options. This is where your backup files will be sent. After you select the option (we use Dropbox), some additional settings will appear below to hook up the site to your remote storage. Save the changes, and you’re all set.
You can also take a backup of your site any time by going to Settings > UpdraftPlus Backups, and hitting the big blue “Backup Now” button and following the on-screen instructions.
Pro Tip: The free version should suit most people just fine, but one feature I love in the Premium version of Updraft is the ability to take automatic backups before updating a theme or plugin. This has saved my ass on more than one occasion where a plugin update didn’t work like it was supposed to or broke part of the site completely!
Analytics
I like the PixelYourSite plugin because you can use it to add Google Analytics and the Facebook Pixel to your site in one place instead of needing multiple plugins.
Once again, this is a free plugin, and once it’s activated you’ll see a new option on the left-hand menu in your WordPress dashboard called PixelYourSite. Setup could literally not be simpler. All you need to do is find your Facebook Pixel ID in the code that Facebook gives you and paste it in. You don’t even need the full code, just the ID. You can add your Google Analytics ID right below it.
Eventually you will want to fire events on certain pages, such as a Lead event on a thank you page. To do this, go to the Events tab of the plugin and click on “Add” under the Events List. Give your event a name (the name doesn’t matter, you are the only one who will see it). Then, in the Event Trigger settings, choose to fire the event on a page visit and paste the URL of your thank you page.
Pay close attention to whether you have selected “URL contains” or “URL matches.” “URL contains” means that if the URL contains the text you pasted in, it will fire the event. For example, if I say my event will fire when the page link contains “http://shutterscp.local/thank-you/” and I create a second page down the line called “http://shutterscp.local/thank-you-2,” the same lead event will fire on the second page because it also contains the same text as the first thank you page link. URL matching is usually the way to go.
Finally, you need to enable the event on Facebook and select the type of event to fire. There are a lot of options, so just pick the one that suits your campaign best. As long as you remember what event you’re tracking, it doesn’t really matter. Then, save your event and you’re done. You can verify that the pixel is working correctly by using the Google Chrome Pixel Helper browser extension. Here you can see that when I visit my thank you page directly, the lead event is firing.
SEO (Search Engine Optimization)
The (yep, free again) Yoast plugin is what we use for SEO. Like the other plugins, it can be installed from the Plugins menu of WordPress.
In Yoast’s general settings, there is a webmaster tools tab you can use to track your site’s performance in Google Search Console. You’ll just need to paste in your verification code.
In the Search Appearance > General settings, you’ll probably want to fill out the Knowledge Graph settings to tell Google more about your business. Yoast also offers a paid add-on for local SEO so you can fill out your business hours, location, etc.
In Search Appearance > Content Types, you can get more control over the SEO settings for pages, posts and more, with the ability to customize meta descriptions, title formatting, and even hide content types from search results altogether. For instance, if you have Elementor installed, you’ll see a content type called My Templates (elementor_library). These are templates for pages, sections, etc. that you create in the page builder, and you probably don’t want them to show up in your search results because they’re not content relevant to your business. So, I always set this (and any other content type listed that I don’t want to see in search results) to be hidden.
Under Social > Accounts, enter all the social media links you can. In the Social > Facebook tab, make sure the “Add Open Graph meta data” setting is enabled, and choose a default image for your site. This will be used when someone shares a page on your site on social media (not just Facebook) that doesn’t have a featured image set, so make it something generic that could work anywhere. It will be cropped to a 1.91:1 aspect ratio, which works out to 1200px x 628px, so make sure you aren’t cutting off anyone’s face as well.
One thing I want to note about using Yoast’s content analysis tool is that it doesn’t perfectly integrate with Elementor, and sometimes you’ll see Yoast dinging you for things that you’ve done. If these things really are present in your content, Google will see them, even if Yoast can’t—it’s just not able to read the content properly. Just make sure that you’re implementing Yoast’s suggestions even if you never get that green dot.
Site Speed
Finally, let’s get our site loading as quickly as possible by installing a caching plugin. This should be the very last thing you do; installing a caching plugin while you’re still designing will only serve to frustrate you, because some straight-up weird shit can happen. Your changes won’t look like they’re taking effect no matter how much you refresh, styling will go out the window for no reason…so just save this for last.
This is the one and only plugin in this article you should definitely buy: WP Rocket. There are some free plugins out there that do different bits and pieces of caching for you, but it’s truly a headache to get them all to work together. WP Rocket does pretty much everything you need for caching and more importantly, it does them well.
To check site speed, I use these tools: tools.pingdom.com, gtmetrix.com and Google Page Speed Insights. I’m happy if I can get a decent loading time and score on Pingdom and GTMetrix. I find that Page Speed Insights gives a lot of technical advice that’s not always realistic or easy to implement in WordPress.
The things I focus on when looking at speed test results are overall page size (how big the files on your site are), HTTP requests (how many files your website has to load) and total load time.
Simply activating the plugin should help your load time a little. You can find the plugin settings on the left-hand sidebar under Settings > WP Rocket. To further optimize your site, first go to Media and turn on lazy loading. This prevents your site from loading every single image before the page shows up, decreasing HTTP requests and page size.
Next, go to File Optimization. There are quite a few items we can turn on in this section, but we will have to do them one by one to make sure nothing is going wrong with WordPress. To do that, check one box at a time, save your settings, then open your site in an incognito window or different browser and verify that it still looks normal. If it starts to look off, go back to the WP Rocket settings, uncheck the setting and re-save.
Here are the items you should check if you can: Minify HTML, Remove query strings from static resources, Minify CSS files, Combine CSS files, Remove jQuery Migrate, Minify Javascript files, and Combine Javascript files.
Now that you’ve activated site caching, one thing you’ll need to remember is to deactivate the WP Rocket plugin before making design changes to your site. This will ensure that the changes you make take effect for everyone and nobody is seeing a cached (old) version of your WordPress site when you don’t want them to.
Pro Tip: If you’re an advanced user and find that you need to deactivate particular files, try the free plugin Asset Cleanup. This allows you to prevent individual files from loading per page, which is super powerful.
If you are using the OceanWP theme, check out the Theme Panel > Scripts & Styles section as well. This allows you to deactivate CSS and JS files for certain theme options, like full screen menus, sidebars, etc. You just have to carefully read through the options to make sure you don’t turn off something you’re using—if in doubt, leave it on.
You’re Done!
Congratulations! That’s really all there is to setting up a WordPress site for your photography business. I hope you found this WordPress series helpful (if you missed part one or part two, check them out in the May and June 2020 issues of Shutter), and use it to build something cool. If you do, be sure to tag us!
