John, Author at Wooassist

How to Change Checkout Form Heading in WooCommerce

February 26, 2015 By John 2 Comments

Here’s a neat trick if, for some reason, you want to change the checkout form heading in WooCommerce. By default, the heading is named “Billing Details” and you can change this to whatever you want in just a few steps.

First off, you’ll need to copy the template to your theme or more specifically, your child theme since you definitely should be using one.

The template can be found at:

\woocommerce\templates\checkout\form-billing.php

You should copy and paste it at:

\yourtheme\woocommerce\checkout\form-billing.php

Afterwards, just open the copy that you pasted into your theme and find the following lines of code:

<?php if ( WC()->cart->ship_to_billing_address_only() && WC()->cart->needs_shipping() ) : ?>

	<h3><?php _e( 'Billing & Shipping', 'woocommerce' ); ?></h3>

<?php else : ?>

	<h3><?php _e( 'Billing Details', 'woocommerce' ); ?></h3>

<?php endif; ?>

Once you find it, simply change “Billing Details” to the text that you want to replace it with.

How to Backup Your WordPress Site

February 22, 2015 By John 2 Comments

For every website owner, there will always come a time when your website will go down. Often, this could be because of a downtime on your hosting service, but sometimes it’s because of some other reason. Maybe your website has been compromised or you did something that caused your site to go down. Notably, if you’re going to be doing some major work on your site, you shouldn’t be doing it without creating a backup first so you can restore your website to a working state just in case you mess something up. Here, we’ll teach you how to backup your WordPress site.

If you are adding some lines of your code to your functions.php file, it is best practice to create a backup copy. When you add your code and your site goes down, you simply replace your functions.php file with the working copy and voila! Your site will be back up. The same can be done for when you are tweaking your CSS files. Though errors in your CSS won’t cause your site to go down, it can really mess up how your website looks. So just create a copy of your CSS file and restore it if anything goes wrong. This basically sums up the concept of website backups only on a larger scale.

Your hosting service probably already has a few backups of your website. So you might think that creating your own backup is not necessary. That’s where you’re wrong. What’s your assurance that your hosting service creates regular backups? Certain situations can also render your host’s backups useless. So essentially, just to be on the safe side, you should have your own backup.

There are two ways to back up your website. The first one is through one of a few available plugins and the second is doing it manually.

Backing Up Your WordPress Site with BackUpWordPress

BackUpWordPress is the easiest means of backing up your website. Simply install the plugin and activate it. When that’s done, head over to tools and Backups. You can then choose between a Database Backup and a Complete Backup. To start backing up, just click on Run Now and wait until backup completes. You can also click on Settings to set the schedule for these backups. You can also add a custom schedule.

By default, your backups are stored on your server at /wp-content/backups. To restore a backup, simply find the latest working backup by navigating to the folder using an FTP client and unzip the backup on your server making sure to overwrite everything.

Backing Up Your WordPress Site with Backup Buddy

BackupBuddy is another popular backup plugin. Unlike BackupWordPress, BackupBuddy is a premium plugin so there is no free version. Once you get the plugin installed and set up, simply go to Backup. From there, you can choose to backup the database or do a complete backup. Next, you can choose to download the backup file so you can store it right in your computer’s hard drive.

You can also tweak your settings to have backups saved to Dropbox or Amazon S3, create custom backup profiles, and schedule backups.

How to Create Manual Backups

Backing Up Using MySQL

You can also backup your website manually using MySQL. To do this, head over to CPanel. From there, you can find phpMyAdmin. Click on the database and click on the Export tab. You can choose either quick or custom export. Set compression to gzip then click on Go.

Backing Up with CPanel

To create back-up using CPanel, navigate to Backup Manager and click on Create Backup. Where it says Download a MySQL Database Backup, just click on the database and download. A simple enough process but using a plugin just saves you from the trouble of doing this manually.

So when was the last time you backed up your website? Do you even have an existing backup? If you don’t, then it’s time to make one before it’s too late.

How to Speed Up Your Website by Cleaning Your Database

February 18, 2015 By John Leave a Comment

You might have read a few, or maybe a ton of articles about optimizing your website page load speeds. You might already know a few strategies like optimizing images, caching and minification, and getting a CDN. But here’s another strategy that is rarely discussed: maintaining and cleaning your database.

For many website owners, the database is just one of the requirements for a WordPress install. It is however more than just that. Keeping your database clean and optimized can also shave a few seconds of loading speed. We’re all suckers for that one or two seconds. And believe it or not, one or two seconds saved could mean the difference between a bounce and a conversion.

What’s in Your Database?

If you don’t know what the database is for, then you might be surprised just how important it is. WordPress makes use of PHP to communicate with the database which contains important information such as posts, pages, your WooCommerce products, comments and product reviews, users and customer information, URLs, etc.

Why Do You Need to Clean Your Database?

Think of a database like it’s your computer’s hard drive. It’s where all your data is stored. It’s where you keep everything and without it, your computer won’t work. If you want to keep your computer running in top form, you clean your hard drive. The same concept applies to a website, to keep your website running fast and smooth, you clean its database by removing all that gunk and clutter.

What’s there to clean? Over continued use, a website accumulates many spam comments, copies of post revisions, and remnants of deleted plugins and themes. When that becomes too large and bloated then website performance will suffer.

Back Up Your Website

Now that you know the importance of a database, you just want to jump in and clean your database. Halt! Before you start any database cleaning, it would be wise to create a backup of your website. There are a couple of plugins that can help you do this. Your hosting provider will most likely have a backup of your website so can also check in with them.

Clean ‘Em Up

You can clean up your website database manually or you can use these awesome plugins.

WP-Optimize

WP-Optimize is one of the most popular plugins for cleaning your database and it is also one of the easiest to use. Simply install the plugin and run it. The plugin also allows you to schedule a regular database cleanup which is pretty handy if you want to keep your database in peak condition.

WP-DBManager

WP-DBManager is another popular plugin for database optimization. It is however geared for more advanced users. Setting it up can be tricky if you’re not familiar with database elements. Being trickier however means that it has more customizable options and features. Some of its features include repairing a corrupted database, a database restore, running MySQL calls, and clearing tables. WP-DBManager however cannot clear bloat so if you want to go with this one for its host of other features, you still might want to consider getting WP-Optimize or any other means to clear database bloat.

So when was the last time you optimized your database? What tool or plugin did you use to clean it?

Improve Website Page Load Speed by Optimizing Images for Web

February 15, 2015 By John Leave a Comment

Optimizing images on your website whether it’s an e-commerce store, a blog, or both is one of the most important things thing that you can do to improve its performance. And it shouldn’t be a complex task really. Sure, high-res images look great but when you’re loading a 2MB image, it’s going to do more harm than good.

Essentially, you’re going to want to aim for a small image file size without compromising quality. As a rule of thumb, don’t let the images look bad or pixelated just for the sake of being smaller in size. You should strike a balance between a good-looking image and an acceptable image size. Here are a few ways on how to optimize images for the web.

Optimizing Images for Web Using Photoshop

Optimizing images for the web is not at all difficult. If you have Photoshop (or any other image editing software), it’s a very simple process. Open the image on Photoshop and resize or crop your image to the appropriate size. Remember, when sizing images, the images you plan to use should not have a larger resolution than the image placeholder.

When you have resized your image to the appropriate resolution, click on File and Save for Web (Ctrl + Shift + Alt + S). Here you’ll be able to set the quality of the image while being able to see if the image still looks good. The image should not look pixelated and not have artifacts. In the bottom left section, you can see the file size of the image. You’re going to want to aim for an image that looks good, is not pixelated, and is less than 100kb in size — the smaller the size the faster the image loads on the page. On the upper right-hand section of the “Save for Web” window, you can use available presets or set the quality to your desired quality. Make sure you have the Optimized box is ticked and choose the correct file type. When you achieve a small file size with a good-looking image, click on Save.

A Note on Image Types

An important thing to note to make images look good even as you scale them down is to set the correct file type. Notably, the JPEG type is used for photos as it supports the most number of colors at 16 million. PNG is the better choice if you’re working with graphics such as logos and icons since it makes use of lossless compression. Lossless compression means that the image can be made smaller without affecting quality. PNG supports thousands of colors as well as transparency. JPEGs don’t support transparency.

GIF images are similar to PNG. It uses lossless compression and supports transparency. It however can only store a measly 256 colors. Using GIF images on web pages is generally not recommended.

Serve Images in WebP Format

We also recommend converting your image files to the modern webp image file format since these are smaller in size and are thus recommended for achieving optimum site performance. Uploading webp files are still not recommended however as there are still devices and browsers that do not support it. There are however plugins and services that allow converting regular image file types to webp and serve these images when it is supported by the user’s device. WP-Optimize is one plugin that provides free webp conversion.

Optimize Images Using WordPress Plugins

We also recommend having an image optimization plugin installed on your WooCommerce store. There are many image optimization plugins to choose from such as EWWW Image Optimizer, reSmush.it, Robin Image Optimizer. Once you set up these plugins, they will optimize your images on upload. Do note, however, that these image optimization plugins will not alter image resolution so it is still recommended to upload images in the correct resolution not exceeding the image placeholder size.

Properly Naming Files

A thing to note when naming files is to name files as they are. Don’t name files after a keyword when it is not appropriate. If you’ve got an image of a child playing the violin, name it something like “child-playing-violin.jpg” and not something like “learn-violin-online.jpg” or “free-violin-course-online.jpg”. If you try to force your SEO keywords on your image file names, your site may be flagged for overoptimization.

Optimize your images to ensure your site performs well. A fast e-commerce website provides a good user experience which translates to better SEO rankings and improved conversion rates.

How to Speed Up Your E-commerce Site through Caching and Minification

February 12, 2015 By John Leave a Comment

speed-up-your-website How fast your website loads affects your conversion rate and ultimately, your revenue. If it takes 12 seconds to load up your website, that’s just a little too long and many potential clients could be annoyed and just click on the close button; go back to Google and click on something else. If that’s not bad enough, that person could forever remember that your website is that one website that loads very slowly. Any chance of converting from that person is gone.

There are a lot of ways to speed up your website. One is by optimizing the images that you use for your e-commerce site which I discussed in another post. This time around, we’ll look at how to speed up your e-commerce site with caching and minification.

What is Caching?

Caching is a means of serving your content as static pages instead of being dynamic pages. Serving static content is faster as opposed to dynamic content which means longer page load times. Essentially, caching is storing your dynamic content in the server as static content which will then be served when a browser communicates with the server. The static content that is saved on the server is updated at set intervals.

What is Minification?

When developers make code, they make code with a lot of white space. This is best practice in the sense that the code becomes easier to read and understand for humans. This however is not best practice for servers that read and parse the code to load up all the elements of your website. Computers don’t need that white space. All that white space just makes reading the code take longer for the machine. Even when you’re using a premium theme, you’ll see a lot of white space when you try to look at the code. This is where minification comes in. Minification removes all that white space and optimizes your code so that it becomes easier to read for machines to make parsing the webpage faster.

Implementing Caching and Minification

w3-total-cache Now that we know what caching and minification is, it’s time to get to know how to implement it. If that sounds all too complicated, don’t worry. It is really very simple. All you need is one plugin to do both. That’s the beauty of WordPress. Seemingly complicated stuff becomes easy work. For this bit, we would recommend the W3 Total Cache plugin, because it has caching and minification solutions all in one plugin.

Setting up Caching with W3 Total Cache

Install the plugin and activate it. After that, click on Performance on your WordPress dashboard and click on Page Cache. From there, you can turn on specific settings based on your caching needs. There is no single effective setting for all websites so feel free to go with your own settings and test page loads speeds after. When you’re done tweaking, just click on “Save all settings”.

A note on caching… When you’re updating your website like adding new products, editing blog posts, or adding new functionality, it would be best to turn off caching entirely while working so you can see all the changes you make right away. Just don’t forget to turn caching back on when you’re done.

caching

Setting up Minification with W3 Total Cache

While you can set up minification manually, there’s no need to do it when all you need is a plugin and a few clicks. To set up minification with W3 Total Cache, just click on Performance then on Minify. After that, just tick “Enable“ for HTML & XML, JS, and CSS. You can tick other settings on and off as needed. When you’re done, just click on “Save all settings” and you’re all set for minification.

minification