How to change language of Facebook like button according to the language which is actually selected? | XM Community
Skip to main content
Hi all,

I'd like to include the Facebook like button to a survey with multiple language versions. I want the text of the button to be always in the same language as the rest of the survey.

Therefore I detected the language and place it to the URL of the source script (`<script async defer crossorigin="anonymous" src="https://connect.facebook.net/'+ lang + '/sdk.js#xfbml=1&version=v3.0"></script>`). It works, but only in case, the language is selected on some of the previous pages. When I change the language nothing happens, even though it seems that the button is drawn again (it disappears for a short moment and appears again) and I'm able to `alert` the correct language. I've tried to dynamically modify the size of the button and this works. Therefore I suppose that the problem is that there is already loaded another script with another language. Unfortunately, I have no idea what to do with this. I have read that if I removed the script, the codes would stay in the browser memory anyway. So I don't know how to solve this.

Would anyone have some idea?



The MWE is here:



Qualtrics.SurveyEngine.addOnload(function()

{



var that = this;

var myURL = 'https://www.qualtrics.com/';





var Q = jQuery("#"+that.questionId);

Q.prepend('<div id="fb-root"></div>');

Q.prepend('<div id="scriptDiv"></div>');



updateLike(myURL);



jQuery('#Q_lang').change(function() {

updateLike(myURL);

});





window.fbAsyncInit = function() {

FB.init({

appId : 'your-app-id',

autoLogAppEvents : true,

xfbml : true,

version : 'v4.0'

});

};



function getLang() {

//Gets value of the Qualtrics language selector and converts it to the Facebook format

//Works for following languages: "CS", "EN", "PT", "IT"



var Q_list = ["CS", "EN", "PT", "IT"];

var FB_list = ["cs_CZ", "en_US", "pt_BR", "it_IT" ];

var lang2;



var Q_lang = document.documentElement.lang;

var i = Q_list.indexOf(Q_lang);

lang2 = FB_list[i];





return lang2;

}







function updateLike(URL){

var lang = "en_US";

lang = getLang();



var likeDiv = '<div class="fb-like" data-href="' + URL

+ '" data-width="600" data-layout="button_count" data-action="like" data-size="small" data-show-faces="true" data-share="true"></div>';



jQuery('#scriptDiv').html('<script async defer crossorigin="anonymous" src="https://connect.facebook.net/'+ lang + '/sdk.js#xfbml=1&version=v3.0"></script>');

jQuery(".lajklitko").html(likeDiv);

FB.XFBML.parse();

}





});
Finally, I found someone who solved this.

The problem was that the FB initializing script checks whether there already is a FB object and if so it doesn't create a new one. Inserting `FB = undefined` before loading new scipt solved this.

Leave a Reply