Япа-кнопки
Япа-кнопка предназначена для сайтов и авторов, которые хотят предоставить читателям возможность оперативно голосовать или добавлять на япу ссылку на статью. Процесс япа-кнопизации сайтов неумолимо продвигается!
Умная япа-кнопка покажет количество голосов за статью, этим она лучше статической ссылки с картинкой. И к ней гораздо легче прикрутить скины.
Доступно 4 варианта кнопки: широкая (wide), стандартная (medium), компактная (compact) и иконка (icon).
перейти сразу к кнопко-конструктору
![]() | ![]() | ![]() | ![]() |
Wide | Medium | Compact | Icon |
- пометить ссылки (<a>) специальным классом. Этот класс даст понять скрипту где
будут расположены кнопки. На странице может быть несколько тегов <a>, и
соответственно - несколько кнопок. Обратите внимание - у ссылок проставлен
href на страницу добавления новостей в Япу. Без него кнопка не будет работать как задумано! - подключить наш скрипт, который находится по адресу http://www.yapa.ru/static/api/buttons.js. Скрипт достаточно подключить один раз - он найдет все помеченные теги и заменит их кнопками.
Иногда удобно подключать скрипт динамически, то уменьшает время загрузки страницы. Для этого с помощью JavaScript создайте тег script и проставьте в аттрибут src ссылку на наш скрипт.
<script type="text/javascript">
(function() {
var s = document.createElement('SCRIPT');
var s1 = document.getElementsByTagName('SCRIPT')[0];
s.type = 'text/javascript';
s.async = true;
s.src = 'http://www.yapa.ru/static/api/buttons.js';
s1.parentNode.insertBefore(s, s1);
})();
</script>
<!-- Wide Button -->
<a class="yap-button yap-wide"
href="http://www.yapa.ru/submit?url=http%3A%2F%2Fsupersite.com%2Fhomemade-secrects.html">
</a>
<!-- Medium Button -->
<a class="yap-button yap-medium"
href="http://www.yapa.ru/submit?url=http%3A%2F%2Fsupersite.com%2Fhomemade-secrects.html">
</a>
<!-- Compact Button -->
<a class="yap-button yap-compact"
href="http://www.yapa.ru/submit?url=http%3A%2F%2Fsupersite.com%2Fhomemade-secrects.html">
</a>
<!-- Icon Button -->
<a class="yap-button yap-icon"
href="http://www.yapa.ru/submit?url=http%3A%2F%2Fsupersite.com%2Fhomemade-secrects.html">
</a>
Настройки Япа-кнопки
Как видите, hrefу кнопки имеет параметр url, который указывает адрес страницы с новостью. Также туда можно добавлять другие опции.
Url
Это обязательный параметр. Опция устанавливает канонический адрес страницы с новостью. Лучше если он будет постоянный, тогда ваши новости не будут клонироваться и ссылка всегда будет одна и та же.
Обратите внимание: Значение это параметра должно быть валидным. То есть все спецсимволы (например, слэш) надо заэкранировать так, как это делает функция encodeURIComponent. Например,
http://mashable.com/2010/03/18/yapa-social-news
превращается в
http%3A//mashable.com/2010/03/18/yapa-social-news
Title
Это заголовок будущей новости. Максимум 75 символов - этого вполне достаточно.
<a
class="yap-button yap-medium"
href="http://www.yapa.ru/submit?url=http%3A//yapanarium.com/2010/03/18/yapa-news&title=Yap%3A%20The%20Future%20of%20Social%20News%3F"
>
</a>
В этом примере параметр title указывает, что текст "Yap: The Future of Social News?" должен быть использован в качестве заголовка новости.
Обратите внимание: Как и url опция - title должен быть экранирован по необходимости.
media & category
С помощью этих двух опций можно выставить категорию и тип новости (текст, картинка или видео).
Значения media могут быть такими:
- text (Текст)
- video (Видео)
- image (Картинка)
Значения category могут быть такими:
- society (Общество)
- politics (Политика)
- business (Бизнес)
- lifestyle (Происшествия)
- entertainment (Юмор)
- gaming (Игры)
- technology (Технологии)
- science (Наука)
- sports (Спорт)
- auto (Авто)
- world_news (В мире)
- travel (Путешествия)
- other (Разное)