[Guide] Basic multilingual site using the Pages app

[-FP]

So I wanted to share this simple example of how you could go about using the pages app to deliver content in various languages. It's probably not the best implementation and there are some things to consider like meta tags... but it works, hopefully some of you will find it useful as a starting point.

What is nice is that IPS automatically sets the site language for guests -I believe- based on the browser's locale, so everything works nicely.

I created a free demo install on IPS to write this guide, that means that I'm implementing it over the default pages app setup.

------------------------------------------------------------------------------------

1 - Initial Setup

1.1: Obviously we need to have at least 2 languages. In this example I'm using English and Spanish. English is the default language. At this point you should take a note of the IDs of your languages.

In this case it is easy because it's a fresh install and there are only 2 languages, so the IDs are 1 for English and 2 for Spanish. It will probably be different in other cases. You can find the ID of the language by hovering over the button to edit the language and taking a look at the URL. The ID would be the last number in the URL.

 

1.2: In this example we will be working with the 2 basic fields, the article title and the article content. We need to add additional fields to the articles database, to store the Spanish version of the article.

Note that you also need to make a note with the IDs of the Spanish fields so we can use them later in the templates. You can find their IDs in the same way you did for the languages.

 

Create a new Text field for the Spanish article title.

 

Then create an Editor field for the Spanish article content.

 

1.3: At this point if you try to add a new article, you should see the Spanish title and content fields.

 

 

2 - Database Template Edits

Now it's time to modify the database templates to display the English or Spanish fields depending on the user's language. I'm modifying the default templates because as I said this is a fresh install and it's what the database uses by default. You may have to check what templates your database is using if you already have custom/different ones in use.

I will be modifying a couple of templates, the entry and record ones. Depending on how you show the articles on your site, you may have to expand this to other templates. This setup is meant to work with the database setting "Database index" set to "Show records like articles".

Remember when I talked about making a note of the additional Spanish fields IDs and language IDs?

In this case, the Spanish title field ID is 3, and the Spanish content field ID is 4.
As for the languages, as said in the beginning of the guide, English is ID 1, and Spanish is ID 2.

This is important to keep in mind because we will use these to perform some checks and show one field or the other.

So IF there's something in the Spanish title field AND the user's language is Spanish, then we will show the Spanish title. Otherwise we will show the English title.
Same logic for the content field.

 

2.1: In the database templates under Category Articles, open the entry template.

Find the <span> element for the record title.

Modify the code to match the screenshot above. You can copy this and modify the IDs to your needs.

{{if $record->field_3 != "" && member.language == 2}}
	<a href="{$record->url()}" title="{lang="read_more_about" sprintf="$record->field_3"}">{wordbreak="$record->field_3"}</a>
{{else}}
	<a href="{$record->url()}" title="{lang="read_more_about" sprintf="$record->_title"}">{wordbreak="$record->_title"}</a>
{{endif}}

 

2.2: In the same entry template, scroll down a bit to find the <section> element where the preview content is displayed.

Once again, replace and modify the code to your needs.

{{if $record->field_4 != "" && member.language == 2}}
	{$record->field_4|raw}
{{else}}
	{$record->truncated()|raw}
{{endif}}

 

2.3: Now we are going to modify the record template under Display. This template displays the full article content when you view it.

Locate the code where the article title is displayed, it's below {{if $record->canEditTitle()}}

Modify the code once again.

{{if $record->canEditTitle()}}
<span class='ipsType_break ipsContained' data-controller="core.front.core.moderation">
  <span data-role="editableTitle" title='{lang="click_hold_edit"}'>
    {{if $record->field_3 != "" && member.language == 2}}
    	{$record->field_3}
    {{else}}
    	{$record->_title}
    {{endif}}
  </span>
</span>
{{else}}
<span class='ipsType_break ipsContained'>
  {{if $record->field_3 != "" && member.language == 2}}
  	{$record->field_3}
  {{else}}
  	{$record->_title}
  {{endif}}
</span>
{{endif}}

 

2.4: Still in the record template, scroll down a bit to find the <section> element with the article's content.

For the last time, modify the code. Again, don't forget to change the IDs if you need to.

{{if $record->field_4 != "" && member.language == 2}}
	{$record->field_4|raw}
{{else}}
	{$record->_content|raw}
{{endif}}

 

 

3 - Result

Article entry in English.

Article entry in Spanish.

 

Article content in English.

Article content in Spanish.

 

 

------------------------------

Aaaaaand that's it for now, cheers!

As I said, this is a basic example but what is shown here can be easily expanded to more languages, fields, and to other elements like custom blocks.

[Joel R]

Nominating this post for Multilingual Guide of the Month.  

[joshuaj]

Very nice guide! I second @Joel R on Guide of the Month.

[kmk]

Need more guide like this, withou some like this I dont know how I can admin and play IPS better shuld be is......

@-FP do you know some solution to implement multilingual for club feature...

[-FP]

Not really @kmk, well I haven't looked into it, I haven't looked into clubs at all. The thing is it's easy and simple in Pages because of its nature, using custom fields in the templates. I think clubs also has custom fields, but I suspect everything else to make use of them would not be as straight forward.

[Meddysong]

It's not possible in Clubs. There aren't any translatable fields for club name and description, unfortunately (and frustratingly).