Easily switch between sites on any page of your website.
This plugin provides an easy way to switch between sites on your website. Regardless of which page you are currently on, you will be linked to the same page in its parallel site.
* Note: You must be using Craft's multi-site feature to access multiple languages on your website.
siteSwitcher(siteHandle, element = null)
siteHandle
- The handle of your site (ie:english
).element
- (optional) If the current page is anentry
(or another element type), you can pass that element in as the second parameter. This ensures that any translated slugs are properly used.
Returns a URL which links to the alternate-site version of the current page. If the siteHandle
or element
is invalid, false
will be returned instead.
Simply use a line of code like this:
<a href="{{ siteSwitcher('spanish') }}">Español</a>
That will link you to the Spanish version of the current page.
If the current page is an entry, your entry might be using different slugs for each language. In that case, you can pass the entry
object as your second parameter:
<a href="{{ siteSwitcher('spanish', entry) }}">Español</a>
That second parameter can accept any Craft element type, so you can use other elements as well! Obviously, only elements which make use of slugs (like category
elements) will work.
<a href="{{ siteSwitcher('spanish', category) }}">Español</a>
Using the null-coalescing operator, you can chain potential element types. If one isn't defined on a particular page, the next value will be used.
{% set element = (category ?? entry ?? null) %}
This will use the first non-null value it finds (or null if no element exists).
A simple piece of code like this one will work great across 99% of sites:
{% set element = (category ?? entry ?? null) %}
<ul>
<li><a href="{{ siteSwitcher('english', element) }}">English</a></li>
<li><a href="{{ siteSwitcher('spanish', element) }}">Español</a></li>
<li><a href="{{ siteSwitcher('french', element) }}">Français</a></li>
<li><a href="{{ siteSwitcher('german', element) }}">Deutsch</a></li>
</ul>
You can use this code in an include
, and share it across your entire website. If the page is an entry
page, it will use the localized version of that entry's slug. Otherwise, it will simply retain the same URI for each link.
If you want to dynamically loop through each of your sites, try this instead:
{% set element = (category ?? entry ?? null) %}
<ul>
{% for site in craft.app.sites.getAllSites() %}
<li><a href="{{ siteSwitcher(site.handle, element) }}">{{ site.name }}</a></li>
{% endfor %}
</ul>
You can check to make sure that a translated version of that element exists before showing the link:
{% set element = (category ?? entry ?? null) %}
<ul>
{% for site in craft.app.sites.getAllSites() %}
{% set siteLink = siteSwitcher(site.handle, element) %}
{% if siteLink %}
<li><a href="{{ siteLink }}">{{ site.name }}</a></li>
{% endif %}
{% endfor %}
</ul>
Assuming your homepage is properly translated across each site, you can set the homepage as a final backstop. If the link cannot otherwise be determined, it will link to the translated homepage instead.
Simply set the optional third parameter to true
:
{% set element = (category ?? entry ?? null) %}
<ul>
<li><a href="{{ siteSwitcher('english', element, true) }}">English</a></li>
<li><a href="{{ siteSwitcher('spanish', element, true) }}">Español</a></li>
<li><a href="{{ siteSwitcher('french', element, true) }}">Français</a></li>
<li><a href="{{ siteSwitcher('german', element, true) }}">Deutsch</a></li>
</ul>
We've got other plugins too!
Check out the full catalog at doublesecretagency.com/plugins