Soundcite – инструмент для встраивания аудио непосредственно в текст

Фрагмент интерфейса сайта SoundCite.
Фрагмент интерфейса сайта SoundCite.

Аудио явля­ет­ся мощ­ным инстру­мен­том, кото­рый может доба­вить эмо­ций или кон­текст исто­рии. К сожа­ле­нию, аудио­кли­пы застав­ля­ют нас делать выбор: либо читать, либо слу­шать, но не два вари­ан­та сра­зу. С помо­щью SoundCite мож­но добав­лять встро­ен­ное аудио в ваши исто­рии.

Для того что­бы создать встро­ен­ный отре­зок аудио­фай­ла, необ­хо­ди­мо прой­ти три шага.

Шаг 1

Необ­хо­ди­мо вста­вить пря­мую ссыл­ку на аудио­файл либо на SoundCloud и нажать на кноп­ку Load.

Шаг 2

Необ­хо­ди­мо выде­лить нуж­ный отре­зок аудио­фай­ла, ука­зав началь­ную и конеч­ную вре­мен­ные точ­ки. Здесь так­же нуж­но про­пи­сать текст, кото­рый будет являть­ся сво­е­го рода ссыл­кой. Далее необ­хо­ди­мо нажать на Create clip и появит­ся код вида <span class=«soundcite» data-id=«55728529» data-start=«0» data-end=«10000»>listen</span>

Шаг 3

Для того что­бы аудио про­иг­ры­ва­лось в тек­сте на вашем сай­те, необ­хо­ди­мо свер­ху ваше­го мате­ри­а­ла вста­вить код <link href=”//cdn.knightlab.com/libs/soundcite/latest/css/player.css” rel=“stylesheet” type=“text/css”><script type=“text/javascript” src=”//cdn.knightlab.com/libs/soundcite/latest/js/soundcite.min.js”></script>

Итог

В ито­ге, вста­вив нуж­ные строч­ки кода в свой буду­щий мате­ри­ал, мож­но полу­чить аудио, встро­ен­ное в текст. При­ме­ры мож­но посмот­реть на сай­те Soundcite.

Сложности

Если у вас сайт на WordPress, как и у нас, то могут воз­ник­нуть про­бле­мы с пра­виль­ным отоб­ра­же­ни­ем. Это свя­за­но с пра­ва­ми авто­ров и адми­ни­стра­то­ров ваше­го сай­та. В раз­де­ле помо­щи Soundcite есть инфор­ма­ция об этом.

Сайт: SoundCite.