Resources Language JS Methods | LangShop Store Currency Converter Shopify App

isReady

Check is LangShop ready

/**
 * @return {boolean}
 */
LangShopSDK.isReady();

// true

getLanguages

Returns array of languages instances

/**
 * @return {Language[]}
 */
LangShopSDK.getLanguages();

// [ { "code": "en", "title": "English", "icon": null }, { "code": "fr", "title": "French", "icon": null } ]

getCurrentLanguage

Returns current page language

/**
 * @return {Language}
 */
LangShopSDK.getCurrentLanguage();

// { "code": "fr", "title": "French", "icon": null }

getOriginalLanguage

Returns primary language of the store

/**
 * @return {Language}
 */
LangShopSDK.getOriginalLanguage();

// { "code": "en", "title": "English", "icon": null }

isOriginalLanguage

Indicates is current language is primary for this store

/**
 * @return {boolean}
 */
LangShopSDK.isOriginalLanguage();

// true or false

getCurrencies

Returns array of currencies instances

getCurrentCurrency

Returns current page currency

getOriginalCurrency

Returns original currency of the store

switchLanguage

Switch to another language by alphabetic code

/**
 * @param {string} code
 */
LangShopSDK.switchLanguage("fr");

switchCurrency

Switch to another currency by alphabetic code

/**
 * @param {string} code
 */
LangShopSDK.switchCurrency("eur");

convertAmount

Convert number from default currency to current

/**
 * @param {number} cents
 * @return {number}
 */
LangShopSDK.convertAmount(100);

// 88.68

getMoneyFormat

Returns current currency money format or default

formatMoney

Converts cents to money representation of the current currency

/**
 * @param {number} cents
 * @return {string}
 */
LangShopSDK.formatMoney(100);

// €0.88 EUR

createLanguagesSwitcher

Create new languages switcher

/**
 * @param {Object} switcher
 * @return {Switcher}
 */
LangShopSDK.createLanguagesSwitcher({

    /**
     * Switcher target element or selector.
     * @type {HTMLElement|string}
     */
    "target": document.body,

    /**
     * Switcher type: "dropdown", "inline", "select", "ios", "modal".
     * @type {string}
     */
    "type": "inline",

    /**
     * Switcher icons type: "rounded", "circle", "square", "rectangle".
     * @type {string}
     */
    "icons": "circle",

    /**
     * Switcher position: "relative", "bottom-right", "bottom-left", "top-right", "top-left".
     * @type {string}
     */
    "position": "bottom-right",

    /**
     * Switcher display mode: "all", "titles", "icons".
     * @type {string}
     */
    "display": "all",

    /**
     * Offsets from the corner for non-relative switcher positions, e.g.: "10px", "5%"
     * @type {string}
     */
    "offset": "10px",

    /**
     * Display languages alphabetic codes in uppercase instead of languages titles.
     * @type {boolean}
     */
    "shortTitles": false,

    /**
     * Use predesigned switcher styles.
     * @type {boolean}
     */
    "defaultStyles": true
});

createCurrenciesSwitcher

Create new currencies switcher

/**
 * @param {Object} switcher
 * @return {Switcher}
 */
LangShopSDK.createCurrenciesSwitcher({

    /**
     * Switcher target element or selector.
     * @type {HTMLElement|string}
     */
    "target": document.body,

    /**
     * Switcher type: "dropdown", "inline", "select", "ios", "modal".
     * @type {string}
     */
    "type": "dropdown",

    /**
     * Switcher icons type: "rounded", "circle", "square", "rectangle".
     * @type {string}
     */
    "icons": "rounded",

    /**
     * Switcher position: "relative", "bottom-right", "bottom-left", "top-right", "top-left".
     * @type {string}
     */
    "position": "relative",

    /**
     * Switcher display mode: "all", "titles", "icons".
     * @type {string}
     */
    "display": "titles",

    /**
     * Offsets from the corner for non-relative switcher positions, e.g.: "10px", "5%"
     * @type {string}
     */
    "offset": "0px",

    /**
     * Display currencies alphabetic codes in uppercase instead of currencies titles.
     * @type {boolean}
     */
    "shortTitles": true,

    /**
     * Use predesigned switcher styles.
     * @type {boolean}
     */
    "defaultStyles": true
});

getProduct

Get localized product by handle

function onSuccess(product) {
    ...
}

function onError(e) {
    ...
}

/**
 * @param {string} handle
 * @param {function} success
 * @param {function} error
 * @return {XMLHttpRequest}
 */
LangShopSDK.getProduct("product-handle", onSuccess, onError)

getCollection

Get localized collection by handle

function onSuccess(collection) {
    ...
}

function onError(e) {
    ...
}

/**
 * @param {string} handle
 * @param {function} success
 * @param {function} error
 * @return {XMLHttpRequest}
 */
LangShopSDK.getCollection("collection-handle", onSuccess, onError)

getPage

Get localized page by handle

function onSuccess(page) {
    ...
}

function onError(e) {
    ...
}

/**
 * @param {string} handle
 * @param {function} success
 * @param {function} error
 * @return {XMLHttpRequest}
 */
LangShopSDK.getPage("page-handle", onSuccess, onError)

getBlog

Get localized blog by handle

function onSuccess(blog) {
    ...
}

function onError(e) {
    ...
}

/**
 * @param {string} handle
 * @param {function} success
 * @param {function} error
 * @return {XMLHttpRequest}
 */
LangShopSDK.getBlog("blog-handle", onSuccess, onError)

getArticle

Get localized article by handle

function onSuccess(article) {
    ...
}

function onError(e) {
    ...
}

/**
 * @param {string} blog
 * @param {string} handle
 * @param {function} success
 * @param {function} error
 * @return {XMLHttpRequest}
 */
LangShopSDK.getArticle("blog-handle", "article-handle", onSuccess, onError)

translate

This method will help to integrate any third-party applications with LangShop. Just send your static content and receive the translations into the current selected language. All translations can be managed in LangShop Application interface. Also, you can find examples of using this method.

Method arguments:

key - unique application key. If you an application developer, you can contact our application support to receive the application key.
query - array of strings to translate. You can use any valid HTML markup and dynamic variables, wrapped with braces (e.g. { { count } }). Dynamic variables will not be translated.
result - callback to handle the array of translated strings. You will receive translations into the currently active language.

Limitations per application key:

20 requests per minute for new content translations
Max 50 strings in array per method call
Max 65535 chars per each string

Usage:

Recommendations:

To speed up the translations, do not call this method per each needed string in your code. Collect all needed strings to the array and make one method call.
Do not use dynamic content (e.g. numbers) in translatable strings. Replace it with variables, wrapped with braces (e.g. { { count } }). In this case, you will receive translations much faster.
Do not use this method to translate content, received from Shopify (e.g. products, pages, etc.). Translate your own content, required to render some dynamic elements, e.g. modals, banners etc.

You can copy demo key below to make some tests, but in security reasons, this key has stronger limitations on requests and content: 3 requests per minute for new content translations, max 10 strings in array per method call, max 500 chars per each string. You will receive original content if any error occurred.

8a2203211dbb8db4e7209cede045cbe7b0deffefd49e678a86872370ea866de0

on

Subscribe to event by it name

function onLangShopReady() {
    ...
}

/**
 * @param {string} event
 * @param {function} callback
 */
LangShopSDK.on("ready", onLangShopReady);

off

Remove subscription on event by it name

function onLangShopReady() {
    ...
}

/**
 * @param {string} event
 * @param {function} callback
 */
LangShopSDK.off("ready", onLangShopReady);

LangShop

Methods

On this page