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

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

irbees2008 irbees2008 Опубликовано - 23 - мая Интерфейс
4607 - 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.Ну вроде все,кому что не понятно смотрим источник или исходники,стили можно править под себя.

Можешь почитать и вот эту статейку "Плагин ognews"

Опрос

Ваше мнение

На каком движке ваш сайт?
Результаты

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

Теги

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

Статистика

  • Caйту: 4488 дней
  • Новостей: 566
  • Комменты: 257
  • Зарегистрированно : 670
  • Онлайн всего: [11]
  • Гости: [11]
  • Были сегодня : [3] Google, Яндекс, dankeanke
  • SQL запросов: 34
  • Генерация страницы: 0.408сек
  • Потребление памяти: 5.164 Mb 
  •   Яндекс.Метрика