0

We are trying to implement the multilingual site in JSS. When user logged in we are showing a drop down to select the language and based on the selection we want to set the language. Question her is is how to set the sc_lang parameter from a JSS component where the user will select the language to be displayed.

Any suggestion will help us.

Thanks,

2

I use a react jss example for testing jss. In this example multi language feature already implemented. I think, it is implemented for other js frameworks too. So if you build your solution not on a jss example you can look how it was implemented there. If you use a jss example as base of you solution then for set the sc_lang in jss api call you need just set correct url with language(it is mean that your component, probably, will contain links with different languages for current page).

enter image description here

is there a way to set the language other than passing the code in URL?

You can change language using SitecoreContextFactory, in your component set new language

import React from 'react';
import SitecoreContextFactory from '../../lib/SitecoreContextFactory';

class LngPicker extends React.Component {
 constructor(props) {
 super(props);
 this.changeLng = this.changeLng.bind(this);
}

changeLng(key){
 var context = SitecoreContextFactory.getSitecoreContext();
 SitecoreContextFactory.setSitecoreContext({
  ...context,
  language: key ,
  refresh:true     
});
}

render() {
  return (
    <button onClick={()=> this.changeLng('da-Dk')} >da-DK</button>  
  );
 }
}

export default LngPicker;

then update RouteHandler, add to constructor

SitecoreContextFactory.subscribeToContext((context)=>{
  if(context.refresh){
    i18n.changeLanguage(context.language)
    let sitecoreRoutePath = this.props.route.match.params.sitecoreRoute || '/';
    if (!sitecoreRoutePath.startsWith('/')) {
      sitecoreRoutePath = `/${sitecoreRoutePath}`;
    }

    getRouteData(sitecoreRoutePath, context.language).then((routeData) => {
      if (routeData !== null && routeData.sitecore && routeData.sitecore.route) {
        SitecoreContextFactory.setSitecoreContext({
          route: routeData.sitecore.route,
          itemId: routeData.sitecore.route.itemId,
          ...routeData.sitecore.context,
          refresh: false
        });
        this.setState({ routeData, notFound: false });
      } else {
        this.setState({ routeData, notFound: true });
      }
    });
  }
});
  • Thank you pblrok.. is there a way to set the language other than passing the code in URL..? – Gobinath Jan 4 at 21:16
  • 1
    Using sc_lang is the supported method to specify the language when calling Layout Service. – Kam Figy Jan 8 at 13:59

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.