Creating Localized Country-Based Drupal 10 Websites
In this article, we will address a common requirement faced by developers when developing localized websites. In Drupal 10, we can use the multi-site and multi-domain concept to create multiple websites with different domains. However, in this tutorial, we will focus on creating country-based sites within the same domain, with slight changes in the URL structure, such as appending country/language codes. For example, the local country page for Canada in English will be www.example.com/ca/en, and in French, it will be www.example.com/ca/fr. For the USA, it will be www.example.com/us/en, and for Costa Rica, it will be www.example.com/cr/es.
Introduction:
Developers often encounter the need to create localized websites tailored to different countries and languages. In Drupal 10, a versatile content management system, we can achieve this by leveraging the concept of country-based sites within the same domain. This approach allows us to serve web pages and blocks customized for specific countries and languages while maintaining a consistent user experience across the global website.
Step 1: Initial Setup
Assuming you already have a Drupal 10 website with content and content types, ensure that the Language module is enabled and language settings are configured for your content types.
Step 2: Install and Configure Modules
To enable country-based sites with localized URLs, we will use two modules: Domain Access and Country Path. Follow these steps:
2.1. Install Modules
Download and install the following modules on your Drupal website:
2.2. Enable Modules Enable the necessary modules in your Drupal website. For Domain Access, you can select the specific sub-modules required for your needs. See the screenshot below for reference.
With the modules enabled, you'll now have access to domain-related configuration options in the admin panel.
Step 3: Adding Hostnames
To configure country-based domains, navigate to the "Domains" menu under the "Configuration" section of your Drupal admin panel. Here, you can manage domain records and settings. Follow these steps to add hostnames for specific countries:
3.1. Add Domain Records
- In the "Domain Records" section, click on "Add domains."
- Add entries with domain names and country codes, as illustrated below:
For instance, you can use domain.com/ca for Canada in English, domain.com/ca/fr for Canada in French, domain.com/us for the USA in English, and domain.com/cr for Costa Rica in Spanish.
Step 4: Configure Country Language Prefix
Now, we want to append the language code after the country code in the URL structure. To achieve this, follow these steps:
4.1. Enable Languages Ensure that languages are enabled in your Drupal configuration. You can do this by navigating to "Configuration" > "Regional and language" > "Languages" and confirming that languages are set up correctly.
4.2. Language Detection Navigate to the "Detection and Selection" page under the "Languages" section. Here, enable the detection methods "URL" and "Country Path Language Handler URL," as shown in the screenshot below:
4.3. Configure Path Language Handler URL Click on "Configure" for the "Path Language Handler URL" section, which will take you to the URL /admin/config/regional/language/detection/url. Here, you can specify the path-specific configuration for enabled languages.
Add the enabled languages in the path-specific configuration to reflect the language and country code structure in your URLs.
Step 5: Assign Content to Specific Countries or Domains
To assign a content node to a specific country or country domains, follow these steps:
5.1. Create or Edit Content
When creating or editing a content node, go to the "Domain settings" section on the right sidebar.
5.2. Select Domains
In the "Domain settings" section, you will see a list of available domains and country codes. Select the domains that you want this content to be visible on.
Conclusion:
By following these steps, you can set up localized country-based websites within the same Drupal 10 domain. This approach allows you to serve content tailored to specific countries and languages while maintaining a unified user experience across the global website. With the "Domain Access" and "Country Path" modules, Drupal 10 provides a flexible solution for creating dynamic, localized web experiences for your diverse audience.
