Multilanguage, language selection menu

Example:

RU EN
The code below creates a button for switching to alternative languages, and if an alternative language version is specified to the page, it will be used.

1) Paste the Css code into the Design Editor, in the CSS tab.
2) Add JavaScript to the block / menu displayed on all pages.
3) Paste the code of the drop-down list of languages in the block / menu in which you want to place it, for example, in the header of the site.
4) Remove the unnecessary language from the block (class hotengine-shop-select-language-val)

Language selection menu code

Code: html


  <span class="hotengine-shop-select-language-box">
  <span class="hotengine-shop-select-language"></span>
  <span class="hotengine-shop-select-language-values">
  <span class="hotengine-shop-select-language-val" data-language="ru">RU</span>
  <span class="hotengine-shop-select-language-val" data-language="en">EN</span>
  <span class="hotengine-shop-select-language-val" data-language="ua">UA</span>
  <span class="hotengine-shop-select-language-val" data-language="de">DE</span>
  <span class="hotengine-shop-select-language-val" data-language="fr">FR</span>
  <span class="hotengine-shop-select-language-val" data-language="es">ES</span>
  <span class="hotengine-shop-select-language-val" data-language="kz">KZ</span>
  <span class="hotengine-shop-select-language-val" data-language="by">BY</span>
  </span>
  </span>

Code: CSS стиль

 

  .hotengine-shop-select-language-box { display:inline-block; width:71px; height:30px; overflow:hidden; border:1px solid #D3D3D3; background:#fff; line-height:30px; position:relative; z-index:1000; }
  .hotengine-shop-select-language { display:inline-block; width:71px; text-align:center;  }
  .hotengine-shop-select-language-values { display:inline-block; width:69px; vertical-align: top; position:absolute; background:rgba(255, 255, 255, 0.80); left:2px; }
  .hotengine-shop-select-language-box:hover{ overflow:visible;}
  .hotengine-shop-select-language-values:hover li{ position:relative; }
  .hotengine-shop-select-language-val { width:39px; display:block; margin:0px; padding: 0px 17px; vertical-align:top; cursor:pointer; margin-left:-3px; text-align:center; }
  .hotengine-shop-select-language-val:hover {background:#e8e8e8;}

Code: JavaScript

 <script type="text/javascript">
  <!--
  
  $(document).ready(function(){
  var $current_language = $("meta[http-equiv='content-language']").attr("content");
  $(".hotengine-shop-select-language").html($current_language.toUpperCase());
  $(".hotengine-shop-select-language-val[language='"+$(this).attr("data-language")+"']").remove();
  
  $(".hotengine-shop-select-language-box .hotengine-shop-select-language-val").on("click", function(){ 
 if($(this).attr("data-language") !== $current_language || typeof $current_language == typeof undefined){
  var $url = $("link[rel='alternate'][hreflang='"+$(this).attr("data-language")+"']").attr("href");
  if (typeof $url !== typeof undefined && $url !== false && $url !== "undefined" && $url.length > 0) { 
  window.location.replace($url);
  } else { 
  var $url = window.location.protocol +"//"+ window.location.host + "/"+$(this).attr("data-language")+"/";
  window.location.replace($url);
  }
  }
  
 
  });
});
  //-->
  </script>

Added an additional function for selecting delivery on the checkout page.
New Feature: Split product block into two parts (when viewing product list)
New Setting: Display List of Child Subcategories