Современный облачный хостинг провайдер | Aéza
Контакты ООО "АЕЗА ГРУПП" ИНН 2312304914 ОГРН 1212300056430

Добавляем на форум Google Translate

H

HDTechVideo

Проверенные
Сообщения
46
Реакции
60
Баллы
8,115
Put this code in the place where you want to put your translate option. I have put it in Logo Header region so that it is easily accessible to all users.

Login to Admin Control Panel
Go to Appearance
Select Template
Edit logo_block
Add this code
Код: 
<div class="google">
<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'en',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>
Edit EXTRA.css
Add this code
Код: 
/* google translate */
.google {
float: right;
margin-top: -35px;
}

Для просмотра этого контента нам потребуется ваше согласие на установку файлов cookie третьих лиц.
Более подробную информацию можно найти на нашей странице cookie.
​
 
Добавляем на форум Google Translate.

В удобное место шаблона logo_block добавляем:
Код: 
<div class="google">
<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'en',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>


В шаблон EXTRA.css добавляем:
Код: 
/* google translate */
.google {
float: right;
margin-top: -35px;
}
 
Чтобы не захламлять форум, добавлю в данную тему еще один вариант встраивания панели Google Translate. Сразу отмечу, что использую на своем сайте стиль Velour, но, думаю, и для стандартного стиля подойдет.

Выглядит это вот так:
Снимок экрана 2014-04-09 в 23.53.42.png Снимок экрана 2014-04-09 в 23.53.54.png

Открываем шаблон Breadcrumb и находим в нем следующие строчки:
Код: 
<fieldset class="breadcrumb">
<a href="{xen:link misc/quick-navigation-menu, '', 'selected={$quickNavSelected}'}" class="OverlayTrigger jumpMenuTrigger" data-cacheOverlay="true" title="{xen:phrase open_quick_navigation}">{xen:phrase jump_to}...</a>
Добавляем после него следующий код:
Код: 
<div class="google">
<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'ru', includedLanguages: 'de,en,fr,it',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>

Примечание:
Так как у себя я убрал меню быстрого перехода (маленькая иконка вызывающая всплывающее окно со ссылками на все разделы форума), мой код выглядит следующим образом:
Код: 
    <fieldset class="breadcrumb">
        <!--<a href="{xen:link misc/quick-navigation-menu, '', 'selected={$quickNavSelected}'}" class="OverlayTrigger jumpMenuTrigger" data-cacheOverlay="true" title="{xen:phrase open_quick_navigation}">{xen:phrase jump_to}...</a>-->
  
<div class="google">
<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'ru', includedLanguages: 'de,en,fr,it',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>
*Строка "includedLanguages: 'de,en,fr,it'" ограничивает количество доступных языков перевода страницы.

Теперь идем в шаблон EXTRA.css и вставляем туда следующий код:
Код: 
/* google translate */
.google {
display: inline-block;
float: right;
margin: 4px 0;
overflow: hidden;
}

Чтобы не захламлять форум, добавлю в данную тему еще один вариант встраивания панели Google Translate. Сразу отмечу, что использую на своем сайте стиль Velour, но, думаю, и для стандартного стиля подойдет.

Выглядит это вот так:
[ATTACH]15210[/ATTACH] [ATTACH]15211[/ATTACH]

Открываем шаблон Breadcrumb и находим в нем следующие строчки:
[CODE]<fieldset class="breadcrumb">
<a href="{xen:link misc/quick-navigation-menu, '', 'selected={$quickNavSelected}'}" class="OverlayTrigger jumpMenuTrigger" data-cacheOverlay="true" title="{xen:phrase open_quick_navigation}">{xen:phrase jump_to}...</a>
Добавляем после него следующий код:
Код: 
<div class="google">
<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'ru', includedLanguages: 'de,en,fr,it',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>

Примечание:
Так как у себя я убрал меню быстрого перехода, мой код выглядит следующим образом:
Код: 
    <fieldset class="breadcrumb">
        <!--<a href="{xen:link misc/quick-navigation-menu, '', 'selected={$quickNavSelected}'}" class="OverlayTrigger jumpMenuTrigger" data-cacheOverlay="true" title="{xen:phrase open_quick_navigation}">{xen:phrase jump_to}...</a>-->
     
<div class="google">
<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'ru', includedLanguages: 'de,en,fr,it',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>
*Строка "includedLanguages: 'de,en,fr,it'" ограничивает количество доступных языков перевода страницы.

Теперь идем в шаблон EXTRA.css и вставляем туда следующий код:
Код: 
/* google translate */
.google {
display: inline-block;
float: right;
margin: 4px 0;
overflow: hidden;
}

#google_translate_element .goog-te-gadget-simple {
font-size: 11px;
border-width: 0;
font-family: "tahoma","verdana","arial",sans-serif;
background-color: #DEE5ED;
}

#google_translate_element .goog-te-gadget-simple A:hover {
text-decoration: none;
}
Класс #google_translate_element добавил с целью переназначения стандартных классов Google, и тем самым несколько адаптировать внешний вид панели к стилю форума.

Собственно это все, что требуется сделать. Перевод прекрасно работает, переводит все, включая сообщения в чате TaigaChat. Рабочий вариант можно посмотреть тут - I-SRC.Ru

Надеюсь, кому-то мой вариант пригодится.
 
Последнее редактирование:
carliker, что-то сообщение как-то поломалось у Вас. Какие-то куски кода внизу. ))
 
Hope написал(а):
carliker, что-то сообщение как-то поломалось у Вас. Какие-то куски кода внизу. ))
Нажмите для раскрытия...
Вы имеете ввиду куски кода в посте или на сайте? :-)
В посте действительно какой-то косяк образовался, вероятно при редактировании вылез.
 
Подскажите пожалуйста как добавить панельку переводчика правее Оповещений
17-10-2014_21-29-38.png
 
navigation_visitor_tab
 
  • Мне нравится
Реакции: A1ex
carliker написал(а):
Чтобы не захламлять форум, добавлю в данную тему еще один вариант встраивания панели Google Translate. Сразу отмечу, что использую на своем сайте стиль Velour, но, думаю, и для стандартного стиля подойдет.

Выглядит это вот так:
Посмотреть вложение 15210 Посмотреть вложение 15211

Открываем шаблон Breadcrumb и находим в нем следующие строчки:
Код: 
<fieldset class="breadcrumb">
<a href="{xen:link misc/quick-navigation-menu, '', 'selected={$quickNavSelected}'}" class="OverlayTrigger jumpMenuTrigger" data-cacheOverlay="true" title="{xen:phrase open_quick_navigation}">{xen:phrase jump_to}...</a>
Добавляем после него следующий код:
Код: 
<div class="google">
<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'ru', includedLanguages: 'de,en,fr,it',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>

Примечание:
Так как у себя я убрал меню быстрого перехода (маленькая иконка вызывающая всплывающее окно со ссылками на все разделы форума), мой код выглядит следующим образом:
Код: 
    <fieldset class="breadcrumb">
        <!--<a href="{xen:link misc/quick-navigation-menu, '', 'selected={$quickNavSelected}'}" class="OverlayTrigger jumpMenuTrigger" data-cacheOverlay="true" title="{xen:phrase open_quick_navigation}">{xen:phrase jump_to}...</a>-->

<div class="google">
<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'ru', includedLanguages: 'de,en,fr,it',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>
*Строка "includedLanguages: 'de,en,fr,it'" ограничивает количество доступных языков перевода страницы.

Теперь идем в шаблон EXTRA.css и вставляем туда следующий код:
Код: 
/* google translate */
.google {
display: inline-block;
float: right;
margin: 4px 0;
overflow: hidden;
}

Чтобы не захламлять форум, добавлю в данную тему еще один вариант встраивания панели Google Translate. Сразу отмечу, что использую на своем сайте стиль Velour, но, думаю, и для стандартного стиля подойдет.

Выглядит это вот так:
[ATTACH]15210[/ATTACH] [ATTACH]15211[/ATTACH]

Открываем шаблон Breadcrumb и находим в нем следующие строчки:
[CODE]<fieldset class="breadcrumb">
<a href="{xen:link misc/quick-navigation-menu, '', 'selected={$quickNavSelected}'}" class="OverlayTrigger jumpMenuTrigger" data-cacheOverlay="true" title="{xen:phrase open_quick_navigation}">{xen:phrase jump_to}...</a>
Добавляем после него следующий код:
Код: 
<div class="google">
<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'ru', includedLanguages: 'de,en,fr,it',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>

Примечание:
Так как у себя я убрал меню быстрого перехода, мой код выглядит следующим образом:
Код: 
    <fieldset class="breadcrumb">
        <!--<a href="{xen:link misc/quick-navigation-menu, '', 'selected={$quickNavSelected}'}" class="OverlayTrigger jumpMenuTrigger" data-cacheOverlay="true" title="{xen:phrase open_quick_navigation}">{xen:phrase jump_to}...</a>-->
   
<div class="google">
<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'ru', includedLanguages: 'de,en,fr,it',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>
*Строка "includedLanguages: 'de,en,fr,it'" ограничивает количество доступных языков перевода страницы.

Теперь идем в шаблон EXTRA.css и вставляем туда следующий код:
Код: 
/* google translate */
.google {
display: inline-block;
float: right;
margin: 4px 0;
overflow: hidden;
}

#google_translate_element .goog-te-gadget-simple {
font-size: 11px;
border-width: 0;
font-family: "tahoma","verdana","arial",sans-serif;
background-color: #DEE5ED;
}

#google_translate_element .goog-te-gadget-simple A:hover {
text-decoration: none;
}
Класс #google_translate_element добавил с целью переназначения стандартных классов Google, и тем самым несколько адаптировать внешний вид панели к стилю форума.

Собственно это все, что требуется сделать. Перевод прекрасно работает, переводит все, включая сообщения в чате TaigaChat. Рабочий вариант можно посмотреть тут - I-SRC.Ru

Надеюсь, кому-то мой вариант пригодится.
Нажмите для раскрытия...
Круто ! Спасибо! Но почему то отображается две менюшки, делал первый вариант.

1.jpeg

Так же вопрос, как сделать так что бы было не "выбрать язык", а по английскому эти слова.
 
Последнее редактирование:
Эти все вопросы к гуглу, какой код они дали, такой и есть. :)
 
HDTechVideo написал(а):
Put this code in the place where you want to put your translate option. I have put it in Logo Header region so that it is easily accessible to all users.
Нажмите для раскрытия...
Пришел иноземец опять со своим самоваром. На их сайтах принципиально не поддерживаются другие языки, тем более русский. Так пусть учат русский
 
Hope написал(а):
Эти все вопросы к гуглу, какой код они дали, такой и есть. :-)
Нажмите для раскрытия...
Спасиб) Просто такое видимо только у меня) И на каких то страницах форума одно окошко, на каких то два))

PaulZibert написал(а):
Спасиб) Просто такое видимо только у меня) И на каких то страницах форума одно окошко, на каких то два))
Нажмите для раскрытия...
Парни может есть мысли?)
 
я добавлял сначала туда и было то же самое, если про дублирование панельки, поэтому переделал, но не разбирался почему так. Кроме того места и того что я указал, есть и другие.
 
Войдите или зарегистрируйтесь для ответа.
Современный облачный хостинг провайдер | Aéza
Контакты
ООО "АЕЗА ГРУПП" ИНН 2312304914 ОГРН 1212300056430 г. Краснодар, ул. Маяковского 160, офис 2.4

Похожие темы

MrOne
  • Закрыта
  • Решено
Оптимизация VPS (apache2 + nginx + mysql)
Ответы
1
Просмотры
1K
Smalesh
Smalesh
M
  • Статья
XenForo 2.1: Что нового для разработчиков в XF 2.1?
Ответы
12
Просмотры
3K
Exile
Exile
Domenic
Гугл транслит(переводчик) в боковой панели - Google Translate in sidebar
Ответы
10
Просмотры
1K
Jekon123
J
Pokschubin
  • Вопрос
Ищу Modern off canvas menu system
Ответы
6
Просмотры
1K
Pokschubin
Pokschubin
Dimanok
Добавляем мониторинг игровых серверов к себе на форум
Ответы
0
Просмотры
1K
Dimanok
Dimanok
Назад
Сверху Снизу