Your Framer website in multiple languages
Use the Framer CMS to easily offer your website in multiple languages. All you need is access to multiple CMS collections.
These lovely people would like to know how it works
How it works
Easily create your website in multiple languages online in four simple steps
Do you have a website that you want to offer in more languages? You can use external tools for this, or be patient with Framer's native solution. However, you can also arrange this via the CMS.
Start with the design
Just design your page as you always would. In this case it is useful to first know which text fields there are and then create everything in one go in the CMS.
Start a CMS collection
It's important to understand that each collection represents one separate page for your website. Start a new collection and add all text fields to the fields in the collection.
Link the variables
To ensure that your text can be loaded from the CMS in the correct language, you must link the text fields on the canvas to the correct variables in the CMS.
Each language is one item
Next, create a new item for each language you want to offer. You can then use the slug for the language. For example, the English language can be found on the slug /en.
I need more control over the slug
When you create a collection, the default slug is collectiontitle/itemtitle. This is annoying if you want to follow standard web convention or if you want to localize your homepage. So you will see that the slug of this page is simply /nl/ and the collection title is not mentioned in it. You can easily change this on the settings page, by leaving only the slug the collection title will no longer be displayed.
Are there any other ways in Framer?
Yes, you can also simply duplicate your page and set the slug yourself. After this you only have to adjust the text and links to make the translations work properly. The only drawback is that if you subsequently adjust the structure of your page, you will also have to implement this on every copied page.
Why is this good for SEO?
If you use external tools such as a Weglot, you can easily offer your website in multiple languages, but unfortunately this means that your texts in the other languages do not count for your SEO results. Therefore, it is more convenient to do it this way. This way you know for sure that your website is ranked in Google for all languages.
How it works
How do you display this on your homepage
Unfortunately, you cannot use an item from your CMS collection as your homepage. So we have to use a little detour for this.
Select all of your layers and copy them.
Go to your homepage and make sure it's completely empty.
Press 'i' to open the insert menu and drag the homepage collection on the screen.
Fix the width and height so it covers your whole page.
Delete everything from within the post and remove the link.
Paste everything inside your post layer.
Connect all variables once more.
Select the collection list and add a filter on the slug that equals the slug you'd like to use.
Your homepage is now setup in the correct language.