WooCommerce Tag Archives - Page 6 of 15

How to Fix Checkout Problems in WooCommerce

June 6, 2016 By John 84 Comments

One of the biggest problems a WooCommerce store owner can encounter is when the checkout fails. There are a lot of different types of issues that could happen during checkout, but these can be fixed easily if you can identify what is causing the problem. However, finding out the cause is not always easy for the average user. In this post, we will teach you how to fix the common checkout problems in WooCommerce.

The information in this post may or may not help with the specific problem that you are experiencing with your checkout. You may have a similar problem but the source could be different, hence the solutions mentioned here may not work for everyone. It is best to have a developer adept in both WordPress and WooCommerce make the suggested fixes for you. We also recommend that you create a staging/development site and do your debugging there rather than on the live site.

Most Common WooCommerce Checkout Issues

Here at Wooassist, a lot of new clients come to us with problems on their checkout. Having issues on the checkout page can be daunting as it can be difficult to figure out the cause. The checkout page is crucial because it is the last page of the “user shopping experience”. A simple error that could be fixed in a few minutes can hurt your business if it is not addressed swiftly. You could end up losing business opportunities and customers. To fix the problem, we need to figure out what the error is first.

Below are some common issues we encounter that you could be experiencing right now on your WooCommerce store.

Checkout Page Isn’t Available and is Just Redirecting Back to an Empty Cart

While there are many reasons why checkout would redirect to an empty cart, it’s usually because your hosting is not totally compatible with WooCommerce.

The issue is most common with stores that enabled “force https on checkout”. In this case, the issue could be caused by a PHP security module called Suhosin. WooCommerce already has an official fix posted for this.

Simply paste the code below in your server’s PHP settings.

suhosin.session.cryptdocroot = Off

Review Order Section is Stuck on Loading

When a customer enters their shipping/billing information, this triggers a script to reload the review order data. When there is an error in the script, it will just get stuck without an error shown that would’ve helped you understand what’s happening.

This usually happens when the returned data is not what WooCommerce expects. This is caused by either a plugin or template conflict. To fix this, you will need to check compatibility with all plugins installed and update any outdated WooCommerce templates.

Payment Option is Not Working

Some popular payments options are PayPal, Stripe, Authorize.net and eWay. These are the services that you’ve installed in your store to handle the payment process between you and your customers. This is the page where users enter their credit card information and hit the “place order” button.

Here are some scenarios where the payment option does not work:

Payment option is not available on checkout

You are sure that you have completely configured your payment option but it’s not showing up on the checkout page. This usually happens with stores that don’t have an SSL certificate installed and the payment option requires one. You can learn more about SSL in this post.

Authentication error pops up

When an authentication error pops up, this means there is something wrong between the connection of your store and your payment option service provider. To fix this, check that the credentials you entered in the payment option’s settings are correct.

Unknown error pops up

Unknown error popping up could mean that a PHP script in WooCommerce isn’t working properly. There are many things that could cause this. It may be due to a plugin conflict, or your hosting doesn’t support the custom AJAX endpoints utilized by WooCommerce. To fix this you will need to check each plugin installed. Try disabling the plugins one at a time and see if that fixes your problem.

Nothing happens after clicking “Place order” button

If nothing happens when you click the place order button, then most likely there is a JavaScript conflict in the checkout page. The best way to fix this is to check your browser’s console to see which scripts are in conflict. You’ll want a developer to do this for you though.

Did any of these help solve your checkout page problem? If you have any other problems with checkout on your WooCommerce store, you can hit the comments or contact us and we’ll see what we can do for you.

How to Make WooCommerce Pages Full Width in Storefront Theme

April 23, 2015 By John 20 Comments

EDIT: Storefront now has a full-width page template so you no longer need to use the custom code in this article. To remove the sidebar on WooCommerce pages, you can set the page template to Full Width.

If you are using Storefront theme and you want to use the Full Width template for your store and other pages, you might come across a problem. After you’ve set your page to the Full Width template, you can still see the sidebar. And that’s not the case with the other pages, since setting the template to Full Width effectively hid the sidebar.

shopimage — Here is a shop page that is supposed to be full-width but still shows the sidebar

And here is a product page which is supposed to be full-width but still shows the sidebar

This happens because all WooCommerce pages use the templates on the WooCommerce plugin. They do not use the Storefront templates. To resolve the problem, add the following code to your child theme’s functions.php.

add_action( 'wp', 'woa_remove_sidebar_shop_page' );
function woa_remove_sidebar_shop_page() {

if ( is_shop() || is_tax( 'product_cat' ) || get_post_type() == 'product' ) {

remove_action( 'storefront_sidebar', 'storefront_get_sidebar', 10 );
add_filter( 'body_class', 'woa_remove_sidebar_class_body', 10 );
}
}

function woa_remove_sidebar_class_body( $wp_classes ) {

$wp_classes[] = 'page-template-template-fullwidth-php';
return $wp_classes;
}

This code would remove the sidebars on the product page, product categories, and the shop page. It would also add the page-template-template-fullwidth-phpclass that causes the layout to be in full width.

Now you know how to make WooCommerce pages full width in Storefront Theme! If you have further questions please let us know.

How to Set up AMP for WooCommerce and Speed Up Your Mobile Site

October 28, 2018 By John 2 Comments

For WooCommerce store owners, it is important to present your customers with a fast WooCommerce store. This is especially important for mobile the mobile platform. One means of achieving top speeds is to set up AMP. In this post, we’ll show you how to set up AMP for WooCommerce.

What is AMP?

Accelerated Mobile Pages, or simply AMP, makes websites load faster on mobile devices. This is an open-source initiative that Google started.

As Google pushes for a faster web experience, it approves of websites that have fast page loads speeds. And since AMP is a pet project of Google, you have everything to gain and nothing to lose by adopting it. To be clear, AMP is not yet a ranking factor for SEO. However, you and your customers would still benefit from AMP since more searches are now being done on mobile devices.

How to Set Up AMP for WordPress

Before you can set up AMP for WooCommerce, you first need to set up AMP for WordPress.

To set up AMP for WordPress, you will need to use a plugin. On your WordPress Dashboard, go to Plugins then Click on ‘Add New’. Search for AMP for WordPress. Once you find the plugin, click on Install Now and then activate it.

You can also download the plugin directly from the WordPress plugin repository and upload it on your site. After that, you will need to activate the plugin from your plugins page.

If you are running a multisite network, you can install the AMP plugin on the multisite and activate it for the network.

Now that you have set up AMP for WordPress, you can get started on setting up AMP for your WooCommerce pages.

How to Set up AMP for WooCommerce

For integrating AMP for WooCommerce, you will need another plugin. Currently, there are no free plugins that add AMP functionality to WooCommerce so you will have to purchase a premium plugin. You can choose between the WooCommerce Pro for AMP plugin or the Publisher AMP plugin.

To enable AMP for WooCommerce, simply install and activate the plugin.

As you can see, setting up AMP for WordPress and WooCommerce is easy. But the work doesn’t stop there. You will still need to test your AMP site.

How to Test AMP

There are a few tools that can help you test your AMP set up. Simply input any of your AMP pages on the two sites below and you will be provided with results.

https://search.google.com/test/amp

https://validator.ampproject.org/

You might also want to check Google Search Console for any errors in your AMP set up. If you are not connected to Google Search Console, you can use Yoast SEO plugin to connect your WooCommerce store.

If you find any errors in your AMP set-up, you can get started on fixing them. If you are stuck and need help fixing any errors, you can contact the Wooassist team and we should be able to help out.

Check Your AMP Speed

You can also check your AMP site for any improvements in site speed using GTmetrix or Pingdom.

Ensure Your AMP Pages are Indexed by Google

One way to ensure that your AMP pages will be indexed by Google is to generate a sitemap that includes the AMP pages. You can then upload it on Google Search Console. Just log in to your Google Search Console and then click on sitemap. In the field, just indicate your sitemap URL and click on “Submit”.

Ensure AMP Works with Yoast SEO Plugin

If you are using Yoast’s SEO plugin, which we recommend you do, you will need to integrate Yoast SEO with AMP. This is a simple tasks and just requires that you install the Glue for Yoast SEO & AMP.

Final Notes

Now that you’ve set up AMP for your WooCommerce store, the mobile experience should be much faster. If you are having issues setting up your AMP, you contact us and we’ll see what we can do to help.

If you are looking for other ways to speed up your site, you can check out our post on how to speed up your WooCommerce store.

Do This Right Now to Protect Your WooCommerce Website from Credit Card Attacks (And Save Yourself From Enormous Fees)

September 17, 2021 By John Leave a Comment

Website security is often one of the most overlooked aspects of owning a WooCommerce website, at least until the attacks succeed. One of the most worrying security risks over the last few months is the increase in the frequency of credit card fraud. The increase specifically comprises of card testing and bin attacks. In this article, you will learn how you can protect your WooCommerce website from credit card attacks.

Protect Your WooCommerce Website from Credit Card Attacks

What are Card Testing and Bin Attacks?

Card testing and bin attacks involve an attacker attempting a transaction on your website and testing thousands of credit card number combinations on your checkout page. They will keep doing this until they get a combination that works.

If an attack is successful, they will be able to commit fraud. But even if the attackers don’t succeed, it still doesn’t bode well for the website owners. You will get slapped with a hefty fee worth thousands of dollars by the credit card processor company themselves.

If this hasn’t happened to you yet, consider yourself lucky as it already has to many other store owners. You can improve the security of your site so you don’t fall victim to card testing and bin attacks.

Standard Website Security

If you own a WooCommerce website, you should have already taken the standard security measures for your website. This includes keeping your plugins and themes updated, installing an SSL certificate, installing a security plugin, and other best practices. If you haven’t yet, you can check out these posts.

The Most Important Steps to Take Against Card Testing and Bin Attacks

Credit card processors will usually push the blame of the card testing and bin attacks to the business owner. However, they also have a responsibility to keep their own systems secure. Being financial organizations, credit card processors need to have the most secure systems.

Most merchant account owners would not be aware that card processors have additional security features. These can be configured to prevent card testing and bin attacks. This extra line of security is your best protection against credit card fraud.

3DSecure

While some of these features may bring some additional fees, enabling them is recommended. For example, one of these technologies is 3DSecure. This requires customers to complete an additional verification step for each credit card transaction. In theory, this should fully prevent any automated attacks. And even if an attack does get through, the credit card processor should no longer hold you liable for it.

Fraud Filters/Rules

Some credit cards processors would have other extra security features that don’t require any additional payment. One example is being able to configure simple rules to filter out suspicious card activity. For instance, you could filter out all transaction attempts outside of the countries you are servicing. That would already block most attackers.

You can also filter out transactions that have had a number of failed attempts within a short amount of time. This is called the velocity filter or rate-limiting. For example, you can filter out transactions with 5 failed attempts within 5 minutes. This results in the card processor rejecting further attempts. This won’t stop the attack entirely. However, it can reduce the number of attempts because the rejected combinations are now worthless to the attacker.

Know What Security Tools are Available to You as a Merchant

The most important thing is to know your credit card processor and the security features they have available. Contact them if necessary. If they don’t have any of these, then we strongly recommend switching to another company that offers better security.

Steps to Take on the Website Side to Prevent Card Testing and Bin Attacks

Once the credit card processor side of things has been sorted, next will be the website side. Proper defense against credit card fraud consists of measures taken on both the card processor and website site. To this end, we recommend a system with 3 lines of defense.

Install a Website Firewall

A website firewall such as Sucuri is designed to monitor activity on the website. It can block brute force attacks, filter user sessions with suspicious behavior, and patch vulnerabilities. For preventing card testing and bin attacks, we want the ability to filter out sessions that display suspicious behavior. Since credit card attacks usually involve bots, a firewall is a good first line of defense.

Add a Captcha

A captcha is a verification system designed to filter out bots from legitimate human users. It helps prevent bots from doing any malicious activity on your sites like submitting contacts forms, sign-up forms and even checkout forms.

Preventing bots from completing the checkout form is what we need against card attacks. While Captchas have a slight impact on user experience, they’ve continued to improve over the years. Google’s ReCaptcha v2 and v3 are among the best examples. Learn how to set up Recaptcha for WooCommerce here. And with that, your second line of defense is set.

Set Checkout Attempt Limit

In the unlikely chance that attackers bypass both the firewall and captcha, this next line of defense is designed to address the main problem. The main issue with card testing and bin attacks is the surge of transaction attempts sent over to the card processor. Similar to the velocity filter on the card processor side, you can set up a similar filter on the website side using the Woo Manage Fraud Orders plugin. You can set it up to automatically block the users that execute consecutive failed attempts at placing an order on your site. The plugin allows you to set a limit to the number of fraud attempts. For example, you can set this at 5 attempts. This way, 5 will be the maximum number of transaction attempts sent to the card processor and the attacker is permanently blocked from the website.

Conclusion

Credit card testing and bin attacks are on the rise. You can prevent it from happening to your site.

Make use of fraud prevention features on your credit card processor and implement our recommended security measures on the website side. Find out what anti-fraud measures are available to you as a merchant. These security tools will save you from being fined thousand’s of dollars. Contact your credit card processors to know what tools you can set up. Implement them. Then proceed to implement the security measures on the website next

If you need any assistance on the technical side, we can help. And if you have questions, don’t hesitate to contact our support team.

Disclaimer: Article contains affiliate links. When you buy through links from this article, we may earn an affiliate commission.

How to Fix Blurry Product Images in WooCommerce

February 26, 2015 By John 10 Comments

Sometimes you upload an image in WordPress/WooCommerce and it just doesn’t show up like you intended it. Sometimes they don’t align. Sometimes they don’t fit the placeholder. Sometimes the image just doesn’t show. And sometimes, the image gets blurry. Why the image gets blurry may be caused by one of a few problems. Here we discuss the common causes and how to fix blurry product images in WooCommerce.

You Uploaded a Blurry Image

If you uploaded a blurry image then don’t expect that you’re going to get a good image to show up. Maybe you viewed the image in a small screen so it looks okay but when you view it on a larger screen, you’ll find that it actually is blurry. If this is the case, there is hardly anything that you can do to fix the image. Image editing tools like Adobe Photoshop may be able to help a bit by making the image sharper but don’t be expecting any significant changes. Odds are you’ll have to get a better image.

WooCommerce Recommends Using Large Product Images

Before, WooCommerce images need to be a specific size that you set in WooCommerce settings. That is no longer the case. WooCommerce now uses a lighthouse so images pop up big when users click on it. Large images look great and will help sell your products. However, make sure they are properly optimized.

For most themes, WooCommerce recommends uploading an image that is at least 800×800 pixels. Don’t worry about the image being bigger than the placeholder as WooCommerce automatically sizes your images and will only show the full resolution when clicked.

To control thumbnail cropping of your product images, you can go to Appearance > Customize > WooCommerce >Product Images and then select your desired cropping settings.

If the image is not the problem, there might be a problem with how your images are rendered. You can try to regenerate image thumbnails.

How to Regenerate Thumbnails

Other than when changing image settings in WordPress and WooCommerce, you may also need to regenerate the image thumbnails on your website if they appear blurry after a redesign or changing to a different theme. The best and easiest way to regenerate image thumbnails is to use the Regenerate Thumbnails plugin. Simply install and activate the plugin and from there, go to “Tools” and “Regen. Thumbnails”. Just click on the button “Regenerate All Thumbnails” and the plugin will fix the blurry images like magic.

If you want to regenerate thumbnails for specific images instead, you can do this on the Media page on your admin panel. Make sure you are viewing images with List view. Simply hover over the image and the link to regenerate thumbnail should appear. You can also mark all the images you want to regenerate thumbnails and use Regenerate Thumbnails from Bulk Actions and then apply.

Best Practices on Image Use

There are a lot of things that you can do to avoid blurry images by following best practices. Once you set an image dimension, make sure that the images you upload comply with that requirement. Uploading a bigger image in WooCommerce is okay but make sure the image is optimized so as not to affect your page load speed. You can set how you want image thumbnails to be cropped. If you upload a smaller image, it might look okay on a mobile device but not on a PC or laptop. It is also important to know what image file types to use.

Another best practice for images is to always set an alt text for your image. If the image fails to load, the alt text will show up and the user will at least know what the image is about. Also, name your files properly. Don’t name your files after SEO keywords. If you have an image of a ukulele, give it a descriptive file name and not “buy-cheap-ukulele”.

« Previous Page
1
…
4
5
6
7
8
…
15
Next Page »