Changing the WooCommerce Delivery Slots Checkout Labels

I wanted to talk about a commonly asked question regarding WooCommerce Delivery Slots. How do I change the fields labels used on the checkout page?

Fortunately, it’s pretty straightforward!

In order to keep things translatable, the field labels are passed through a translate function. This means you can either:

  • Add your own translation using a string translation tool (like Loco Translate)
  • Translate using the .po file (using Poedit or similar)
  • Use a gettext filter

Using Poedit to Translate the .po File

One method of creating a translation, is to create your own .po and .mo files. Delivery Slots comes with some pre-made .po and .mo files in the languages folder of the plugin. Within that folder, there is also a .pot file.

Once you’ve downloaded Poedit, open up the .pot file, create your translation, and save the file to the following location in the following format: /wp-content/languages/plugins/jckwds-{locale}.po|mo

{locale} should be entered in the following format: en_GB (for example). The .po and .mo files share the same filename.

Using a “gettext” Filter to Change Translatable Strings

If you wanted to change the labels to indicate a collection time, instead of a delivery date, you could add the following code to your theme’s functions.php file:

Let’s take a look at that last line. Whenever gettext is applied to a string of text, we’re passing that string through our own iconic_change_delivery_slots_labels function.

Take a look at the function we added. Any function we run on the gettext filter accepts three parameters; $translated_text, $text, and $domain. When using a function on a filter like this, the first parameter is the item that is usually returned.

Firstly, we’re checking if we’re currently viewing the checkout, and if not, we’re exiting our function. It’s important to add checks like this, as a gettext filter can be quite heavy on resources.

Once we’re sure we’re on the checkout, we’re using a switch statement to check the current string. Each case statement indicates the text string that we’re expecting. If $translated_text is equal to any of our cases, we change it to a different string within a new text domain, theme_text_domain. This text domain should reflect the one you use throughout your theme. If your theme is multilingual, it means you’ll be able to translate the string into another language.

After the switch statement, we return our new labels. If a condition wasn’t met in the switch statement, it’ll just return the original string.

Leave a Reply

Your email address will not be published. Required fields are marked *