Ставим голосовой поиск в форму поиска на сайте

Сeгoдня в пoискax интeрeснoгo мaтeриaлa нaбрeл нa сaйт в пoискe кoтoрoгo работает голосовой поиск ,ну я давай сразу гуглить и нашел статейки как поставить голосовой поиск на сайт.И сейчас мы поставим его себе на сайт.И так приступим1.Идем в папку шаблона и открываем файл search.form.tpl2.Ищем там строчку примерно такуюКод: <input type="search" placeholder="Поиск…" value="" name="search" />это наше поле поиска3.Меняем это поле на вот это изменёноеКод: <input type="search" placeholder="Поиск…" name="search" x-webkit-speech="" speech=""/>мы просто добавили x-webkit-speech=»» speech=»»4. Сохраняем и любуемся голосовым поиском5.Также можно добавить автоматическое отправление по распознаванию поискового запроса.Это будет выглядеть такКод: <input type="search" placeholder="Поиск…" name="search" x-webkit-speech="" speech="" onwebkitspeechchange="this.form.submit();"/>Но лучше всего оставить возможность отредактировать неправильно распознаный поисковый запрос пользователю.6.Также можно изменить стиль нашего микрофончика в поле поиска по умолчанию у кнопки такие стилиКод: input::-webkit-input-speech-button { -webkit-appearance: -webkit-input-speech-button; display: inline-block;} Пример с изменением картинки Код: input::-webkit-input-speech-button { -webkit-appearance: button; background: url(‘../img/mikrofon.png’) no-repeat; width: 10px; height: 10px float: right;} Картинку заливаете свою прописываете свой адрес до картинки7.По умолчанию, Google берет данные о языке распознавания исходя из выбранного языка в Google Chrome, но и здесь можно все изменить добавив метатегКод: <meta http-equiv=’Content-Language’ content=’ru_RU’ />8.Ну вроде все,надеюсь не утомил Всем привет.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

3 + двадцать =