How to Translate WooCommerce (Every Situation Covered)

Battling learn how to translate WooCommerce as a way to create a shopper-friendly, multilingual eCommerce retailer?

Making a multilingual WooCommerce retailer has quite a lot of advantages, with the 2 greatest ones being the next:

1. Consumers can browse your retailer of their most well-liked languages, which creates a a lot better purchasing expertise for them. A Gallup survey commissioned by the European Union discovered that 42% of consumers won’t purchase from shops that aren’t out there of their native languages.
2. You’ll be able to attain extra consumers within the first place due to multilingual web optimization. You’ll be able to rank your merchandise in Google for various languages, which helps you drive extra natural site visitors to your retailer.

Nonetheless, WooCommerce doesn’t embrace built-in multilingual performance, so that you could be hitting some points relating to learn how to translate WooCommerce.

Fortunately, with the appropriate instruments, you’ll be able to simply create a multilingual retailer with zero technical information required. And on this information, we’re going to point out you the way.

By the point you end this tutorial, you’ll have the ability to use a easy visible interface to totally translate your retailer into an infinite variety of new languages—this consists of your merchandise, store pages, cart, checkout, and every little thing else:

Or, if you happen to don’t wish to translate your retailer from scratch, you may get some assist from automated machine translation powered by Google Translate or DeepL after which refine these translations through the visible editor.

On the frontend, your consumers will have the ability to select their most well-liked languages utilizing a versatile language switcher and you’ll even routinely redirect folks to their native languages based mostly on their location and browser preferences.

Able to learn to arrange WooCommerce translation? Let’s dig in!

What You Have to Translate WooCommerce

WooCommerce consists of all the options that it’s worthwhile to create a completely functioning eCommerce retailer… however solely in a single language.

So—how do you make it as a way to translate your retailer into a number of languages and let consumers select their most well-liked languages?

Nicely, as is so typically the case with WordPress, you’ll want the assistance of a plugin.

Whereas there are various popular multilingual plugins, we’re going to make use of the TranslatePress plugin for this tutorial for a number of causes:

1. It gives out-of-the-box help for WooCommerce, so that you’ll have the ability to fully translate WooCommerce together with the cart and checkout pages.
2. A free model allows you to create a completely multilingual retailer in a single new language. You’ll be able to comply with most of this tutorial utilizing simply the free model.
3. You’ll be able to handle your translations utilizing a visible interface such as you noticed above.
4. It helps automated machine translation through Google Translate or DeepL if you wish to save time.

The best way to Translate WooCommerce With TranslatePress

Now that you understand what TranslatePress is, let’s get into learn how to translate WooCommerce utilizing the plugin.

For this tutorial, the one factor that we’ll assume is that you have already got a working WooCommerce retailer in your retailer’s authentic language.

Along with configuring WooCommerce settings and including product/retailer content material, you’ll wish to absolutely arrange your WooCommerce theme and any WooCommerce plugins you employ.

For this instance, we’re utilizing the free Unite theme, which gives full WooCommerce help. Nonetheless, TranslatePress will work with actually any WooCommerce theme, so you’ll be able to select whichever theme you need.

You’ll have the ability to comply with most of this tutorial utilizing the free version of TranslatePress available at WordPress.org. Nonetheless, a number of options require the paid model of TranslatePress, which we’ll make sure to be aware within the tutorial beneath.

1. Set up TranslatePress and Select Languages

To get began, set up and activate the TranslatePress plugin.

You’ll be able to set up the free model from WordPress.org. Or, if you happen to determine to buy TranslatePress premium, you’ll be able to obtain the premium plugin out of your TranslatePress dashboard.

When you’re uncertain which model is greatest for you, you’ll be able to at all times begin with the free model and improve later with out dropping any of your settings and translations.

When you’ve activated the plugin, go to Settings → TranslatePress to decide on the languages that you simply wish to use in your retailer:

• Default Language – the language during which your entire retailer’s present content material exists.
• All Languages – a number of new languages into which you wish to translate your retailer’s content material. The free model of TranslatePress allows you to add one new language (two languages complete). So as to add two or extra new languages, you’ll want the premium model of TranslatePress, which helps limitless languages.

For instance, in case your retailer at the moment exists in English and also you wish to translate it into Spanish, you’d configure the TranslatePress settings like so:

TranslatePress gives out-of-the-box help for lots of of languages and locales, so you must have the ability to discover your entire desired languages utilizing the drop-down.

Nonetheless, if you happen to don’t see the language you wish to use, TranslatePress additionally allows you to add customized languages.

You’ll be able to set these up by going to the Superior tab of the TranslatePress settings space and scrolling right down to the Customized language part.

2. Set Up Automated Translation (Non-obligatory)

This step is optionally available. Nonetheless, if you wish to save a while, you need to use automated machine translation to generate your retailer’s baseline translations quite than translating every little thing from scratch.

Even if you happen to use machine translation, you’ll nonetheless have the ability to absolutely edit all of the translations that the service generates, so that you’ll have full management over each single translation in your WooCommerce retailer.

When you do not wish to use machine translation, you’ll be able to skip the following step to begin translating your content material manually.

When you do wish to use machine translation, TranslatePress helps two totally different providers:

• Google Translate – you need to use this with the free model of TranslatePress;
• DeepL – this service requires the premium TranslatePress Enterprise license.

Google Translate needs to be effective for primary makes use of, however many individuals discover DeepL’s translations to be a bit extra correct, particularly relating to context and casual language.

Nonetheless, the draw back of DeepL is that it doesn’t help as many languages as Google Translate, so that you’ll wish to double-check that it helps your chosen language.

You’ll be able to arrange these providers by going to the Automated Translation tab of the TranslatePress settings space.

First, set the Allow Automated Translation drop-down equal to Sure to increase further choices.

Subsequent, select your most well-liked translation engine. Then, you’ll have to enter an API key for that service, which helps you to join your WordPress web site to that service.

TranslatePress has step-by-step documentation on learn how to acquire the API key for each providers:

Lastly, you even have the choice to set a restrict for what number of machine translation characters to carry out per day, which helps you management your price range.

The TranslatePress plugin does not cost you something based mostly in your machine translation utilization. Nonetheless, you could have to pay Google Translate or DeepL immediately relying in your utilization.

Google Translate and DeepL supply free plans that allow you to translate 500,000 characters monthly at no cost, roughly equal to round 100,000 phrases monthly.

If it’s worthwhile to translate greater than 500,000 characters in a single month, you’ll have to pay:

• Google Translate fees $20 per million characters over the free restrict.
• DeepL fees a flat $5.49 price monthly plus $25 per million characters, making it a little bit dearer than Google Translate.

When you’re apprehensive about your price range, you need to use TranslatePress’s every day translation limits to both assure that you simply keep inside the free tier or restrict how a lot you may have to pay for the API entry.

When you’ve made your decisions, click on the Save Adjustments button. Then, TranslatePress will begin automatically translating your site‘s content material.

3. Translate WooCommerce Content material

Now, you’re prepared to begin translating your WooCommerce store‘s content material.

Whether or not you determined to make use of automated machine translation or not, you’ll use the identical visible translation interface to handle your entire translations:

• When you used machine translation, your retailer’s translations will probably be pre-filled with the translations from the service. However you’ll have the ability to absolutely edit these translations if wanted.
• When you did not use machine translation, the interpretation fields will probably be empty to begin with and also you’ll want so as to add your translations from scratch.

TranslatePress makes use of a visible translation editor, as you noticed above. We’ll present you the way the editor works at a excessive stage after which dig into learn how to translate particular elements of WooCommerce.

To launch the interpretation editor, open the piece of content material that you simply wish to translate on the frontend of your web site. Then, click on the brand new Translate Web page possibility on the WordPress toolbar:

Within the translation editor, you’ll see a dwell preview of the web page on the appropriate aspect of the display and a sidebar on the left the place you’ll be able to handle your translations.

To translate any textual content or different content material, all you do is hover over it on the dwell preview and click on the pencil icon. This can open the interpretation within the sidebar, the place you can also make your adjustments utilizing the editor discipline:

You’ll use this identical method to translate your retailer’s content material, whether or not it’s a product, the cart web page, a weblog submit, or anything.

To higher perceive the way it works, let’s have a look at learn how to translate particular elements of your WooCommerce retailer.

The best way to Translate WooCommerce Merchandise

To translate a WooCommerce product, open the product you wish to translate on the frontend of your retailer. Then, click on on the Translate Web page possibility on the WordPress toolbar to launch the editor.

You’ll be able to then translate all the product particulars we confirmed you within the GIF above.

You may also transcend simply translating product textual content and ” translating” product photographs in order that your retailer will present totally different photographs based mostly on the language a consumer has chosen.

That is particularly helpful if a few of your product photographs embrace textual content or if you happen to simply have to localize a picture for some cause.

To translate a product picture, simply hover over it and click on the pencil icon. You’ll then have the ability to choose a distinct picture to make use of out of your WordPress Media Library:

Be aware – in case your WooCommerce theme makes use of a lightbox or zoom impact for product photographs, you may have to click on on the picture to open the lightbox earlier than you’re in a position to click on the pencil icon.

The best way to Translate WooCommerce Retailer Web page

To translate your retailer pages, you need to use the identical visible editor. Simply open the shop web page or product archive you wish to translate and click on the Translate Web page button.

The great factor right here is that TranslatePress will routinely detect any product particulars you’ve already translated. So if you happen to’ve already translated your entire product’s titles, these translations will probably be pre-filled in your store pages:

The best way to Translate WooCommerce Cart Web page

TranslatePress additionally makes it straightforward to translate the WooCommerce cart page utilizing the visible editor.

By default, TranslatePress will attempt to use WooCommerce’s current language pack if it’s out there. Nonetheless, you’ll be able to absolutely edit all the translations in your entire retailer’s languages (together with your retailer’s authentic language).

Your WooCommerce purchasing cart has two totally different states that should be translated:

1. Empty – the cart content material earlier than a consumer has added any objects.
2. Full – the cart content material when the patron has added a number of objects.

To start, go to the frontend of your retailer and be sure that your purchasing cart is empty. Then, open the cart web page and launch the TranslatePress editor.

Now, you need to use the identical point-and-click method to translate all the empty cart content material. Once you open a translation, you may see that it’s pre-filled with the interpretation from WooCommerce’s language packs, however you’ll be able to edit each translations as wanted:

When you’re completed translating the empty model of your cart, return to the frontend of your retailer and add an merchandise to your cart. Any merchandise will do—the one factor that issues is a product in your cart.

Then, return to the cart web page and launch the TranslatePress editor once more. Now, you need to use the identical method to translate all the content material that may seem when a consumer has objects of their cart:

The best way to Translate WooCommerce Checkout Web page

You’ll be able to translate the WooCommerce checkout web page identical to you translated the cart web page.

To start, launch the checkout web page on the frontend of your retailer. Which means you’ll want so as to add an merchandise to your cart and click on the button to take a look at.

After you have the checkout web page open, use the button on the WordPress toolbar to launch the TranslatePress editor simply as you’ve been doing.

Now, you’ll be able to translate the WooCommerce checkout utilizing the identical point-and-click method.

As with the WooCommerce cart web page, TranslatePress will attempt to pre-fill the translations by importing them from the prevailing WooCommerce language pack if out there. Nonetheless, you’ll be able to absolutely edit the translations in your entire retailer’s languages, together with the unique language.

The best way to Translate Menu Objects, Widgets, and Different Frontend Content material

At this level, you know the way to translate all of the vital components of your WooCommerce retailer. Nonetheless, it’s vital to notice that you need to use the very same method to translate different components in your retailer together with:

• Menu objects;
• Widgets (or block widgets);
• Content material from the WordPress editor—it really works with each the brand new block editor (Gutenberg) and the traditional TinyMCE editor;
• Content material that you simply’ve designed with page builder plugins;
• Varieties from any form builder plugin;
• Popups from popup plugins;
• …and so forth.

For instance, if you wish to translate considered one of your retailer’s menu objects, you’ll be able to simply hover over the menu merchandise and click on the pencil icon:

When you translate the menu merchandise as soon as, TranslatePress will routinely use that translation for each spot the place that menu merchandise seems—there’s no have to duplicate your work on different pages.

The best way to Translate web optimization Metadata

Suppose you wish to profit from multilingual WooCommerce web optimization. In that case, you’ll additionally have to translate your retailer’s backend web optimization particulars equivalent to web optimization titles, meta descriptions, URL slugs, Open Graph data, and so on.

TranslatePress also can enable you to translate all of those particulars, however you’ll want the web optimization Pack add-on, which is offered on the premium Personal license of TranslatePress.

With this add-on, you’ll be able to translate your entire web site’s web optimization data. To do that, TranslatePress routinely integrates with most popular SEO plugins together with Yoast web optimization, Rank Math, and extra.

As soon as you put in the web optimization Pack add-on, you’ll have the ability to translate these particulars by choosing them utilizing the drop-down within the translation editor.

For instance, if you happen to’ve already set your web optimization particulars utilizing Yoast web optimization, you’ll see these particulars seem within the editor and then you definately’ll have the ability to translate them identical to different content material:

You may also use the identical method to translate the URL slug for particular person merchandise (and different items of content material, equivalent to weblog posts).

For sitewide URL slugs, equivalent to your product class base slugs, you’ll be able to open the String Translation interface:

The best way to Translate WooCommerce Emails

To finish the interpretation of a WooCommerce retailer, it’s worthwhile to translate your emails. 

When you go to WooCommerce → Settings → E mail, yow will discover emails arrange in your retailer which incorporates:  

• Admin emails for managing orders (e.g. new order discover, failed order, or cancel order discover) and 
• Emails triggered by the shopper’s motion (e.g. refund order discover, full order, new account discover, and so on)

You’ll be able to translate each forms of e-mail utilizing TranslatePress’ automated translation or use the guide methodology to translate from scratch or to enhance automated translations. 

Translating WooCommerce emails is barely totally different from translating another ingredient of your retailer. It entails pulling up e-mail strings after which translating them into the editor.

After translation, TranslatePress makes use of the language logged-in prospects final browsed your web site to ship the emails. For shops that don’t want prospects to log in to make purchases, emails are despatched within the language chosen on the checkout web page to determine consumer language preferences.

4. Configure Your WooCommerce Language Switcher

At this level, you might have a working multilingual WooCommerce retailer.

Nonetheless, to make it straightforward for consumers to decide on their most well-liked languages, you’ll wish to arrange your retailer’s frontend language switcher.

By default, TranslatePress provides a floating language switcher within the bottom-right nook of your retailer. Nonetheless, it’s also possible to change the placement of the floating language switcher or use a totally totally different placement possibility.

Listed here are your choices for putting your retailer’s language switcher:

• Floating language switcher – show it on your entire pages, in any nook of your retailer.
• Menu merchandise – add your language switcher as a menu merchandise to any menu in your web site by going to Look → Menus.
• Shortcode – manually place your language switcher wherever in your web site utilizing a shortcode.

You additionally get settings to manage the content material and habits of your language switcher. For instance:

• Language names – select whether or not to show the complete language identify or simply the two-letter ISO code.
• Nation flags – select whether or not or to not present nation flags. When you allow flags, TranslatePress will present the flag for the precise locale you chose. So if you happen to selected Spanish (Spain), it would present the Spanish flag. However if you happen to selected Spanish (Mexico), it might present the Mexican flag.

To configure these settings, go to Settings → TranslatePress and scroll right down to the Language Switcher settings:

Let’s have a look at various placements to the default floating language switcher.

So as to add your WooCommerce language switcher as a menu merchandise, go to Look → Menus to entry the conventional WordPress menu editor and open the menu you wish to edit.

Then, you need to use the Language Switcher settings to configure your language switcher.

You may have two predominant choices right here…

First, if you happen to solely use two languages in your web site, you’ll be able to simply add the Reverse Language merchandise as a top-level menu merchandise. With this menu merchandise, your retailer will show an possibility for folks to change to the opposite language that you simply supply:

Let’s say your retailer is offered in each English and Spanish. If a consumer was shopping in English, they might see the choice for Spanish in your menu. But when they’re shopping in Spanish, they might see the choice for English:

The opposite possibility is to make use of the Present Language menu merchandise. This can show the language that the patron is at the moment shopping in. You’ll be able to then add the precise languages as sub-menu objects of the Present Language menu merchandise like this:

With this setup, consumers will see their at the moment chosen language because the top-level menu merchandise. They’ll then hover their cursor to show a drop-down with all of the out there languages. TranslatePress will conceal the drop-down for the consumer’s at the moment chosen language, although, to keep away from duplication:

That is most likely the most effective method in your retailer if you happen to supply greater than two languages.

The best way to Add Your WooCommerce Language Switcher as a Shortcode or Block

If you would like much more management over the position of your language switcher, you’ll be able to add it manually wherever in your retailer utilizing the next shortcode:

[language-switcher]

You’ll be able to place this shortcode in widgets, blocks, content material you create with the editor, and so forth.

You may also use the WordPress do_shortcode() function to put the language switcher immediately in your theme’s template recordsdata.

One other technique to go about it’s by utilizing the devoted Language Switcher block within the block editor.

Create a Multilingual WooCommerce Retailer At the moment

Translating your WooCommerce retailer is an effective way to supply a greater purchasing expertise in your current prospects and attain new prospects due to multilingual web optimization and different new advertising and marketing alternatives.

Whereas WooCommerce doesn’t help multilingual performance within the core plugin, you’ll be able to simply create a multilingual retailer utilizing the TranslatePress plugin.

Utilizing TranslatePress’s visible editor, you’ll have the ability to absolutely translate your retailer together with your single product pages, store pages, cart web page, checkout web page, web optimization metadata, and non-WooCommerce content material.

You’ll be able to add a frontend language switcher so consumers can select their most well-liked languages whereas shopping your retailer.

On this submit, you’ve realized learn how to translate WooCommerce and create your multilingual retailer step-by-step.

When you’re prepared to begin, install the free TranslatePress plugin today to see the way it works.

And if you happen to’re nonetheless within the planning phases of your retailer, take a look at the best WooCommerce themes and a few other great WooCommerce plugins to set your retailer up for fulfillment.

Do you continue to have any questions on WooCommerce translation? Tell us within the feedback!