mirror of
https://github.com/WerySkok/weryskok.ru.git
synced 2025-01-14 03:23:03 +03:00
Auto-detect language
This commit is contained in:
parent
bc37c5fc88
commit
5dd0169c6b
5 changed files with 163 additions and 78 deletions
|
@ -22,8 +22,8 @@
|
|||
<i class="fas fa-globe"></i> English
|
||||
</a>
|
||||
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
<li><a class="dropdown-item" href="/">Русский</a></li>
|
||||
<li><a class="dropdown-item active" href="/en/">English</a></li>
|
||||
<li><a class="dropdown-item" onclick="usePrefferedLanguage('ru'); return false;" href="/">Русский</a></li>
|
||||
<li><a class="dropdown-item active" onclick="usePrefferedLanguage('en'); return false;" href="/en/">English</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</span>
|
||||
|
|
|
@ -22,8 +22,8 @@
|
|||
<i class="fas fa-globe"></i> Русский
|
||||
</a>
|
||||
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
<li><a class="dropdown-item active" href="/">Русский</a></li>
|
||||
<li><a class="dropdown-item" href="/en/">English</a></li>
|
||||
<li><a class="dropdown-item active" onclick="usePrefferedLanguage('ru'); return false;" href="/">Русский</a></li>
|
||||
<li><a class="dropdown-item" onclick="usePrefferedLanguage('en'); return false;" href="/en/">English</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</span>
|
||||
|
|
|
@ -1,41 +1,63 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{{ page.title }}</title>
|
||||
<script src="https://kit.fontawesome.com/48d163f212.js" crossorigin="anonymous"></script>
|
||||
<link rel="stylesheet" href="https://bootswatch.com/5/darkly/bootstrap.min.css" crossorigin="anonymous">
|
||||
<!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>{{ page.title }}</title>
|
||||
<script
|
||||
src="https://kit.fontawesome.com/48d163f212.js"
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://bootswatch.com/5/darkly/bootstrap.min.css"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> -->
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Inter', sans-serif;
|
||||
}
|
||||
</style>
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<link rel="manifest" href="/site.webmanifest">
|
||||
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
|
||||
<meta name="msapplication-TileColor" content="#2d89ef">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
{% feed_meta %}
|
||||
{% seo %}
|
||||
</head>
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Inter', sans-serif;
|
||||
}
|
||||
</style>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="180x180"
|
||||
href="/apple-touch-icon.png"
|
||||
/>
|
||||
<link
|
||||
rel="icon"
|
||||
type="image/png"
|
||||
sizes="32x32"
|
||||
href="/favicon-32x32.png"
|
||||
/>
|
||||
<link
|
||||
rel="icon"
|
||||
type="image/png"
|
||||
sizes="16x16"
|
||||
href="/favicon-16x16.png"
|
||||
/>
|
||||
<link rel="manifest" href="/site.webmanifest" />
|
||||
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
|
||||
<meta name="msapplication-TileColor" content="#2d89ef" />
|
||||
<meta name="theme-color" content="#ffffff" />
|
||||
<script src="/assets/scripts/change_language.js"></script>
|
||||
{% feed_meta %} {% seo %}
|
||||
</head>
|
||||
|
||||
<body class="d-flex flex-column h-100">
|
||||
{% include header-en.html %}
|
||||
<main class="flex-shrink-0">
|
||||
{{ content }}
|
||||
</main>
|
||||
{% include footer.html %}
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
|
||||
crossorigin="anonymous"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
<body class="d-flex flex-column h-100">
|
||||
{% include header-en.html %}
|
||||
<main class="flex-shrink-0">{{ content }}</main>
|
||||
{% include footer.html %}
|
||||
<script
|
||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -1,41 +1,63 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="ru">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{{ page.title }}</title>
|
||||
<script src="https://kit.fontawesome.com/48d163f212.js" crossorigin="anonymous"></script>
|
||||
<link rel="stylesheet" href="https://bootswatch.com/5/darkly/bootstrap.min.css" crossorigin="anonymous">
|
||||
<!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>{{ page.title }}</title>
|
||||
<script
|
||||
src="https://kit.fontawesome.com/48d163f212.js"
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://bootswatch.com/5/darkly/bootstrap.min.css"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> -->
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Inter', sans-serif;
|
||||
}
|
||||
</style>
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<link rel="manifest" href="/site.webmanifest">
|
||||
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
|
||||
<meta name="msapplication-TileColor" content="#2d89ef">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
{% feed_meta %}
|
||||
{% seo %}
|
||||
</head>
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Inter', sans-serif;
|
||||
}
|
||||
</style>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="180x180"
|
||||
href="/apple-touch-icon.png"
|
||||
/>
|
||||
<link
|
||||
rel="icon"
|
||||
type="image/png"
|
||||
sizes="32x32"
|
||||
href="/favicon-32x32.png"
|
||||
/>
|
||||
<link
|
||||
rel="icon"
|
||||
type="image/png"
|
||||
sizes="16x16"
|
||||
href="/favicon-16x16.png"
|
||||
/>
|
||||
<link rel="manifest" href="/site.webmanifest" />
|
||||
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
|
||||
<meta name="msapplication-TileColor" content="#2d89ef" />
|
||||
<meta name="theme-color" content="#ffffff" />
|
||||
<script src="/assets/scripts/change_language.js"></script>
|
||||
{% feed_meta %} {% seo %}
|
||||
</head>
|
||||
|
||||
<body class="d-flex flex-column h-100">
|
||||
{% include header.html %}
|
||||
<main class="flex-shrink-0">
|
||||
{{ content }}
|
||||
</main>
|
||||
{% include footer.html %}
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
|
||||
crossorigin="anonymous"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
<body class="d-flex flex-column h-100">
|
||||
{% include header.html %}
|
||||
<main class="flex-shrink-0">{{ content }}</main>
|
||||
{% include footer.html %}
|
||||
<script
|
||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
41
assets/scripts/change_language.js
Normal file
41
assets/scripts/change_language.js
Normal file
|
@ -0,0 +1,41 @@
|
|||
function usePrefferedLanguage(newLang) {
|
||||
function changeLanguageTo(language) {
|
||||
if (document.title.includes('404')) return; // TODO: make an english version of 404
|
||||
if (document.querySelector('html').lang == language) return;
|
||||
switch (language) {
|
||||
case 'en':
|
||||
location.pathname = `/en${location.pathname}`;
|
||||
break;
|
||||
|
||||
case 'ru':
|
||||
location.pathname = location.pathname.replace('/en', '');
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function browserPrefferedLanguage() {
|
||||
if (navigator.languages.includes('ru')) {
|
||||
return 'ru';
|
||||
}
|
||||
return 'en';
|
||||
}
|
||||
|
||||
let prefferedLanguage = localStorage.getItem('prefferedLanguage');
|
||||
|
||||
if (newLang) {
|
||||
localStorage.setItem('prefferedLanguage', newLang);
|
||||
prefferedLanguage = localStorage.getItem('prefferedLanguage');
|
||||
}
|
||||
|
||||
if (!prefferedLanguage) {
|
||||
localStorage.setItem('prefferedLanguage', browserPrefferedLanguage());
|
||||
prefferedLanguage = localStorage.getItem('prefferedLanguage');
|
||||
}
|
||||
|
||||
changeLanguageTo(prefferedLanguage);
|
||||
}
|
||||
|
||||
usePrefferedLanguage();
|
Loading…
Reference in a new issue