Хаки и Скрипты Next Generation CMS

Голосовой поиск на JS

irbees2008 irbees2008 Опубликовано - 23 - мая Интерфейс
4785 - 0
  • Автор: Daniel-Hug
  • Адаптировал: irbees2008
  • Источник:
  • Уровень сложности исполнения: нужны навыки css html
  • Демо:

В предыдущей статье я писал о голосовом поиске на сайте,но как оказалось хром отказался от такого поиска,и работал этот поиск не во всех браузерах. Пришлось еще погуглить и нашёл альтернативу на JS и сейчас распишу как его установить.
Итак приступим
1.Скачиваем исходник Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем. ,распаковываем и заливаем файл speech-input.css в папку со стилями шаблона и файл speech-input.js .
2.Подключаем стиль в хеад

Код:
<link rel="stylesheet" href="{{ tpl_url }}/css/speech-input.css">
3.Перед закрытием тега body подключаем скрипт
Код:
<script src="{{ tpl_url }}/js/speech-input.js"></script>
4. Открываем файл search.form.tpl и редактируем примерно так
Код:
<style>.si-wrapper input {font-size: 12px;	padding: 3px;}</style>
<form role="search" method="get" class="search-form" action="{form_url}">
<input type="hidden" name="category" value="" />
<input type="hidden" name="postdate" value="" />
<div class="si-wrapper">
<input type="search" class="si-input" placeholder="Поиск…" name="search" />
<button class="si-btn">speech input
<span class="si-mic"></span>
<span class="si-holder"></span>
</button>
</div>
<button type="submit">Найти</button>
</form>
5.Ну вроде все,кому что не понятно смотрим источник или исходники,стили можно править под себя.

Можешь почитать и вот эту статейку "Шпаргалка по форматам даты"

Опрос

Ваше мнение

какой форум лучше для вас
Результаты

Последние комментарии

Теги

Anything in here will be replaced on browsers that support the canvas element

Статистика

  • Caйту: 4704 дня
  • Новостей: 580
  • Комменты: 257
  • Зарегистрированно : 692
  • Онлайн всего: [89]
  • Гости: [88]
  • Поисковики: [1] Google
  • Были сегодня : [1] Google
  • SQL запросов: 32
  • Генерация страницы: 0.377сек
  • Потребление памяти: 5.168 Mb 
  •   Яндекс.Метрика