{"id":12551,"date":"2020-10-09T09:00:26","date_gmt":"2020-10-09T07:00:26","guid":{"rendered":"https:\/\/phrase.com\/blog\/?p=12551"},"modified":"2024-02-21T10:35:42","modified_gmt":"2024-02-21T09:35:42","slug":"phrase-wordpress-translation-plugin","status":"publish","type":"post","link":"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/","title":{"rendered":"How to Use Phrase Strings\u2019 Localization Plugin for WordPress"},"content":{"rendered":"<p>WordPress is absolutely massive: <a href=\"https:\/\/w3techs.com\/technologies\/overview\/content_management\">Over 43% of all websites<\/a> are based on the free content management system (CMS), and over 60% of CMS-based websites have chosen WordPress. Its architecture, ease of use, and massive ecosystem of themes and plugins are all contributors to this great success.<\/p>\n<p>When it comes to making your WordPress site multilingual, if you want a professional workflow that works for your whole team of developers and translators, you\u2019ll do well to localize your site with the <a href=\"https:\/\/phrase.com\/integrations\/wordpress-translation-plugin\/\">WordPress localization plugin<\/a> for Phrase Strings.<\/p>\n<p>In this tutorial, we\u2019ll build a little demo site to show you how easy it is to spin up a Phrase project, connect it to WordPress, and get to localizing your pages and posts in minutes. We\u2019ll also use the popular <a href=\"https:\/\/wordpress.org\/plugins\/polylang\/\">Polylang<\/a> plugin to add a language switcher to our site. Let\u2019s get cooking.<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_69_1 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Overview<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#wordpress-environment-versions\" title=\"WordPress environment versions\">WordPress environment versions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#our-demo-site-aznomia\" title=\"Our demo site: Aznomia\">Our demo site: Aznomia<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#adding-posts\" title=\"Adding posts\">Adding posts<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#adding-pages\" title=\"Adding pages\">Adding pages<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#setting-our-home-page\" title=\"Setting our home page\">Setting our home page<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#adding-our-posts-to-our-home-page\" title=\"Adding our posts to our home page\">Adding our posts to our home page<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#localizing-our-wordpress-site-with-phrase-strings\" title=\"Localizing our WordPress site with Phrase Strings\">Localizing our WordPress site with Phrase Strings<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#adding-the-phrase-strings-project\" title=\"Adding the Phrase Strings project\">Adding the Phrase Strings project<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#creating-an-access-token\" title=\"Creating an access token\">Creating an access token<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#installing-phrase-strings-localization-plugin-for-wordpress\" title=\"Installing Phrase Strings&#8217; localization plugin for WordPress\">Installing Phrase Strings&#8217; localization plugin for WordPress<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#localizing-pages\" title=\"Localizing pages\">Localizing pages<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#localizing-posts\" title=\"Localizing posts\">Localizing posts<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#adding-polylang\" title=\"Adding Polylang\">Adding Polylang<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#adding-our-translations-to-polylang\" title=\"Adding our translations to Polylang\">Adding our translations to Polylang<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#adding-a-language-switcher-with-polylang\" title=\"Adding a language switcher with Polylang\">Adding a language switcher with Polylang<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#keep-exploring\" title=\"Keep exploring\">Keep exploring<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/phrase.com\/blog\/posts\/phrase-wordpress-translation-plugin\/#the-power-of-phrase-strings-right-in-wordpress\" title=\"The power of Phrase Strings right in WordPress\">The power of Phrase Strings right in WordPress<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"wordpress-environment-versions\"><\/span>WordPress environment versions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>We\u2019re using the following stack and set of plugins to build our demo site (versions between parentheses):<\/p>\n<ul>\n<li>PHP (7.4)\u2014server-side language\/processor<\/li>\n<li>MySQL (8.0)\u2014database<\/li>\n<li>WordPress (5.5)\u2014our CMS of choice<\/li>\n<li>Phrase Strings (1.0)\u2014easily links our WordPress site with Phrase<\/li>\n<li>Polylang (2.8)\u2014handles URL, menu, and category localization<\/li>\n<li>Fasciate Theme (1.0) [Optional]\u2014makes it look all saucy and sweet<\/li>\n<\/ul>\n<p>\u270b\ud83c\udffd <em>Heads up \u00bb<\/em> You will need WordPress 5.5 or higher, with the Gutenberg block editor, to use the Phrase Strings localization plugin for WordPress.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"our-demo-site-aznomia\"><\/span>Our demo site: Aznomia<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><em>Aznomia<\/em> is a fictional non-profit showcasing the flora and fauna of the under-threat Amazon rainforest. Here\u2019s what <em>Aznomia\u2019s<\/em> website will look like when we\u2019re done with it:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12557 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home.png\" alt=\"Our finished demo app | Phrase\" width=\"1066\" height=\"1668\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home.png 1066w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home-192x300.png 192w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home-654x1024.png 654w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home-768x1202.png 768w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home-982x1536.png 982w\" sizes=\"(max-width: 1066px) 100vw, 1066px\" \/><\/p>\n<p style=\"text-align: center;\"><em>Over 40,000 plant species live in the Amazon\u00a0<\/em><\/p>\n<p>I\u2019ll assume that you know how to install WordPress for development. I personally like to use the simple, managed local dev environment <a href=\"https:\/\/localwp.com\/\">Local<\/a> for my WordPress dev sites.<\/p>\n<p>\ud83d\udd17 <em>Resource \u00bb<\/em> If you want to build along with us, <a href=\"https:\/\/themebeez.com\/themes\/fascinate\/\">grab the free Fascinate WordPress theme by themebeez<\/a>, and install it.<\/p>\n<p>With WordPress installed, we can begin adding our content.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"adding-posts\"><\/span>Adding posts<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>For each species of flora or fauna, we\u2019ll add a post that has a title, a block in its body, and a featured image.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12555 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-add-post.png\" alt=\"Adding a WordPress post | Phrase\" width=\"960\" height=\"983\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-add-post.png 960w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-add-post-293x300.png 293w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-add-post-768x786.png 768w\" sizes=\"(max-width: 960px) 100vw, 960px\" \/><\/p>\n<p style=\"text-align: center;\"><em>Content and images from Wikipedia<\/em><\/p>\n<h3><span class=\"ez-toc-section\" id=\"adding-pages\"><\/span>Adding pages<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Let\u2019s add a home page for our site. To start, we can add a page titled <em>Home<\/em> with a bit of lead text.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12559 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-adding-home-page.png\" alt=\"Adding a homepage to WordPress | Phrase\" width=\"1056\" height=\"983\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-adding-home-page.png 1056w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-adding-home-page-300x279.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-adding-home-page-1024x953.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-adding-home-page-768x715.png 768w\" sizes=\"(max-width: 1056px) 100vw, 1056px\" \/><\/p>\n<p style=\"text-align: center;\"><em>Pretty plain at the moment: we\u2019ll add more to our home page soon<\/em><\/p>\n<h3><span class=\"ez-toc-section\" id=\"setting-our-home-page\"><\/span>Setting our home page<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>By default, WordPress will use the theme\u2019s index page, which lists recent posts, as its homepage. We can change that under <em>Settings \u2192 Reading<\/em> so that our home page is used instead.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12561 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/setting-home-page.png\" alt=\"Setting our homepage in WordPress | Phrase\" width=\"1056\" height=\"702\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/setting-home-page.png 1056w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/setting-home-page-300x199.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/setting-home-page-1024x681.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/setting-home-page-768x511.png 768w\" sizes=\"(max-width: 1056px) 100vw, 1056px\" \/><\/p>\n<p style=\"text-align: center;\"><em>We want to show our home page when our visitor first enters<\/em><\/p>\n<h3><span class=\"ez-toc-section\" id=\"adding-our-posts-to-our-home-page\"><\/span>Adding our posts to our home page<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Let\u2019s entice our visitors to explore our content once she\u2019s hit the home page. We\u2019ll add a few links to our flora posts, and a few more to our fauna posts.<br \/>\nLet\u2019s go to <em>Pages \u2192 All Pages \u2192 Home \u2192 Edit<\/em>, and add a new columns block to our home page to house our post images and links.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12562 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-home-add-columns.png\" alt=\"Adding our posts to our homepage in WordPress | Phrase\" width=\"1170\" height=\"751\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-home-add-columns.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-home-add-columns-300x193.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-home-add-columns-1024x657.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-home-add-columns-768x493.png 768w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><br \/>\nWe\u2019ll select the 33\/33\/33 layout to add three columns side-by-side. In each column, we\u2019ll click the \uff0bto add a block within the column and select the image column. Under each image, we can add some text linked to the respective post.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12565 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-home-adding-post-link.png\" alt=\"Writing a title for our post in WordPress | Phrase\" width=\"1170\" height=\"799\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-home-adding-post-link.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-home-adding-post-link-300x205.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-home-adding-post-link-1024x699.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-home-adding-post-link-768x524.png 768w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><\/p>\n<p style=\"text-align: center;\"><em>We can start typing the title of a post to get an auto-suggested link<\/em><\/p>\n<p>With columns added under <em>Flora<\/em> and <em>Fauna<\/em>, our home page will now look like this:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12566 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-hm-w-flora-and-fauna.png\" alt=\"Our set up homepage | Phrase\" width=\"913\" height=\"989\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-hm-w-flora-and-fauna.png 913w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-hm-w-flora-and-fauna-277x300.png 277w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-hm-w-flora-and-fauna-768x832.png 768w\" sizes=\"(max-width: 913px) 100vw, 913px\" \/><\/p>\n<p style=\"text-align: center;\"><em>A bit more visually interesting, no?<\/em><\/p>\n<p>And that\u2019s about it for our demo app. Let\u2019s get to localizing it using Phrase Strings.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"localizing-our-wordpress-site-with-phrase-strings\"><\/span>Localizing our WordPress site with Phrase Strings<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>First, let\u2019s create a new Phrase project. We\u2019ll log in\u00a0and, in our main spaces area, click the <em>Create New Project<\/em> button.<\/p>\n<p>\ud83d\uddd2 <em>Note \u00bb<\/em> If you don\u2019t have a Phrase pro subscription, sign up for a <a href=\"https:\/\/eu.phrase.com\/idm-ui\/signup?uiLang=en-US\">free 14-day trial<\/a>.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"adding-the-phrase-strings-project\"><\/span>Adding the Phrase Strings project<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12567 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-create-project-btn.png\" alt=\"Creating a new project in Phrase | Phrase\" width=\"1210\" height=\"411\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-create-project-btn.png 1210w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-create-project-btn-300x102.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-create-project-btn-1024x348.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-create-project-btn-768x261.png 768w\" sizes=\"(max-width: 1210px) 100vw, 1210px\" \/><\/p>\n<p style=\"text-align: center;\"><em>This pops up the Add Project dialog<\/em><\/p>\n<p>In the <em>Add Project<\/em> dialog, we can give our project a name, leave the rest of the fields in the their default state, and click the <em>Save<\/em> button.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12568 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-create-project-form.png\" alt=\"Add project dialog | Phrase\" width=\"1234\" height=\"1236\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-create-project-form.png 1234w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-create-project-form-300x300.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-create-project-form-1022x1024.png 1022w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-create-project-form-150x150.png 150w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-create-project-form-768x769.png 768w\" sizes=\"(max-width: 1234px) 100vw, 1234px\" \/><\/p>\n<p style=\"text-align: center;\"><em>We just need to give our project a name<\/em><\/p>\n<p>Our new project will now appear in our project grid. Let\u2019s hover over its card and click the <em>Languages<\/em> button to add the languages our site will support.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12569 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-languages-button.png\" alt=\"Adding a new language to our project | Phrase\" width=\"1170\" height=\"590\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-languages-button.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-languages-button-300x151.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-languages-button-1024x516.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-languages-button-768x387.png 768w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12571 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-add-languages.png\" alt=\"Set up languages dialog menu | Phrase\" width=\"1170\" height=\"1053\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-add-languages.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-add-languages-300x270.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-add-languages-1024x922.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-add-languages-768x691.png 768w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><br \/>\nI\u2019ll add US English and French Canadian here. You can add any languages your heart desires. Note that the first language we add becomes our source language for translations. Once we\u2019re done, we can click <em>Create Languages<\/em>.<br \/>\nAfter that, we can click the <em>Skip Setup<\/em> button.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12572 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-skip-setup-key.png\" alt=\"Skipping the project setup in Phrase | Phrase\" width=\"1183\" height=\"301\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-skip-setup-key.png 1183w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-skip-setup-key-300x76.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-skip-setup-key-1024x261.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-skip-setup-key-768x195.png 768w\" sizes=\"(max-width: 1183px) 100vw, 1183px\" \/><\/p>\n<p style=\"text-align: center;\"><em>\u00a0We don\u2019t need the other setup options for our project<\/em><\/p>\n<h3><span class=\"ez-toc-section\" id=\"creating-an-access-token\"><\/span>Creating an access token<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>We\u2019ll need an access token to connect our Phrase project to the Phrase Strings localization plugin for WordPress in a minute. Let\u2019s create an access token while we\u2019re in the Phrase console. We can do that by clicking on our name near the top-right of the screen to open a dropdown, then clicking <em>Access Tokens<\/em>.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12574 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-name-dropdown-1.png\" alt=\"Dropdown menu access token menu point in Phrase | Phrase\" width=\"698\" height=\"463\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-name-dropdown-1.png 698w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-name-dropdown-1-300x199.png 300w\" sizes=\"(max-width: 698px) 100vw, 698px\" \/><\/p>\n<p style=\"text-align: left;\">Next, let\u2019s click the <em>Generate Token<\/em> button.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12575 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-generate-token-btn.png\" alt=\"Generate a Token button in Phrase | Phrase\" width=\"1170\" height=\"311\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-generate-token-btn.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-generate-token-btn-300x80.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-generate-token-btn-1024x272.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-generate-token-btn-768x204.png 768w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12576 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-generate-token-form.png\" alt=\"Generate a token dialog menu in Phrase | Phrase\" width=\"1240\" height=\"766\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-generate-token-form.png 1240w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-generate-token-form-300x185.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-generate-token-form-1024x633.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-generate-token-form-768x474.png 768w\" sizes=\"(max-width: 1240px) 100vw, 1240px\" \/><br \/>\nWe\u2019ll give our token a name, leave the <em>Scopes<\/em> field as it is, and click <em>Save<\/em>. This should add a new row to the top of our access tokens list. Notice that the new token is partially revealed and there\u2019s a <em>Copy<\/em> button next to it.<\/p>\n<p>\u270b\ud83c\udffd<em>Heads up \u00bb<\/em> You won\u2019t be able to access your token later. You need to copy it as soon as you generate it.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12577 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-copy-token.png\" alt=\"Copying the user based access token for our translation project | Phrase \" width=\"1514\" height=\"440\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-copy-token.png 1514w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-copy-token-300x87.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-copy-token-1024x298.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-copy-token-768x223.png 768w\" sizes=\"(max-width: 1514px) 100vw, 1514px\" \/><br \/>\nWe\u2019ll click the <em>Copy<\/em> button and paste our token somewhere safe.<br \/>\nThat\u2019s it for the Phrase setup. We can now get back to WordPress.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"installing-phrase-strings-localization-plugin-for-wordpress\"><\/span>Installing Phrase Strings&#8217; localization plugin for WordPress<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>We can download the plugin from the <a href=\"https:\/\/wordpress.org\/plugins\/phrase\/\">WordPress plugin directory<\/a>. Once we\u2019ve got the ZIP file, we can open our WordPress admin and go to <em>Plugins \u2192 Add New \u2192 Upload Plugin<\/em>.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12578 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/plugins-upload-btn.png\" alt=\"Adding the Phrase plugin to WordPress | Phrase\" width=\"1013\" height=\"593\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/plugins-upload-btn.png 1013w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/plugins-upload-btn-300x176.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/plugins-upload-btn-768x450.png 768w\" sizes=\"(max-width: 1013px) 100vw, 1013px\" \/><br \/>\nWe can then click <em>Browse<\/em>, select the ZIP file we downloaded earlier, and click <em>Open<\/em> to upload and install the translation plugin. Once that\u2019s done we need to make sure to click the <em>Activate Plugin<\/em> button.<br \/>\nWith that done, we\u2019ll have a new <em>Phrase<\/em> menu item in our admin sidebar. Clicking that opens the <em>API Access Token<\/em> form. We can now paste the access token we generated earlier and click <em>Save Settings<\/em>.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12579 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-settings.png\" alt=\"Entering our API access token into the Phrase plugin in WordPress | Phrase \" width=\"1013\" height=\"534\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-settings.png 1013w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-settings-300x158.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-settings-768x405.png 768w\" sizes=\"(max-width: 1013px) 100vw, 1013px\" \/><br \/>\nWe&#8217;re all set to start localizing.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"localizing-pages\"><\/span>Localizing pages<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Let\u2019s start localizing our home page. We can go to <em>Pages \u2192 All Pages \u2192 Home \u2192 Edit<\/em>. There we\u2019ll find a new Phrase icon button. Once we click that button, we\u2019ll see the Phrase String plugin sidebar appear.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12581 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-selecting-project-2.png\" alt=\"The Phrase plugin sidebar | Phrase\" width=\"1170\" height=\"490\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-selecting-project-2.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-selecting-project-2-300x126.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-selecting-project-2-1024x429.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-selecting-project-2-768x322.png 768w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><br \/>\nUnder <em>Select the project<\/em>, we can open the dropdown and pick the Phrase project we created earlier. We can then select the page\u2019s language under <em>My post is written in<\/em> and click <em>Push content<\/em>. This will upload our content for translation to our Phrase project.<br \/>\nNow let\u2019s open our Phrase console and go to <em>Projects \u2192 aznomia-wordpress \u2192 Languages<\/em>. Notice that we see our source US English content is complete, and that we have untranslated French Canadian content.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12582 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-languages-page-2.png\" alt=\"Checking our translation status in Phrase | Phrase\" width=\"1201\" height=\"431\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-languages-page-2.png 1201w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-languages-page-2-300x108.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-languages-page-2-1024x367.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-languages-page-2-768x276.png 768w\" sizes=\"(max-width: 1201px) 100vw, 1201px\" \/><br \/>\nLet\u2019s click on <em>fr-CA<\/em> to open the translation editor. Our translations are listed in the left sidebar. We can select one and begin translating it in the editor. You might want to keep the\u00a0<em>Autocomplete<\/em> checkbox ticked since it can save you time by suggesting translated words as you type.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12583 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-translating-smart-suggest-2.png\" alt=\"Translating our WordPress content with Smart Suggest in Phrase | Phrase\" width=\"1201\" height=\"992\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-translating-smart-suggest-2.png 1201w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-translating-smart-suggest-2-300x248.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-translating-smart-suggest-2-1024x846.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-translating-smart-suggest-2-768x634.png 768w\" sizes=\"(max-width: 1201px) 100vw, 1201px\" \/><\/p>\n<p style=\"text-align: center;\"><em>Autocomplete is a time saver for translators<\/em><\/p>\n<p>Notice that our page\u2019s title is its own translation item. So is each block in our page\u2019s body. We can translate each one and click <em>Save<\/em>.<\/p>\n<p>\ud83d\uddd2 <em>Note \u00bb<\/em> Keep HTML tags in the same locations in your translations as they are in the source text.<\/p>\n<p>Once we\u2019re done translating, we can go back to the WordPress admin and edit the home page again. Now we can <em>Select All<\/em> translations and click the <em>Pull translations<\/em> button to create a new, translated home page.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12584 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-translations-pulled-success-2.png\" alt=\"Pull translations button to create a new, translated home page | Phrase\" width=\"2046\" height=\"927\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-translations-pulled-success-2.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-translations-pulled-success-2-300x136.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-translations-pulled-success-2-1024x464.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/phrase-translations-pulled-success-2-768x348.png 768w\" sizes=\"(max-width: 2046px) 100vw, 2046px\" \/><\/p>\n<p>\ud83d\uddd2 <em>Note \u00bb<\/em> Phrase will not sync translated WordPress slugs. Just ignore those in the translation editor.<\/p>\n<p>Once the translations have been pulled, we\u2019ll get a message reading \u201cPulled translations successfully.\u201d We\u2019ll also see a chevron next to our translation that links to the newly created translation page.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12585 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-home-page-2.png\" alt=\"Our newly created translation page | Phrase\" width=\"1170\" height=\"1079\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-home-page-2.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-home-page-2-300x277.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-home-page-2-1024x944.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-home-page-2-768x708.png 768w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><br \/>\nWe now chose to publish the translated home page.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12586 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-home-page-preview-2.png\" alt=\"Our translation page published | Phrase\" width=\"1052\" height=\"1212\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-home-page-preview-2.png 1052w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-home-page-preview-2-260x300.png 260w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-home-page-preview-2-889x1024.png 889w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-home-page-preview-2-768x885.png 768w\" sizes=\"(max-width: 1052px) 100vw, 1052px\" \/><\/p>\n<p>\ud83d\uddd2 <em>Note \u00bb<\/em> Notice that we left our post links untranslated. That&#8217;s because, at the time of writing, Phrase isn&#8217;t syncing these blocks. I&#8217;m working with an early version of the Phrase plugin, and the Phrase team is working on fixing and updating the plugin. By the time you read this, this issue should be resolved.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"localizing-posts\"><\/span>Localizing posts<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Localizing posts is a lot like localizing pages, so we\u2019ll leave that as an exercise for you.<\/p>\n<p>\ud83d\udd17 <em>Resource \u00bb<\/em> If you want a step-by-step guide to localizing posts with Phrase Strings&#8217;s localization plugin for WordPress, <a href=\"https:\/\/support.phrase.com\/hc\/en-us\/articles\/5784120649756-WordPress-Strings\">check out the official help documentation<\/a>.<\/p>\n<p>\ud83d\uddd2 <em>Note \u00bb<\/em> At the time of writing, the Phrase Strings plugin for WordPress only localized pages and posts. Support for localizing categories, tags, etc. is in the works and will be released in the future.<\/p>\n<p>Once all our posts are translated and pulled in our posts listing page should look something like this.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12587 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-posts-index.png\" alt=\"Our post listing | Phrase\" width=\"900\" height=\"1083\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-posts-index.png 900w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-posts-index-249x300.png 249w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-posts-index-851x1024.png 851w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/translated-posts-index-768x924.png 768w\" sizes=\"(max-width: 900px) 100vw, 900px\" \/><\/p>\n<p style=\"text-align: center;\"><em>A translated French post has been added for each English source post<\/em><\/p>\n<h2><span class=\"ez-toc-section\" id=\"adding-polylang\"><\/span>Adding Polylang<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>We probably want to add a language switcher to our site. We can do that with the free Polylang plugin. We\u2019ll head to <em>Plugins \u2192 Add New<\/em> and search for <em>Polylang<\/em> using the plugin search box.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12588 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/search-for-polylang.png\" alt=\"Installing Polylang | Phrase\" width=\"1170\" height=\"894\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/search-for-polylang.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/search-for-polylang-300x229.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/search-for-polylang-1024x782.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/search-for-polylang-768x587.png 768w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><\/p>\n<p style=\"text-align: center;\"><em>It\u2019s the one with the parrot image\u2026sassy<\/em><\/p>\n<p>With the plugin installed and activated, we\u2019ll be invited to run its setup wizard. Let\u2019s click the button to do so.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12589 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/polylang-add-languages.png\" alt=\"Polylang setup wizard | Phrase\" width=\"758\" height=\"710\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/polylang-add-languages.png 758w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/polylang-add-languages-300x281.png 300w\" sizes=\"(max-width: 758px) 100vw, 758px\" \/><\/p>\n<p style=\"text-align: center;\"><em>Polylang&#8217;s Languages screen<\/em><\/p>\n<p>We can pick the same languages to add to Polylang as we have in our Phrase project. We\u2019re using US English and French Canadian in our demo site, so we\u2019ll add those here.<br \/>\nThe next option in the wizard regarding translating media is a matter of preference. I\u2019ve chosen not to translate media here.<br \/>\nNext in line is the language to assign content that Polylang has not assigned content to. Our source language is a good candidate here. We can manually set our translated posts and pages after we complete the wizard.<br \/>\nWe probably want to skip the step regarding translating the home page.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12590 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/polylang-wizard-translate-home-page.png\" alt=\"Skipping the homepage translation step in the Polylang translation setup | Phrase\" width=\"787\" height=\"760\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/polylang-wizard-translate-home-page.png 787w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/polylang-wizard-translate-home-page-300x290.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/polylang-wizard-translate-home-page-768x742.png 768w\" sizes=\"(max-width: 787px) 100vw, 787px\" \/><br \/>\nWe already have a translated home page that we can manually set up later. So we can click <em>Not right now<\/em> to move on.<br \/>\nThat\u2019s it for the Polylang wizard. Let\u2019s finish our setup manually.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"adding-our-translations-to-polylang\"><\/span>Adding our translations to Polylang<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Let\u2019s start with our home page. We can navigate to <em>Pages \u2192 All Pages<\/em> to see the page index. We can click the <em>Quick Edit<\/em> button next to the French home page translation that we can create with Phrase. This will open up the quick edit controls for the page.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12604 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/quick-edit.png\" alt=\"Quick edit controls for our French translation | Phrase\" width=\"1170\" height=\"592\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/quick-edit.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/quick-edit-300x152.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/quick-edit-1024x518.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/quick-edit-768x389.png 768w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><br \/>\nLet\u2019s make sure our page\u2019s translation <em>Status<\/em> is <em>Published<\/em> and that its <em>Language<\/em> is <em> Fran\u00e7ais<\/em>. The language we\u2019re setting here is Polylang\u2019s.<br \/>\nNext, let\u2019s open the French translation by clicking its <em>Edit<\/em> button. Then, we\u2019ll click the gear icon near the top-right of the window to open <em>Document<\/em> settings. From there, in Polylang\u2019s <em>Language<\/em> section, we can start typing the title of the English \u201cHome\u201d page. We should get an autocomplete dropdown that we can click on to set the English home page as the source of this page in Polylang.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12592 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/setting-home-page-in-french-translation.png\" alt=\"Setting the English home page as the source of this page in Polylang | Phrase\" width=\"572\" height=\"366\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/setting-home-page-in-french-translation.png 572w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/setting-home-page-in-french-translation-300x192.png 300w\" sizes=\"(max-width: 572px) 100vw, 572px\" \/><br \/>\nWe\u2019ll make sure to click the <em>Update <\/em>button when we&#8217;re done. By doing that, we\u2019ve just set our French home page as the front page in Polylang and WordPress.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12594 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/page-index-after-fr-home-page.png\" alt=\"Our English and French home pages are now linked in Polylang | Phrase\" width=\"1170\" height=\"254\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/page-index-after-fr-home-page.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/page-index-after-fr-home-page-300x65.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/page-index-after-fr-home-page-1024x222.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/page-index-after-fr-home-page-768x167.png 768w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><\/p>\n<p style=\"text-align: center;\"><em>Our English and French home pages are now linked in Polylang<\/em><\/p>\n<p>We can link up our posts in Polylang as well. We\u2019ll leave that as an exercise for you since it\u2019s the exact same process as linking up our home page.<br \/>\nWith that done, Polylang has internally linked our English content with its French counterpart. Each page or post has a localized URL as well. Our French home page, for example, is at <code>\/fr\/accueil\/<\/code>.<\/p>\n<p>\ud83d\uddd2 <em>Note \u00bb<\/em> By default, source content (English in our case), won\u2019t have a language code in its URL. We can change this in Polylang\u2019s settings, however, under <em>Languages \u2192 Settings \u2192 URL Modifications \u2192 Settings<\/em>.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"adding-a-language-switcher-with-polylang\"><\/span>Adding a language switcher with Polylang<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>With all this linked content, it\u2019s a shame that our visitors can\u2019t manually switch between translations to read in their preferred languages. Luckily, Polylang comes with a handy language selector widget that we can stick into any of our theme\u2019s widget areas.<br \/>\nLet\u2019s head over to <em>Appearance \u2192 Widgets<\/em>, find the <em>Language Switcher<\/em> widget area settings, and set it to the <em>Footer Middle<\/em> widget area in our theme.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12595 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-widget-area.png\" alt=\"Adding a Language Switcher with Polylang | Phrase\" width=\"464\" height=\"576\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-widget-area.png 464w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-widget-area-242x300.png 242w\" sizes=\"(max-width: 464px) 100vw, 464px\" \/><br \/>\nThis will make the language switcher settings appear under the <em>Footer Middle<\/em> section near the right side of the window.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12596 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-widget-in-area-settings.png\" alt=\"Language switcher settings in the Footer Middle section | Phrase\" width=\"932\" height=\"764\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-widget-in-area-settings.png 932w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-widget-in-area-settings-300x246.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-widget-in-area-settings-768x630.png 768w\" sizes=\"(max-width: 932px) 100vw, 932px\" \/><br \/>\nThe widget settings are a matter of preference. I\u2019ll set mine to have a title of <em>Language<\/em> and display it as a dropdown. Once we <em>Save<\/em>, we can see our language switcher near the bottom of every page on our front-facing site.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12597 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-front-facing.png\" alt=\"Language switcher drop down at the end of our homepage | Phrase\" width=\"1170\" height=\"1049\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-front-facing.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-front-facing-300x269.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-front-facing-1024x918.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/lang-switcher-front-facing-768x689.png 768w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><\/p>\n<p>With that, our <em>Aznomia<\/em> is available in both English and French.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12598 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home-1.png\" alt=\"Finished WordPress demo site | Phrase\" width=\"1066\" height=\"1668\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home-1.png 1066w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home-1-192x300.png 192w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home-1-654x1024.png 654w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home-1-768x1202.png 768w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/en-final-home-1-982x1536.png 982w\" sizes=\"(max-width: 1066px) 100vw, 1066px\" \/><br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-12599 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/fr-final-home.png\" alt=\"Finished WordPress demo site translated into French | Phrase\" width=\"1170\" height=\"1634\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/fr-final-home.png 1170w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/fr-final-home-215x300.png 215w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/fr-final-home-733x1024.png 733w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/fr-final-home-768x1073.png 768w, https:\/\/phrase.com\/wp-content\/uploads\/2020\/10\/fr-final-home-1100x1536.png 1100w\" sizes=\"(max-width: 1170px) 100vw, 1170px\" \/><\/p>\n<p>\ud83d\uddd2 <em>Note \u00bb<\/em> My apologies if the French translations are off. I\u2019ve been using third-party translation tools to prepare them.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"keep-exploring\"><\/span>Keep exploring<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>If you\u2019re interested in going deeper into WordPress localization, check out our series:<\/p>\n<ul>\n<li><a href=\"https:\/\/phrase.com\/blog\/posts\/creating-a-wordpress-multilingual-site-part-1\/\">Creating a WordPress Multilingual Site \u2013 Part 1: Content &amp; Polylang<\/a><\/li>\n<li><a href=\"https:\/\/phrase.com\/blog\/posts\/creating-a-wordpress-multilingual-site-part-2-beginning-custom-theme-localization-with-gettext\/\">Creating a WordPress Multilingual Site \u2013 Part 2: Beginning Custom Theme Localization with gettext<\/a><\/li>\n<li><a href=\"https:\/\/phrase.com\/blog\/posts\/creating-a-wordpress-multilingual-site-part-3-best-recipes-for-custom-theme-localization\/\">Creating a WordPress Multilingual Site \u2013 Part 3: Best Recipes for Custom Theme Localization<\/a><\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"the-power-of-phrase-strings-right-in-wordpress\"><\/span>The power of Phrase Strings right in WordPress<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Not only are we able to create, update, and sync our Phrase translations right within WordPress, but we also have all the advanced features that Phrase Strings provide us. That means our managers can set jobs for our translators from within Phrase. We can also automate translations, using machine learning to translate for us. And when we do need our translators, they can use the convenient Translation Editor in Phrase. All we have to do as WordPress developers is push our source content and pull the latest translations.<\/p>\n<p>Check out all <span style=\"font-weight: 400;\">Phrase&#8217;s <a href=\"https:\/\/phrase.com\/platform\/\">translation products<\/a><\/span>, and sign up for a free 14-day trial today!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Learn how to translate WordPress pages, posts, and more into multiple languages with Phrase Strings&#8217; integration for WordPress.<\/p>\n","protected":false},"author":41,"featured_media":2612,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_stopmodifiedupdate":false,"_modified_date":"","_searchwp_excluded":"","footnotes":""},"categories":[40],"class_list":["post-12551","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-software-localization"],"acf":[],"_links":{"self":[{"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/posts\/12551"}],"collection":[{"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/users\/41"}],"replies":[{"embeddable":true,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/comments?post=12551"}],"version-history":[{"count":14,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/posts\/12551\/revisions"}],"predecessor-version":[{"id":75492,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/posts\/12551\/revisions\/75492"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/media\/2612"}],"wp:attachment":[{"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/media?parent=12551"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/categories?post=12551"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}