Internationalization | Cuba - Premium Admin Template By Pixelstrap

Loading...

###### Don't Miss Out! Our new update has been released.

###### Something you love is now on sale!

Buy now !

### Internationalization

##### Static Sub Nav

##### How to use it

Add a class `.hdg, .hdg_main, .js-languagePageHdg, .hList, .hList_loose, .masthead-nav., js-languageList, .langChoice, .js-languageSelect` class to any tag for language translate.

Add a language-picker plugin js

HTML Code

     <div class="site">
      <div class="site-bd">
        <div class="wrapper">
          <div class="card">
            <div class="card-header">
              <h5 class="hdg hdg_main js-languagePageHdg">Internationalization</h5>
            </div>
            <div class="main" role="main">
              <select class="langChoice js-languageSelect">
                <option val="0">English</option>
                <option val="1">German</option>
                <option val="2">Russian</option>
                <option val="3">Arabic</option>
              </select>
            </div>
            <div class="card-body grid grid-cols-12">
              <div class="col-lg-6">
                <h5 class="hdg hdg_main js-languagePageHdg">Static Sub Nav</h5>
                <div class="masthead" role="banner">
                  <ul class="icon-lists border navs-icon hList hList_loose masthead-nav js-languageList">
                    <li>
                      <a href="#"><span> Base</span></a>
                    </li>
                    <li>
                      <a href="#"><span> Advance</span></a>
                      <ul class="hList hList_loose masthead-nav js-languageList">
                        <li class="ps-4"><a href="#"><span>Scrollable</span></a></li>
                        <li class="ps-4"><a href="#"><span>Tree View</span></a></li>
                        <li class="ps-4"><a href="#"><span>Rating</span></a></li>
                      </ul>
                    </li>
                    <li>
                      <a href="#"><span data-mlr-text> Forms</span></a>
                    </li>
                    <li>
                      <a href="#"><span data-mlr-text> Tables</span></a>
                    </li>
                  </ul>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
     </div>

##### How to add language

You can also add other language according to below in js and add language type in langChoice.

    var LANGUAGES = {
    "English": {
    "columns": [
    "Base",
    "Advance",
    "scrollable",
    "Tree View",
    "Rating",
    "News",
    "Tables",
    "Base",
    "Advance",
    "scrollable",
    "Tree View",
    "Rating",
    "News",
    "Tables"
    ],
    "heading": "Static Sub Nav",
    },
    "German": {
    "columns": [
    "Basis",
    "Fortschritt",
    "scrollable",
    "Baumansicht",
    "Die Einschaltquote",
    "Nachrichten",
    "Tische",
    "Basis",
    "Fortschritt",
    "scrollable",
    "Baumansicht",
    "Die Einschaltquote",
    "Nachrichten",
    "Tische"
    ],
    "heading": "Statisches U-Boot Nav",
    },
    "Russian": {
    "columns": [
    "Основа",
    "Прогресс",
    "прокручиваемый",
    "Представление Дерева",
    "Оценка",
    "новости",
    "Столы",
    "Основа",
    "Прогресс",
    "прокручиваемый",
    "Представление Дерева",
    "Оценка",
    "новости",
    "Столы"
    ],
    "heading": "Статический Sub Военно - морской",
    },
    "Arabic": {
    "columns": [
    "قاعدة",
    "مقدما",
    "التمرير",
    "عرض الشجرة",
    "تصنيف",
    "أخبار",
    "الجداول",
    "قاعدة",
    "مقدما",
    "التمرير",
    "عرض الشجرة",
    "تصنيف",
    "أخبار",
    "الجداول"
    ],
    "heading": "صافي قيمة الأصول شبه الثابتة",
    }
    };