W niniejszym artykule dowiesz się jak integrować swój szablon z usługą automatycznego tłumaczenia – Google Translate.
Zachęcamy Was do przejścia na nasze nowe, udoskonalone szablony. Dla sklepów B2C polecamy szablony Topaz, One Page Shop oraz Dla Gastronomii, natomiast dla platform B2B idealnym wyborem będą Rubin i Szafir.
Szafir
Przejdź do folderu z szablonem a następnie otwórz plik znajdujący się pod ścieżką common/header/header-top-bar.html. Za pomocą narzędzia wyszukiwania znajdź trzecie wystąpienie frazy languagesSize. Bezpośrednio pod znalezioną linią wklej następujący kod:
| <div id=”google_translate_element” style=”display: inline-block;”></div> |
Przejdź z powrotem do głównego folderu szablonu i otwórz plik _layout.html. Za pomocą narzędzia wyszukiwania znajdź frazę </head>. Bezpośrednio nad znalezioną linią wklej następujący kod:
Przejdź do folderu z szablonem a następnie otwórz plik znajdujący się pod ścieżką elements/header/header-1.html. Za pomocą narzędzia wyszukiwania znajdź frazę headerSection__shopData. Bezpośrednio pod znalezioną linią wklej następujący kod:
| <div id=”google_translate_element” style=”display: inline-block;”></div> |
Przejdź z powrotem do głównego folderu szablonu i otwórz plik base_layout.html. Za pomocą narzędzia wyszukiwania znajdź frazę </head>. Bezpośrednio nad znalezioną linią wklej następujący kod:
| <div id=”google_translate_element” style=”display: inline-block;”></div> <code class=”lang:ruby decode:true”><script type=”text/javascript”> function googleTranslateElementInit() { new google.translate.TranslateElement({pageLanguage: 'pl’, includedLanguages: 'bg,cs,de,en,hr,hu,it,lt,ro,ru,sk,sl,uk’, layout: google.translate.TranslateElement.InlineLayout.SIMPLE, gaTrack: true, gaId: 'UA-13192131-1′}, 'google_translate_element’); } </script> <script type=”text/javascript” src=”https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit” async=”true” defer=”true”></script> </code> |
Wersja druga (header-2)
Przejdź do folderu z szablonem a następnie otwórz plik znajdujący się pod ścieżką elements/header/header-2.html. Za pomocą narzędzia wyszukiwania znajdź frazę headerSection__shopData. Bezpośrednio pod znalezioną linią wklej następujący kod:
| <div id=”google_translate_element” style=”display: inline-block;”></div> |
Przejdź z powrotem do głównego folderu szablonu i otwórz plik base_layout.html. Za pomocą narzędzia wyszukiwania znajdź frazę </head>. Bezpośrednio nad znalezioną linią wklej następujący kod:
| <code class=”lang:ruby decode:true”><script type=”text/javascript”> function googleTranslateElementInit() { new google.translate.TranslateElement({pageLanguage: 'pl’, includedLanguages: 'bg,cs,de,en,hr,hu,it,lt,ro,ru,sk,sl,uk’, layout: google.translate.TranslateElement.InlineLayout.SIMPLE, gaTrack: true, gaId: 'UA-13192131-1′}, 'google_translate_element’); } </script> <script type=”text/javascript” src=”https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit” async=”true” defer=”true”></script> </code> |
Wersja trzecia (header-3)
Przejdź do folderu z szablonem a następnie otwórz plik znajdujący się pod ścieżką elements/header/header-3.html. Za pomocą narzędzia wyszukiwania znajdź frazę headerSection__bannerBg. Cztery linie nad znalezioną linią (trzy linie nad znalezioną frazą składają się z tagów) wklej następujący kod:
| <div id=”google_translate_element” style=”display: inline-block;”></div> |
Przejdź z powrotem do głównego folderu szablonu i otwórz plik base_layout.html. Za pomocą narzędzia wyszukiwania znajdź frazę </head>. Bezpośrednio nad znalezioną linią wklej następujący kod:
| <code class=”lang:ruby decode:true”><script type=”text/javascript”> function googleTranslateElementInit() { new google.translate.TranslateElement({pageLanguage: 'pl’, includedLanguages: 'bg,cs,de,en,hr,hu,it,lt,ro,ru,sk,sl,uk’, layout: google.translate.TranslateElement.InlineLayout.SIMPLE, gaTrack: true, gaId: 'UA-13192131-1′}, 'google_translate_element’); } </script> <script type=”text/javascript” src=”https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit” async=”true” defer=”true”></script> </code> |
Agat
Przejdź do folderu z szablonem a następnie otwórz plik znajdujący się pod ścieżką partials/common/header.html. Za pomocą narzędzia wyszukiwania znajdź frazę lang-and-currency. Bezpośrednio pod znalezioną linią wklej następujący kod:
| <div id=”google_translate_element” style=”display: inline-flex;”></div> |
Przejdź z powrotem do głównego folderu szablonu i otwórz plik _layout.html. Za pomocą narzędzia wyszukiwania znajdź frazę </head>. Bezpośrednio nad znalezioną linią wklej następujący kod:
| <code class=”lang:ruby decode:true”><script type=”text/javascript”> function googleTranslateElementInit() { new google.translate.TranslateElement({pageLanguage: 'pl’, includedLanguages: 'bg,cs,de,en,hr,hu,it,lt,ro,ru,sk,sl,uk’, layout: google.translate.TranslateElement.InlineLayout.SIMPLE, gaTrack: true, gaId: 'UA-13192131-1′}, 'google_translate_element’); } </script> <script type=”text/javascript” src=”https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit” async=”true” defer=”true”></script> </code> |
Bursztyn
Przejdź do folderu z szablonem a następnie otwórz plik znajdujący się pod ścieżką page/header.html. Za pomocą narzędzia wyszukiwania znajdź frazę secondary-nav. Dwie linie pod znalezioną wklej następujący kod (pod tagiem <ul>):
| <div id=”google_translate_element” style=”display: inline-block; margin-right: 15px;”></div> |
Przejdź z powrotem do głównego folderu szablonu i otwórz plik _layout.html. Za pomocą narzędzia wyszukiwania znajdź frazę </head>. Bezpośrednio nad znalezioną linią wklej następujący kod:
| <code class=”lang:ruby decode:true”><script type=”text/javascript”> function googleTranslateElementInit() { new google.translate.TranslateElement({pageLanguage: 'pl’, includedLanguages: 'bg,cs,de,en,hr,hu,it,lt,ro,ru,sk,sl,uk’, layout: google.translate.TranslateElement.InlineLayout.SIMPLE, gaTrack: true, gaId: 'UA-13192131-1′}, 'google_translate_element’); } </script> <script type=”text/javascript” src=”https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit” async=”true” defer=”true”></script> </code> |
Opal
Przejdź do folderu z szablonem a następnie otwórz plik znajdujący się pod ścieżką page/header.html. Za pomocą narzędzia wyszukiwania znajdź frazę right-box. Dwie linie pod znalezioną wklej następujący kod (pod tagiem):
| <div id=”google_translate_element” style=”display: inline-block; vertical-align: super; margin-right: 10px;”></div> |
Przejdź z powrotem do głównego folderu szablonu i otwórz plik _layout.html. Za pomocą narzędzia wyszukiwania znajdź frazę </head>. Bezpośrednio nad znalezioną linią wklej następujący kod:
| <code class=”lang:ruby decode:true”><script type=”text/javascript”> function googleTranslateElementInit() { new google.translate.TranslateElement({pageLanguage: 'pl’, includedLanguages: 'bg,cs,de,en,hr,hu,it,lt,ro,ru,sk,sl,uk’, layout: google.translate.TranslateElement.InlineLayout.SIMPLE, gaTrack: true, gaId: 'UA-13192131-1′}, 'google_translate_element’); } </script> <script type=”text/javascript” src=”https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit” async=”true” defer=”true”></script> </code> |