Creating Multilingual Sites in Freeway

It is possible to build a multilingual site using a database which places the correct text, etc., by using PHP or MySQL, but this type of site is more suited to large sites with huge product lines, so there is little advantage.

You will certainly need to plan ahead so you can be methodical in the way you work, and a planning stage will ensure that you start with a clear structure in mind rather than try to change the entire structure later. One thing you will need to consider is whether you want people to be able to click from any page to its equivalent "other language" page, or whether a choice is made from the opening page of the site and clicking on a flag or text link on any particular page will take the visitor back to the index page of the site in the language they choose. The former will need a lot more manual linking (ie, each page will need to have a link to the equivalent page in each language), whereas the latter can have a single link created on a Master page (which will save a lot of time, although it's not such an elegant solution).

Next you need to consider how many multilingual pages you will need - there will need to be an index (Home) page for the site which is the first page seen when the URL is entered into a browser. On this page the visitor will then choose the language they want to view the site in by clicking a link which will take the visitor to the index page of that language.

The structure of the site will be such that the index (Home) page of the whole site (ie, the page which will be seen if the domain's name is entered in the URL field of a browser) will be in the base level of the site. Any other multiligual pages (for instance, the contact page and others may not need to have a different version for each language) can also be in this base level. All pages which are specific to a language should then reside in the folder for that particular language - so, for instance, there can folders for English, French and German.

Another consideration is that there needs to be a separate Master page for each language, so that any navigation buttons or menus are in the correct language.

To create this structure, we need to work in the Site Panel. When a file is created, there will be one Master page and one site page. There will also be a single folder (above the first site page) which is the Site Folder for the whole site. The name of this folder will be whatever name you gave the file (if you start from a template), or the name of the folder chosen when you go to publish your files (if you start with Custom in Pro).

To create your folder structure, select the Site Folder, go to the Page menu and choose New Folder. This will create a new folder inside the Site Folder. Hold down the Alt key, click on the name and type "ENGLISH". Click on the Site Folder again, create another new folder then call it, say, "FRENCH". Repeat this process so you have a separate folder for each language. Your folder structure should look similar to the one shown in the image below.

Now the structure of the folders is established, work on the site itself can start. By far the best way to do this is to build the entire site for one language - then, once this is complete and everyone is happy with it, work can begin on duplicating the Master pages (ready for converting to the next language) and copying the site pages from one language folder to the next. It is very important that everything is agreed for the first language, because any changes made after this stage will mean that edits need to be made to every Master page for each language.

If you choose to make the English site first, remember to allow for any extra letters in the translated words to fit in items such as menu bars and drop-down menus (other languages tend to have longer words than in English) - in fact it is good practice to have translations of the menus to hand so you can design the navigation items to fit the longest words or phrases.

To add pages to a particular folder, click and drag on a Master page and move it so that a line appears below the folder you want to place the page in, then let go of the mouse.

It is important to remember to change the name of the file of the first page of this first language page folder to "index.html".

When working on the first language site, you should only create links to pages in that language. Links to other language pages can be done later, once the pages have been created.

When the first language site has been agreed (and you're quite certain that no more layout changes will be required), you can now copy the pages of that language into the next language page folder. To do this, select a page in the Site Panel, go to Edit>Copy (or type Command-c), click on the new language page folder and to go Edit>Paste (or type Command-v). This needs to be done one page at a time as there is no method of copying an entire page folder, complete with the pages inside it, in Freeway. The structure of your page folders and pages should look similar to that in the graphic below.

Freeway will remember the links from one page to another, so these hyperlinks will be intact when the pages are pasted into the new language folder. Freeway will also remember the file name of "index.html" when the first page of a page folder is copied and pasted.

Once all the pages have been copied across into the new language page folder, work can start on changing the Master pages to the new language.

Select the English Master page, go to Page>Duplicate Page, give it a new name and click OK. Change the Master page to the next language version. Select the pages in your second language page folder (you can do this by clicking on the first page then Shift-clicking on the last page or by Command-clicking to add to your selection for each click). With the pages selected, go to the Inspector then click and hold on the Master popup and choose the second language Master page. Repeat the above for any further languages.

Once the Master pages have been changed, content on the site pages can then be done.

Repeat the above process for each of the other language page folders.

Now that all the pages for each language are in their correct page folders, work can now start on creating links on pages from one language to another. When you create a link, either select some HTML text or select an item and go to Edit>Hyperlinks to see the folder structure in the Edit Hyperlinks dialog box.