www.mycompany.com/help/en/something.htm
www.mycompany.com/help/sv/something.htm
Now I have topic toolbar in master page including default SelectLanguage button and user can change the language of topics with that. BUT instead of a button in topics I'd like to have that button (or link) in header like almost every website do, next to search bar or companys logo. I haven't found a way in Flare to put the default SelectLanguage button to header, so I had to try something else.
I found a solution made with javascript and it's working if I put my code and language switch link (that uses the javascript code) between topics <body> and </body> tags. The solution is simple; it just check if there's /en/ inside the url and if there is, clicking the link changes it to /sv/. The code is:
Code: Select all
<p>
<div class="languagelink"><a href="#" id="changeURLLink">Swedish</a>
</div></p>
<p>
<script type="text/javascript">
// Wrap the JavaScript code in a DOMContentLoaded event listener
document.addEventListener("DOMContentLoaded", function() {
// Add an event listener to the link
document.getElementById("changeURLLink").addEventListener("click", function(event) {
// Prevent the default behavior of the link
event.preventDefault();
// Get the current URL
var currentURL = window.location.href;
// Check if the current URL contains "/en/"
if (currentURL.includes("/en/")) {
// Replace "/en/" with "/sv/"
var newURL = currentURL.replace("/en/", "/sv/");
// Navigate to the new URL
window.location.href = newURL;
} else {
console.log("Current URL doesn't contain language code '/en/'.");
}
});
});
</script>
</p>
Code: Select all
.languagelink
{
display: inline-block;
margin-left: 150px;
z-index: 1;
}
Code: Select all
<script type="text/javascript">
$(document).ready(function(){
// add div for header text
$("a.logo").after('<div class="languagelink"><a href="#" id="changeURLLink">Swedish</a></div>');
});
</script>
I don't have any ideas how to fix this. It obviously has something to do with master page, because the solution works directly from topics code.
I appreciate any help.
If someone wants to see how this should work, just create local folder named "en" and create html file in it using the code below (when you click "Swedish" link, /en/ changes to /sv/ in your browser):
Code: Select all
<html>
<head>
<style>
.languagelink
{
display: inline-block;
margin-left: 150px;
z-index: 1;
}
</style>
</head>
<body>
<p>
<div class="languagelink"><a href="#" id="changeURLLink">Swedish</a>
</div></p>
<p>
<script type="text/javascript">
// Wrap the JavaScript code in a DOMContentLoaded event listener
document.addEventListener("DOMContentLoaded", function() {
// Add an event listener to the link
document.getElementById("changeURLLink").addEventListener("click", function(event) {
// Prevent the default behavior of the link
event.preventDefault();
// Get the current URL
var currentURL = window.location.href;
// Check if the current URL contains "/en/"
if (currentURL.includes("/en/")) {
// Replace "/en/" with "/sv/"
var newURL = currentURL.replace("/en/", "/sv/");
// Navigate to the new URL
window.location.href = newURL;
} else {
console.log("Current URL doesn't contain language code '/en/'.");
}
});
});
</script>
</p>
</body>
</html>